Школа Frontend-разработки SkillFactory

Курс «Frontend-разработчик»

09 : 10 : 44 : 44
Скидка действует
Цена на курс вырастет с 1 октября

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

Получите перспективную творческую специализацию в IT
Можно с нуля
Оставьте заявку
Наши менеджеры свяжутся с вами в ближайшее время
Формат обучения
онлайн в удобное время
Старт следующего потока
9 месяцев (или 360 часов)
Длительность, рекомендуемая Skillfactory
скоро
курс Frontend-разработчик

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

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

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

Почему Frontend-Developer?

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

Вы получите реальный опыт

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

Реальный опыт даст:

Реальные проекты в портфолио
Участие в стажировках и хакатонах
Шанс получить оффер от компании-заказчика
Опыт работы над проектом в команде
Поэтому мы придумали Фэктори

Веб-приложение для проверки контрагентов

Создадите сложную фронтенд-часть для поиска публикаций о юрлице с подключением по API. Это интересный проект от компании СКАН для реально существующего сервиса, который предназначен для проверки надежности подрядчиков. Получите обратную связь от заказчика, кейс в портфолио и шанс трудоустройства.
  • HTML
  • JavaScript
  • CSS
  • API
  • React
  • GIT

Сервис подбора психолога

Сервис YouTalk помогает людям найти своего психолога или терапевта. Вы же поможете компании найти новых клиентов — и разработаете сайт для их полезного блога. Результат можно положить в портфолио и презентовать работодателю.
  • HTML
  • Figma
  • CSS
  • GitHub
  • БЭМ
  • Git

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

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


Для кого онлайн-курс

Для новичков

Кто хочет обучиться программированию с нуля. Программа онлайн-курса рассчитана для начинающих фронтенд-разработчиков и построена так, что вы сможете ее освоить даже без технического бэкграунда.

Для фрилансеров

Для тех, кто хочет сменить профессию

Кто готов прокачать свои скилы — освоить JavaScript и React, чтобы браться за более комплексные задачи. Вы сможете вырасти как специалист и пополнить своё резюме новыми кейсами.
Кто хочет пройти обучение по фронтенд разработке и получить специальность, которая станет надежным фундаментом в будущем и обеспечит стабильным заработком.

Что вы изучите на онлайн-курсе

  • Создавать веб-страницы при помощи HTML и CSS. Адаптировать страницы для разных устройств
    1
  • Использовать JavaScript и Bootstrap для создания интерактивных страниц и элементов
    2
  • Применять фреймворк React. js для разработки сложных проектов
    3
  • Подключаться к бэкенду с использованием Node. js и хранить код в Git
    4

Прохождение онлайн-курса в Skillfactory

Цель специализации «Frontend-разработчик» — дать системную подготовку и полный набор базовых знаний и умений для того, чтобы заниматься практической разработкой визуальной части веб-приложений. Начинающий должен превратиться из новичка в уверенного разработчика уровня Junior.

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

После наших курсов студенты в среднем зарабатывают 6 450 BYN

Senior-специалист
в иностранной компании
Middle-специалист
6 000 $
Junior-специалист
Senior-специалист
6 450 BYN
Frontend-разработчик Junior
*По данным rabota.by
3 000 BYN
9 800 BYN
Чтобы посмотреть как устроена работа в большой IT-компании
Чтобы быстрее влиться в среду
Чтобы расти в карьере и работать из любой точки мира


Как проходит онлайн-курс

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

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

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

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

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

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

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

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

Вас ждут пять увлекательных проектов на JavaScript
проекты на 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

3 месяца
Программирование на JavaScript
3 месяца
JavaScript - один из самых популярных и распространенных языков. Его используют для создания фронтенда - это страницы сайта, которые открываются в браузере.

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

Чтобы решать реальные задачи, которые требуются на фронтенде, нужно понять, что такое объектно-ориентированное программирование и научиться применять ООП в JavaScript.
Вы научитесь:
Практика:
— Тренажер по Javascript
— 76 задач на Javascript
— Проект: слайдер на сайте
— Использовать объекты и EventLoop
— Создавать сложные скрипты с обработкой событий
— Работать с форматом JSON
— Использовать препроцессоры CSS
— Работать по методологии БЭМ
— Применять сборщики (Webpack)
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
Для профессионального программирования нужны более сложные подходы и инструменты - изучите набор библиотек 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-тесты для проверки работы небольшой части кода
Что отличает настоящего программиста от верстальщика? Знание того, как всё устроено изнутри.
В этом блоке вы изучите изнанку сайтов — бэкенд. Научитесь соединять фронтенд с бэкендом, узнаете, что такое API и познакомитесь с Node.js.

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

Карьерный трек

1 месяц
Карьерный трек
1 месяц
Умение программировать - это хард-скилы. Для успешной работы нужны еще софт-скилы.

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

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

Финальный проект — разработка сервиса для поиска публикаций в СМИ

Вам нужно будет:

У компании существует API для поиска публикаций о юрлице по ИНН в средствах массовой информации. Ваша задача — разработать клиентскую часть сервиса.
Техническое задание подготовлено сотрудниками компании СКАН.
В ходе дипломного проекта вы проверите в деле навыки работы с JavaScript, React.js и Redux.
За 4 недели создадите сервис, который можно будет показать работодателю на GitHub.

После освоения материалов вы получите

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

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

Узнайте, как преобразилась их жизнь
Сергей Димов
34 года, Абакан
Привет. Меня зовут Сергей. Я учусь в Skillfactory на курсе full-stack разработчик на JavaScript вот уже 2 месяца.
Валентин Ветюков
Всем привет. Меня зовут Валентин. Живу и работаю в Москве.
Москва
Марина Кононенко
Привет. Я Марина, и я учусь на курсе по фронтенд-разработке от Skillfactory.
Максим Якимов
Привет. Меня зовут Максим. Я изучаю курс «фронтенд-разработчик».
Ольга Шутылева
Харьков
Привет. Меня зовут Ольга. Живу в Харькове. Работаю на госслужбе.
Татьяна Мирко
30 лет, Москва
Добрый день. Я маркетолог. Учусь в Skillfactory по специальности фронтенд-разработчик.
Николай Шумаков
Москва
Привет. Меня зовут Николай, и я являюсь студентом Skillfactory по программе фронтенд-разработчик.

Ваше резюме после курса

Антон Иванов
фронтенд-разработчик
3 000 BYN
  • писать страницы на чистом 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

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

Стоимость онлайн-курса

при рассрочке на 36 месяцев без первоначального взноса и переплат
83 BYN/мес
184 BYN/мес
-55%

Получите доступ

  • Научитесь создавать веб-страницы при помощи HTML и CSS

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

  • Изучите применение фреймворка React. js для разработки сложных проектов

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

Обновление в программе курса

  • Полностью обновили блок про 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
Говорят эксперты
Посмотрите вебинар Михаила Князева о входе в профессию фронтенд-разработчика, где он рассказывает, как найти первый проект, чего не стоит бояться при смене профессии и каких сотрудников сейчас ждет рынок программирования.

Frontend-разработка в 2020 году: как построить успешную карьеру с первого захода?

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

Сейчас на HH.kz открыто более 4000 вакансий фронтенд-разработчиков, включая топовые компании. Кроме того, вы сможете брать полноценные проекты, сайты, приложения, интерфейсы на фриланс-биржах.
Заполните форму,
чтобы узнать больше
Ваша персональная
WOW-скидка
Бронируйте курс
по лучшей цене
Заполните форму, чтобы узнать больше