Эксклюзивный партнер
SkillFactory в Армении
burger
Каталог Программирование Специализация Frontend-разработчик

Специализация
Frontend-разработчик

Получите перспективную творческую профессию в IT
Days
Hours
Minutes
Seconds
Онлайн в удобное время
Формат обучения
Длительность обучения
9 мес


Кто такой Frontend-разработчик

Frontend-разработчик программирует внешнюю сторону сайта — то, с чем соприкасается пользователь. Для этого нужно хорошо знать разметку страницы, стили и JavaScript.

JavaScript позволяет разрабатывать игры, сайты и сервисы с интересными эффектами. С его помощью создают яркие, запоминающиеся проекты, на которые пользователь захочет вернуться:
— Бесконечный скролл страницы (Pinterest)
— Браузерные игры (BrowserQuest, The Convergence)
— Сервис Timeline
— и другие
Если английский — это основной язык современного мира, то JavaScript — это основной язык современного интернета. На нем написано большинство ресурсов, на которые вы заходите каждый день.

Почему Frontend-Developer?

Первое место на графике популярности языков по данным Github
Frontend-разработка сейчас и несколько лет назад — совершенно разные вещи. Это связано с тем, что технологии во фронтенде обновляются каждые полгода, надо постоянно учиться. 5 лет назад можно было свободно устроиться джуном, зная только HTML и CSS и совсем чуть-чуть JS. Сегодня надо уже хорошо знать JS и желательно иметь представление о каком-нибудь фреймворке.
А через 5 лет порог входа в профессию вырастет еще в 2−3 раза.
Михаил Князев
Senior Frontend Developer


Frontend-разработчики уверены в своем будущем

Востребованность профессии
Сегодня на портале hh.ru 9000+ вакансий, где требуется знание JavaScript. В 2021 году, по данным Habr, уровень зарплат вырос на 17%. Фронтенд-разработчиков ищут Сбер, Яндекс, МТС, Билайн, Тинькофф, VK, Aviasales, Ozon.
Мобильность и свобода выбора
Вы можете работать из дома, в офисе, в любом городе, в любой стране.
Специалистов в IT не хватает
По прогнозам Минцифры, к 2027 году дефицит кадров в IT составит 2 млн человек. Сейчас самое время войти в профессию.


Для кого курс

Для новичков
Кто хочет обучиться программированию с нуля. Программа курса рассчитана для начинающих фронтенд-разработчиков и построена так, что вы сможете ее освоить даже без технического бэкграунда.
Для фрилансеров
Кто готов прокачать свои скилы — освоить JavaScript и React, чтобы браться за более комплексные задачи. Вы сможете вырасти как специалист и пополнить своё резюме новыми кейсами.
Для тех, кто хочет сменить профессию
Кто хочет пройти обучение по фронтенд разработке и получить специальность, которая станет надежным фундаментом в будущем и обеспечит стабильным заработком.
Обучение в SkillFactory
Цель специализации «Frontend-разработчик» — дать системную подготовку и полный набор базовых знаний и умений для того, чтобы заниматься практической разработкой визуальной части веб-приложений. Начинающий должен превратиться из новичка в уверенного разработчика уровня Junior.

Выпускники смогут самостоятельно:
• Создавать адаптивные веб-сайты с использованием CSS, Flexbox
• Разрабатывать интерактивные веб-сайты и приложения на JavaScript и HTML
• Писать сложные компоненты на React и интерфейсы с авторизацией и подключением к backend


Как проходит обучение на курсе

Теория и тренажеры

В модулях курса вы изучаете материалы и теорию, смотрите видеоуроки,
а на тренажерах отрабатываете практику
Как проходит обучение
Основа для программиста — это изучение базы, то есть синтаксиса языка. Любой язык программирования начинается с изучения основных конструкций, шаблонов написания кода, алгоритмов и структур данных. Прежде чем приступать к написанию кода, вам нужно будет углубиться в документацию и логику построения команд.

Синтаксис включает правила написания кода:
— HTML: разметка страниц
— CSS: стили и расположение элементов
— JavaScript: логика и взаимодействие элементов
— React: популярная библиотека под JS

Чтобы закрепить результат, важно практиковать теорию на большом количестве задач — для этого в программе курса «Frontend-разработчик» используются тренажеры.

Во время просмотра вебинаров, на которых преподаватель в прямом эфире пишет и разбирает код, вы будете тренировать насмотренность. Примеры на уроках помогают также считывать логику программирования.
Получите полную программу специализации «Frontend-разработчик»

Реальные проекты

Вас ждут пять увлекательных проектов на JavaScript

Сайт, слайдер и канбан-доска

Весь срок обучения frontend-разработке с упором на практику наши студенты выполняют сквозные проекты и один финальный. Все проекты можно будет потом добавить в портфолио и резюме.

1 проект
Сайт-визитка. Вы создадите свой первый полноценный сайт, используя инструменты верстки — HTML и CSS.

2 проект
Верстка лендинга по макету. Чтобы основательно закрепить навыки в HTML и CSS, вам будет предложен макет веб-сайта, сделанный в Figma.

3 проект
Слайдер на JavaScript. Следующий проект, который войдет в ваше портфолио, — это реализация на веб-сайте слайдера с использованием чистого JavaScript, или так называемого VanillaJS.

4 проект
Канбан-доска на React. В четвертом проекте, основываясь на макете из Figma, вы реализуете веб-приложение, которое представляет собой задачник со статусами каждой задачи. Приложение будет развернуто с использованием Create React App.

5 проект
Финальный проект: клиентская часть веб-приложения для учета краж в сервисе проката велосипедов с подключением по API.

Программа обучения

1 месяц
Верстка веб-страниц
1 месяц
Верстка веб-страниц
Практика:
— 2 тренажера: HTML и CSS
— 70 задач на верстку
— 2 проекта: сайт-визитка и верстка лендинга по макету
Frontend-разработчику не обойтись без знания верстки: HTML - это своего рода кирпичики, из которых состоят страницы сайтов.

Так что после небольшой вводной части вы сразу перейдете к главному: освоите базовые технологии верстки — HTML и CSS. Научитесь создавать страницы и адаптировать их под разные устройства.

Это значит, что уже в первый месяц учебы вы сможете брать небольшие заказы на фриланс-биржах. Научитесь работать с Github и публиковать там свои проекты для будущих работодателей.
— Выстраивать внешнюю логику сайта
— Писать страницы на чистом HTML
— Позиционировать элементы на странице с помощью CSS
— Создавать логичную и последовательную иерархию страниц при помощи семантической верстки
— Использовать Google DevTools, средства разработчика в браузере
— Верстать адаптивные веб-страницы на Flexbox
— Работать в GitHub
Вы научитесь:
2 месяца
Программирование на JavaScript
2 месяца
Программирование на JavaScript
Практика:
— Тренажер по Javascript
— 76 задач на Javascript
— Проект: слайдер на сайте
JavaScript - один из самых популярных и распространенных языков. Его используют для создания фронтенда - это страницы сайта, которые открываются в браузере.

Вы не просто изучите JavaScript, вы научитесь программировать на нем, то есть решать задачи.

Чтобы решать реальные задачи, которые требуются на фронтенде, нужно понять, что такое объектно-ориентированное программирование и научиться применять ООП в JavaScript.
— Использовать объекты и EventLoop
— Создавать сложные скрипты с обработкой событий
— Работать с форматом JSON
— Использовать препроцессоры CSS
— Работать по методологии БЭМ
— Применять сборщики (Webpack)
Вы научитесь:
Практика:
— Тренажер по Javascript
— 76 задач на Javascript
— Проект: слайдер на сайте
JavaScript - один из самых популярных и распространенных языков. Его используют для создания фронтенда - это страницы сайта, которые открываются в браузере.

Вы не просто изучите JavaScript, вы научитесь программировать на нем, то есть решать задачи.

Чтобы решать реальные задачи, которые требуются на фронтенде, нужно понять, что такое объектно-ориентированное программирование и научиться применять ООП в JavaScript.
— Использовать объекты и EventLoop
— Создавать сложные скрипты с обработкой событий
— Работать с форматом JSON
— Использовать препроцессоры CSS
— Работать по методологии БЭМ
— Применять сборщики (Webpack)
Вы научитесь:
3 месяца
Разработка с помощью React.js
3 месяца
Разработка с помощью React.js
Практика:
— Тренажер по React.js
— 45 задач по React.js
— Проект: канбан-доска на React
Для профессионального программирования нужны более сложные подходы и инструменты - изучите набор библиотек React. Сможете создавать модульные проекты, обрабатывать сложные события в браузере, делать анимацию на странице.

Все эти навыки требуются в большинстве современных проектах, поэтому их указывают компании в своих вакансиях.

Но вы получите даже больше - еще и познакомитесь с другими фреймворками: Angular и Vue.js, это расширит ваши возможности по выбору проектов.
— Разрабатывать приложения на React
— Писать компоненты на React
— Использовать продвинутый API
— Создавать приложение на Angular
— Создавать приложение на Vue.js
— Использовать анимацию на CSS или на React
— Применять библиотеку Redux
Вы научитесь:
Практика:
— Тренажер по React.js
— 45 задач по React.js
— Проект: канбан-доска на React
Для профессионального программирования нужны более сложные подходы и инструменты - изучите набор библиотек React. Сможете создавать модульные проекты, обрабатывать сложные события в браузере, делать анимацию на странице.

Все эти навыки требуются в большинстве современных проектах, поэтому их указывают компании в своих вакансиях.

Но вы получите даже больше - еще и познакомитесь с другими фреймворками: Angular и Vue.js, это расширит ваши возможности по выбору проектов.
— Разрабатывать приложения на React
— Писать компоненты на React
— Использовать продвинутый API
— Создавать приложение на Angular
— Создавать приложение на Vue.js
— Использовать анимацию на CSS или на React
— Применять библиотеку Redux
Вы научитесь:
1 месяц
Архитектура приложений и бекенд
1 месяц
Архитектура приложений и бекенд
Практика:
— 15 задач по Node, Redux, React
— Финальный проект: клиентская часть для учета краж в сервисе проката велосипедов с подключением по API
Что отличает настоящего программиста от верстальщика? Знание того, как всё устроено изнутри.
В этом блоке вы изучите изнанку сайтов — бэкенд. Научитесь соединять фронтенд с бэкендом, узнаете, что такое API и познакомитесь с Node.js.

Все эти навыки нужны для итогового проекта. На нем вы проверите и закрепите свои знания и сможете пополнить им свое портфолио.
— Подключать приложение к базе данных
— Разворачивать приложение на Node.js
— Писать unit-тесты для проверки работы небольшой части кода
Вы научитесь:
Практика:
— 15 задач по Node, Redux, React
— Финальный проект: клиентская часть для учета краж в сервисе проката велосипедов с подключением по API
Что отличает настоящего программиста от верстальщика? Знание того, как всё устроено изнутри.
В этом блоке вы изучите изнанку сайтов — бэкенд. Научитесь соединять фронтенд с бэкендом, узнаете, что такое API и познакомитесь с Node.js.

Все эти навыки нужны для итогового проекта. На нем вы проверите и закрепите свои знания и сможете пополнить им свое портфолио.
— Подключать приложение к базе данных
— Разворачивать приложение на Node.js
— Писать unit-тесты для проверки работы небольшой части кода
Вы научитесь:
1 месяц
Карьерный трек
1 месяц
Карьерный трек
Практика:
— Составление резюме, поиск вакансий или заказов
Умение программировать - это хард-скилы. Для успешной работы нужны еще софт-скилы.

Если вы хотите устроиться на новую работу в компанию - обновите свое резюме, подготовитесь к собеседованию, поймете основы командной работы. Если планируете брать заказы на фрилансе - научитесь работать на фриланс-биржах.
— Составлять резюме и сопроводительное письмо
— Готовиться к собеседованию
— Оформлять свой профиль на фриланс-биржах
— Искать заказы на биржах и общаться с заказчиками
— Сотрудничать в командных проектах
— Использовать методы agile
Вы научитесь:
Практика:
— Составление резюме, поиск вакансий или заказов
Умение программировать - это хард-скилы. Для успешной работы нужны еще софт-скилы.

Если вы хотите устроиться на новую работу в компанию - обновите свое резюме, подготовитесь к собеседованию, поймете основы командной работы. Если планируете брать заказы на фрилансе - научитесь работать на фриланс-биржах.
— Составлять резюме и сопроводительное письмо
— Готовиться к собеседованию
— Оформлять свой профиль на фриланс-биржах
— Искать заказы на биржах и общаться с заказчиками
— Сотрудничать в командных проектах
— Использовать методы agile
Вы научитесь:

Итоговый проект

В финале курса вас ждет месяц интереснейшей разработки индивидуального проекта, техническое задание которого основано на реальных заказах на фриланс-биржах.

Их собственные разработчики уже подготовили серверную часть приложения. Вам предстоит реализовать клиентскую часть сайта, где будет:

• Регистрация пользователей с уровнями доступа
• Создание и редактирование случаев кражи
• Комментарии к записям
• Статистика по кражам
Известная компания занимается прокатом велосипедов в крупных городах России и испытывает проблемы с частой кражей их имущества (велосипедов). В качестве возможного решения проблемы компания видит учет этих случаев и отслеживание прогресса.
Вы спроектируете приложение, сверстаете макет, разработаете его фронтенд-часть и обработку API. Этот большой проект в вашем портфолио будет доказательством ваших навыков.

Реальные истории наших студентов

Узнайте, как преобразилась их жизнь
30 лет, Москва
Татьяна Мирко
Набережные Челны
Аркадий Хазанов
27 лет, Москва
Александра Быстрова
Сергей Димов
34 года, Абакан
Артем Белоконский
Киев
Каменск-Уральский
Долговская Виктория
Москва
Валентин Ветюков
Калининград
Антон Пальшин
Москва
Николай Шумаков
Челябинск
Валентин Шунайлов
53 года, Москва
Москва
Ника Гвенетадзе
34 года, Рига
Харьков
Ольга Шутылева

Наши курсы ориентированы на тех, кто работает и хочет сам регулировать нагрузку. Занимайтесь без отрыва от работы и выделяйте на учебу столько времени, сколько есть прямо сейчас, — 15 минут или 2 часа в день.
Для развития навыков у нас есть 5 видов практики: тренажёры, тесты, домашние задания, проекты и хакатоны. Разнообразие форматов помогает усваивать знания максимально эффективно.
Все менторы — опытные практики из IT-индустрии. Они дают качественную обратную связь на задания, отвечают на вопросы и помогают студенту достичь своих целей во время обучения. Выпускники оценивают менторскую поддержку на 9,1 балла из 10.

Координаторы постоянно на связи, чтобы решить любой организационный вопрос. Их задача — мотивировать студентов и помочь дойти курс до конца.
Занимайтесь в своем темпе
80% обучения — практика в разных форматах
Теория разбита на короткие блоки, после которых обязательно идёт практика.

Вы смотрите короткие видео, изучаете текстовые материалы и приступаете к заданиям, чтобы закрепить знания.
Менторы и координаторы помогут дойти до конца
20% обучения — интересная и важная теория
Учитесь в любое время и в любом месте с мобильного, планшета или ноутбука

Эффективный формат онлайн-обучения

Команда курса

  • Наталья Крестинина
    Frontend-разработчик в EPAM Systems, преподаватель в Webpurple, ментор в RSSchool, автор раздела ReactJS.
  • Богдан Коновченко
    Senior Frontend в Radario, автор раздела JavaScript.
  • Сергей Михайлов
    Руководитель разработки The Makers, 10 лет в отрасли, разработчик тренажеров.
  • Дарья Короткова
    Ведущий инженер в газовой сфере. Опыт работы в ИТ более 7 лет. Стек: PHP, mySQL, JS-технологии. Разрабатывала системы для опроса телеметрии, систему для оценки качества сварки судостроительной технологии и различные сайты на популярных CMS системах.
  • Дмитрий Бондарчук
    Lead Software Engineer в EPAM
    к.ф.-м.н. в области NLP (natural language processing).
  • Юлия Токаревская
    Frontend-разработчик с опытом 7 лет. Работает в компании Emplifi
    В команде разрабатывала платформы для управления и анализа контента в соцсетях, платформы для службы поддержки, криптовалютной биржи.
    Стек: Javascript, React.js, Redux-Saga, Typescript

Записаться на курс
-40%
34 438 ֏/мес
57 396 ֏/мес
В рассрочку на 12 мес
percent Кешбэк 30%: 123 975 баллов на Lerna
Специализация Frontend-разработчик
Длительность: 9 мес
Старт курса: 26 февраля
Заполните контактные данные
Имя
Телефон
E-mail
Промокод
Название компании
Отправить заявку
Ознакомиться с условиями публичного договора
success
error
warning
Обновление в программе курса
  • Полностью обновили блок про API браузера: Drag & Drop SVG Canvas, Geolocation, Notification, Screen size Event Source, WebSocket
  • Добавили новый раздел «Инструменты для автоматизации»: Dev server + hot reload, Разница prod и dev-окружения, Контракты и mock server Pre-коммит хуки, БЭМ, минификаторы
  • В раздел HTML добавили темы про iframe и accessibility
  • В разделе по CSS добавили @-rules, Progressive enhancement и graceful degradation

Часто задаваемые вопросы