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

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

Получите перспективную творческую профессию в IT
Формат обучения
Онлайн в удобное время
Старт следующего потока
9 мес
Длительность обучения
25 ноября

Кто такой 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

Чему вы научитесь

  • Создавать веб-страницы при помощи HTML и CSS. Адаптировать страницы для разных устройств

    1
  • Использовать JavaScript и Bootstrap для создания интерактивных страниц и элементов

    Такой специалист может быстро запустить сайт или веб-сервис.
    2
  • Применять фреймворк React. js для разработки сложных проектов

    3
  • Подключаться к бэкенду с использованием Node. js и хранить код в Git

    4
Обучение в 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 месяц
Frontend-разработчику не обойтись без знания верстки: HTML - это своего рода кирпичики, из которых состоят страницы сайтов.

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

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

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

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

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

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

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

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

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

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

Занимайтесь в своем темпе
80% обучения — практика в разных форматах
Менторы и координаторы помогут дойти до конца
20% обучения — интересная и важная теория

Ваши навыки после курса

Антон Иванов
фронтенд-разработчик
  • писать страницы на чистом HTML

  • позиционировать элементы на странице с помощью CSS

  • использовать Google DevTools, средства разработчика в браузере

  • верстать адаптивные веб-страницы на Flexbox

  • работать с форматом JSON

  • использовать препроцессоры CSS

  • применять методологию БЭМ

  • разрабатывать приложения на React
  • использовать сборщики (Webpack)

  • работать в GitHub

  • делать анимацию на CSS или на React

  • применять библиотеку Redux

  • подключать приложение к базе данных

  • разворачивать приложение на Node. js

  • писать unit-тесты для проверки работы небольшой части кода
Я умею:
Инструменты:
HTML — язык разметки гипертекстовых документов, отвечает за размещение элементов на странице: помогает отображать в браузере отформатированный документ.
CSS — язык описания внешнего вида документа, отвечает за то, как выглядят веб-страницы: цвет фона и декоративных элементов, размер и стиль шрифтов.
JavaScript — интерпретируемый язык программирования, который используют для написания frontend- и backend-частей сайтов, а также мобильных приложений.
React — библиотека для JavaScript, используется для реализации реактивности — когда в ответ на изменение одного элемента меняется все остальное.
Node.js — платформа с открытым исходным кодом для работы с языком JavaScript. Позволяет писать серверный код для веб-приложений и динамических веб-страниц.
Redux — инструмент для управления состоянием данных и пользовательским интерфейсом в приложениях JavaScript с большим количеством сущностей.
GitHub — сервис для совместной разработки и хранения программного кода. C помощью GitHub над кодом проекта может работать неограниченное количество программистов.
DOM — объектная модель документа, которую браузер создает в памяти компьютера на основании HTML-кода.
БЭМ — «Блок, Элемент, Модификатор», компонентный подход к веб-разработке, в основе которого лежит принцип разделения интерфейса на независимые блоки.
Webpack — сборщик модулей, который позволяет скомпилировать JavaScript-модули в единый JS-файл. Обрабатывает модули, строит между ними граф зависимостей, а потом генерирует единый файл.

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

  • Наталья Крестинина
    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

Записаться на курс
-45%
5 301 ₽/мес
9 638 ₽/мес
В рассрочку на 18 мес
Скидка по промокоду:
Кешбэк 30%: 28 623 балла на Lerna
Специализация Frontend-разработчик
Длительность: 9 мес
Старт курса: 25 ноября
Заполните контактные данные
Имя
Телефон
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

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