Иконка

Frontend-разработчик. От Middle до Senior

Профессиональная переподготовка, 380 ак.часов/5 месяцев

Записаться на курс

Треугольник
Треугольник
Треугольник

Аннотация курса

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

Во время обучения вы сами:

  • Развернёте платформу Node.js на своём компьютере и облачном хостинге
  • Создадите клиентские сценарии для извлечения данных из удалённых ресурсов и построения элементов интерфейса пользователя
  • Создадите элементы интерфейса пользователя с помощью библиотек Vue и React

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

Профессиональные стандарты

Курс соответствует:

  • профессиональному стандарту 06.035 «Разработчик Web и мультимедийных приложений» (уровни 4-6)
  • национальному стандарту Российской Федерации ГОСТ Р 56413-2015/CWA 16458:2012 "Информационные технологии. Европейские профили профессий ИКТ-сектора", идентичный международному документу CWA 16458:2012 "Европейские профили профессий ИКТ-сектора".

Предварительные требования

  • Знание основ алгоритмизации, программирования, теории БД
  • Владение HTML и CSS

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

  • JavaScript. Основы программирования (60 часов)Стрелка вниз
    • Тема 1. Основные понятия языка JavaScript.

      Структура программы. Файлы. Выполнение программы в разных средах: в браузере и в интерфейсе командной строки (nodejs CLI). Жизненный цикл приложения на JavaScript.

    • Тема 2. Зависимости.

      Некоторые базовые инструменты (npm, yarn, turbo, nodemon, eslint). Формат JSON. Структура и назначение файла package.json

    • Тема 3. Переменные и области видимости JavaScript.

      Типы данных. Контроль типов данных. Приведение типов. Применение Unicode в JavaScript.

    • Тема 4. Функции.

      Стандартные и стрелочные функции. Возврат значения функцией. Анонимные функции (лямбды). Модели вызова функции. Передача и привязывание аргументов. Аргументы по умолчанию.

    • Тема 5. Функция как тип данных.

      Замыкания и коллбэки. Таймер. Веб-воркеры.

    • Тема 6. Управляющие конструкции JavaScript.

      Ветвление, кейсы, циклы с предусловием и постусловием, со счётчиком и без счётчика. Тернарный оператор. Контроль ошибок (try..catch).

  • Javascript. Событийно-ориентированное программирование (110 часов)Стрелка вниз
    • Тема 1. Объектная модель документа.

      Манипулирование элементами по их селекторам (querySelector). Изменение свойств каскадных стилей. Создание элементов и фрагментов DOM (documentFragment).

    • Тема 2. События.

      Слушатели событий. Всплывание событий. Кастомные события. Создание примера приложения с коммуникацией компонентов.

    • Тема 3. Считывание информации из внешнего интернет-ресурса.

      Кросс-доменные запросы. Интерфейс fetch. Считывание и интерпретация данных в формате JSON.

    • Тема 4. Строки

      Операции над строками. Дополнение строки до заданной длины. Обращение и конкатенация строк. Иммутабельность строк. Регулярные выражения. Валидация полей формы с помощью регулярных выражений.

    • Тема 5. Ссылочные типы данных. Массивы

      Итерация по массиву. Генерация непрерывного массива. Маппинг и свёртка. Синхронные коллбэки и предикаты в массивах: сортировка и фильтрация.

    • Тема 6. Создание объектов (plain JavaScript objects).

      Связь с форматом JSON. Сериализация объектов. Массивоподобные объекты. NodeCollection: новый взгляд на старую проблему. Создание объектов с помощью литерала, прототипа и класса. Энумерабельность и итерабельность.

    • Тема 7. Канвас. Динамическое рисование на холсте с помощью JavaScript.

      Создание паттернов для фонового изображения веб-страницы. Сходства и различия с манипулированием SVG-элементами.

    • Тема 8. Библиотеки

      Использование функциональности сторонних библиотек для создания пользовательского интерфейса и манипулирования данными (на примере jQuery). Библиотеки манипулирования датами (на примере Moment).

    • Тема 9. Веб-компоненты и шаблонизаторы на клиентской стороне.

      Использование Shadow DOM и веб-компонентов для расширения функциональности веб-документа. Шаблонизаторы: императивный и декларативный подход. Использование шаблонизатора на клиентской стороне (на примере Handlebars).

    • Тема 10. Подготовка и размещение итогового проекта.
  • Javascript. Технологии профессионального программирования. (130 часов)Стрелка вниз
    • Тема 1. Развитие стандарта JavaScript.

      Стандарт ECMAScript. Ecma International, Technical Committee 39 и эволюция предложений (proposals). Преобразование JavaScript-кода с помощью транспилятора babel. Плагины и пресеты. Типизация. Типизированные массивы. Понятие буфера и потока.

    • Тема 2. Модульность

      Модульность в экосистеме JavaScript/NodeJS. Импорт и экспорт в стиле CommonJS и нативная ES2015-модульность. Модули в Node.js и в браузере. Асинхронная загрузка модулей. Изоморфный JavaScript-код. Сбор проекта с помощью бандлера - на примере Webpack.

    • Тема 3. Асинхронное программирование на JavaScript

      Коллбэки и ад коллбэков. Миграция к промисам. Промисификация и асинхронные функции. Синхронное ожидание промисов (async/await). Функции-генераторы. Связь генераторов и итераторов.

    • Тема 4. Элементы функционального программирования на JavaScript

      Цепочки методов и функциональный подход к манипулированию элементами DOM. Функциональный и императивный стиль в манипулировании массивами: forEach vs for of Лямбды (безымянные функции). Функции высшего порядка. Контекст this: стандартные функции JavaScript и стрелочные функции. Иммутабельность функций. Чистые функции. Немедленно вызываемые функции (IIFE). Паттерны вызова функций и паттерны передачи аргументов (внедрение зависимостей). Рекурсия и безымянная рекурсия. Обход древовидных структур.

    • Тема 5. Элементы объектно-ориентированного программирования на JavaScript.

      Проектирование структуры предметной области. ORM - Object Relational Mapping. Геттеры и сеттеры. Объекты как коллекции свойств и пространства имён. Мутабельность объектов. Встроенные объекты. Проектирование цепочки методов. Прототипы объектов. Функции-фабрики объектов и функции-конструкторы. Классы в современном JavaScript. Конструкторы. Реализация наследования. Обращение к классу-родителю с помощью super.

    • Тема 6. Элементы метапрограммирования на JavaScript

      Рефлексия. Объект Reflect. Создание прокси и ловушек. Символы. Создание итератора с помощью символа Symbol.iterator

    • Тема 7. Проектирование модульных тестов.

      Подготовка наборов кейсов. Модульное тестирование и интеграционное тестирование. Страничное, межстраничное, логическое тестирование. Тестирование клиентского сценария. Тестирование событий, возникающих в интерактивных элементах управления. Асинхронное и промисифицированное тестирование. Тестирование с помощью автоматизации управления браузером на примере Chromium / Puppeteer.

  • Использование JavaScript-фреймворков. Реактивное программирование (40 часов)Стрелка вниз
    • Тема 1. Фреймворки и библиотеки.

      Современная экосистема фреймворков JavaScript.

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

      Язык JSX. Байндинг и реактивность. Состояние. Принципы управления компонентами и их событиями. Жизненный цикл компонентов.

    • Тема 3. Фреймворк Vue.

      Встроенный шаблонизатор и система компонентов.

    • Тема 4. Фреймворк Elm.

      Разработка декларативных интерфейсов.

    • Тема 5. Создание типичного фронтэнд-приложения, работающего с серверным API (на примере плеера видеороликов или микроблога).
  • Дипломное проектирование (40 часов)Стрелка вниз

Преподаватели курса

Государев Илья Борисович

Государев Илья Борисович

Веб-разработчик Senior, преподаватель, к.п.н., доцент

Сивинский Станислав Андреевич

Сивинский Станислав Андреевич

Веб-разработчик Senior, преподаватель

Шуклин Дмитрий Анатольевич

Шуклин Дмитрий Анатольевич

руководитель образовательного центра, к.п.н., доцент