Образовательный курс

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

Научитесь верстать сайты и создавать интерфейсы, соберёте два проекта в портфолио и освоите современную профессию.

Первым 20 участникам курса — скидка 40%

Курс идеально подойдет

Новичкам в IT

Вы научитесь создавать собственные проекты, освоите профессию frontend-разработчика и начнёте карьеру в этой сфере.

Image

Разработчикам с начальным уровнем

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

Image

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

Image

Верстать сайты и приложения для всех типов устройств.

Image

Применять инструменты проверки и обеспечения адаптивности и кроссбраузерности.

Image

Создавать сайты и приложения с помощью JavaScript.

Image

Работать с системой Git (стандарт по управлению исходным кодом) и с сервисом GitHub.

Image

Использовать библиотеки для ускорения и упрощения разработки.

Image

Работать с анимацией для веб-страниц.

скидка 40% первым 20

Программа курса

Программа курса содержит 2 основных блокa.

  1. Веб-верстка

    Вводный модуль
    • Как работают сайты. Backend и frontend. Вёрстка.
    • Как выглядит и из чего состоит код веб-страницы.
    • Установка редактора кода Sublime Text.
    • Простая веб-страница на HTML. Тэги и атрибуты.
    • CSS-стили. Селекторы, параметры и значения.
    HTML
    • Структура HTML5-документа.
    • Обзор и демонстрация работы основных HTML-тэгов.
    • Вёрстка веб-форм. Поля и кнопки. Валидация форм.
    • Таблицы и табличная вёрстка.
    • Семантическая вёрстка. Стандарты и валидность.
    Основы CSS
    • Как можно задавать стили. Селекторы.
    • Отступы, поля, размеры и единицы измерения.
    • Inline- и block-элементы, свойство display.
    • Обтекание, позиционирование и слои.
    • Блочная вёрстка.
    • Цвета, шрифты, фон и границы.
    Основы JavaScript
    • Что такое JavaScript и как его подключать к веб-странице.
    • Библиотека jQuery. Управление стилями элементов.
    • Обработка событий.
    • Работа с DOM, изменение, добавление и удаление элементов.
    • Отображение и скрытие элементов, анимация.
    • Работа с сетью, получение и отправка данных.
    • JavaScript-фреймворки.
    Адаптивность и кроссбраузерность
    • Ширина экрана и “резиновость” сайта.
    • Media-запросы.
    • Flexbox.
    • Шаги адаптивности и сетки.
    • Разнообразие браузеров и их особенности.
    • Инструменты проверки и обеспечения адаптивности и кроссбраузерности.
    Оформление
    • Фон, прозрачность и градиенты.
    • Границы, аутлайны и тени.
    • Шрифты и оформление текста. Типографика и спецсимволы.
    • Стили указателей.
    • Изображения. Форматы, сжатие, cпрайты, iconfonts. Favicon.
    • Рисование на веб-странице. SVG и Canvas.
    Advanced CSS
    • Сложные селекторы. Свойство !important
    • Псевдо-классы и псевдо-элементы.
    • Трансформации, переходы и анимации.
    • Стандарты именования в CSS. Методология БЭМ.
    • Библиотеки стилей: Bootstrap, Semantic UI, Material UI.
    • Шаблонизаторы (Twig, Haml) и препроцессоры (SASS, LESS, Stylus).
    Инструменты верстальщика
    • Размещение своих работ в Интернете. Домен и хостинг.
    • Инструменты командной разработки. Таск-трекеры и Git.
    • Сборщики, минификаторы и оптимизаторы проектов.
    • Инструменты прототипирования.
    • Другие среды разработки. NetBeans, WebStorm.
  2. JavaScript

    Знакомство с языком
    • Что умеет JavaScript и почему он так популярен?
    • Инструменты разработчика
    • Hello, world!
    • Синтаксис языка
    Основы
    • Интро
    • Числа
    • Строки
    • Логические (булевые) значения
    • NaN (Not a Number)
    • Infinity
    • Математические операторы
    • Переменные
    • Преобразование типов
    • Условия
    • Циклы
    Функции
    • Интро
    • Объявление и вызов функций
    • Аргументы
    • Локальные и глобальные переменные
    • Hoisting
    • Возвращаемые значения
    • Рекурсия
    Массивы и объекты
    • Понятие объектов
    • Объекты в JavaScript
    • Перебор свойств объекта
    • Массивы
    • Стандартный объект Math
    • Стандартный объект String
    • Стандартный объект Array
    • Стандартный объект Date
    Замыкания
    • Глобальный объект window
    • Сборщик мусора
    • Замыкания
    • IIFE
    Объекты и конструкторы
    • Функции-конструкторы
    • Контекст вызова
    • Привязка контекста (call, apply и bind)
    Объектно-ориентированное программирование
    • ООП. Наследование, инкапсуляция, полиморфизм
    • Функциональное наследование
    • Прототипное наследование
    • Прототипы стандартных объектов
    Разное
    • Объект arguments
    • setTimeout и setInterval
    • Выполнение кода через eval
    • Обработка исключений (throw, catch)
    • Регулярные выражения
    • Строгий режим (strict mode)
    JavaScript в браузере, DOM
    • Интро
    • DOM
    • Порядок выполнения скриптов
    • Селекторы
    • Свойства и методы элементов
    • События и обработчики
    • Погружение и всплытие событий
    Web API
    • Интро
    • Console
    • Window
    • Document
    • Информация о браузере и истории переходов
    • LocalStorage и SessionStorage
    • ContentEditable
    • Разнообразие Web API
    Клиент и сервер
    • Клиент-серверное взаимодействие (интро)
    • Запуск локального сервера
    • AJAX и callback
    • JSON и Promise
    • API и WebSocker
    jQuery
    • Библиотека jQuery. Интро
    • Библиотеки и frameworks. Интро
    • Возможности jQuery
    • Анимация
    • AJAX
    • Плагины
    Современный JavaScript, ES 2015
    • История стандарта ECMAScript. Интро
    • Транспиляция и полифиллы
    • Let и const
    • Деструктуризация
    • Rest и spread
    • Template strings
    • Стрелочные функции и параметры по умолчанию
    • Классы и наследование
    Сборка проектов
    • Что такое сборка проектов и для чего она нужна?
    • Node.js
    • npm
    • Gulp
    • Webpack
    React
    • DOM и императивный подход. Интро
    • React и декларативный подход
    • Подготовка рабочего пространства
    • Простое React-приложение
    • Разделение на компоненты
    Redux
    • Интро
    • Ключевые принципы Redux
    • Установка зависимостей и разделение на компоненты
    • Создание store и reducers
    • Создание actions
    • Запуск приложения
    Бонус
    • Библиотеки и фреймворки 2017
    • Развитие стандарта ECMAScript
    • Тестирование кода
    Экзаменационное задание

Получите полную программу и индивидуальную консультацию

Дипломные проекты

Подтвердят вашу квалификацию и закрепят полученные знания.

Сайт-портфолио

Вы создадите лендинг по продвижению вас как разработчика.

Image

Аналог Instagram

Вы самостоятельно разработаете веб-интерфейс — аналог популярной социальной сети.

Image

Преподаватели

Ваш путь от новичка до frontend-разработчика

Резюме после прохождения

Андрей Семёнов Андрей Семёнов frontend-разработчик

Ожидаемая зарплата от 60 000

  • React JavaScript-библиотека для создания пользовательских интерфейсов

  • Webpack Модульный компилятор для приложений на JavaScript.

  • Grunt Инструмент для сборки JavaScript-проектов из командной строки и планировщик задач.

  • Gulp Инструмент для автоматического выполнения задач frontend-разработки.

  • Ajax Подход к построению интерактивных пользовательских интерфейсов веб-приложений без видимой перезагрузки веб-страниц.

  • Git Распределённая система контроля версий и платформа для совместной разработки.

  • Bootstrap Шаблонный набор инструментов HTML и CSS для типографики, веб-форм, кнопок, меток, блоков навигации и прочих компонентов веб-интерфейса.

  • JavaScript Клиентский язык программирования для создания интерактивных элементов на веб-страницах.

  • HTML5 Новая версия языка HTML и набор технологий для создания сайтов и веб-приложений.

  • CSS3 Язык разметки и каскадные таблицы стилей третьего поколения.

  • jQuery Фреймворк JavaScript для взаимодействия JavaScript, HTML и CSS.

Ключевые навыки:
  • Адаптивная и кроссбраузерная верстка.
  • Взаимодействие со внешними сервисами.
  • Сборка проектов.
  • Работа с Web API.
  • Владение методологией БЭМ.
  • Основы React и Redux.
  • Работа с протоколами HTTP/HTTPS.
  • Знание Node.js.

Диплом Skillbox

Подтверждает успешное прохождение курса «Frontend-разработчик»

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

Стоимость обучения

Скидка 40% первым 20

Стоимость обучения 75 000

3 750 Рассрочка без первого взноса

45 000 Для первых 20 студентов

Гарантия возврата денег в течение 14 дней

Запишитесь на курс

Дата начала: 31 мая

Осталось: 15 мест

О Skillbox

Максимально практическое обучение от лидеров digital-рынка. Курсы от компаний, работающих на реальных проектах.

После обучения вы можете трудоустроиться в эти компании или к партнёрам университета.

25 000 +

студентов учатся на наших курсах

82%

студентов довольны преподавателями

89%

выпускников получают карьерный рост

94%

выпускников довольны курсом и результатом

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

  1. Я никогда не занимался разработкой. У меня получится?

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

  2. Действуют ли какие-нибудь программы рассрочки?

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

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

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

  4. Получится ли совмещать с работой?

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

или получить

Появились вопросы по курсу?

Оставьте ваш номер телефона, и наш специалист свяжется с вами, чтобы дать подробную информацию.