Продвинутый курс HTML-вёрстки

Учебная программа: 

1. Настройки окружения и Pug.
   Pug, возможности, примеры использования.
   Сочетание Pug с БЭМ.
   Собираем статический сайт с Pug.
   Построение универсального шаблона.
2. Gulp, NPM. 
   Файловая структура проекта.
   Автоматизация, менеджер задач Gulp.
   Параллельное и последовательное выполнение задач.
   Модули автоматизации: оптимизация кода и графики, сборки препроцессоров, livereload etc. 

3. Sass, LESS, PostCSS
   Импортирование.
   Переменные, вложения, амперсанд.
   @media.
   Примеси.
   Очередность написания в контексте селектора.

4. Git, Github и кодгайд
   Алиасы, ключи.
   Работа с ветками.
   Знакомство с git flow.
   Создание страниц на Github Pages.
   Автоматическая проверка.
   Внедрение stylelint в рабочий проект.
   Gulp-плагины для доработки вёрстки (авто-типографы, автофиксы и прочее).
   Визуальное регрессионное тестирование.

5. Wow-эффекты и адаптивность
   Визуализация графики в браузере.
   Адаптивность.
   Ретинизация графики в стилях и в разметке.

6. SVG
   Знакомство с SVG, способы импорта, оптимизация SVG.
   Встраивание SVG-объектов в DOM.
   Оформление SVG (прозрачность, углы, градиенты, бордюр), анимация.
   Библиотеки элементов (SVG-спрайты), внедрение в страницу и внешним файлом.

7. Оптимизация скорости загрузки страниц
   Измерение скорости загрузки.
   Имитация медленной сети и слабых устройств.
   Способы оптимизации изображений.
   Загрузка шрифтов: еще раз о проблемах, теперь с решениями.
   Методы увеличения скорости загрузки/отрисовки (lazy-load и прочие).

8. CSS Grid
   Знакомство с CSS Grid.
   Практические примеры.
   Использование в реальных проектах.

9. JavaScript часть 1
   Взаимодействие JS с HTML и CSS: селекторы DOM, свойства DOM-объектов.
   Функции, переменные, условия, типы данных, циклы, отладка ошибок в консоли.
   События.

10. JavaScript часть 2
    Интерактивные карты, работа с API.
    Работа с формами.

11. JavaScript часть 3
    Валидация и отправка форм.
    HTTP, JSON, FormData.