Шаблонизатор Pug/jade - ускоритель для HTML
Прокачайте свои навыки по HTML, освоив современный инструмент веб-разработки Pug (ранее jade).
Описание:
Вы научитесь:
- Основам работы с шаблонизатором Pug на реальных примерах
- Научитесь писать вёрстку на шаблонизаторе Pug (jade), создавать независимые блоки кода для импорта и последующей модификации на любые страницы
- Использовать переменные, условия-возможности, также включать расширенный функционал с помощью вложенных страниц, шапки, подвалы, файлы конфигурации и многое-многое другое
- Научитесь использовать шаблон, дополнять его, расширять и т.д.
- Познакомитесь с миксинами, заметно упрощающими однотипное наполнение сайта
- Увидите, как использовать возможности других языков вместе с языком Pug, таких как препроцессоры CSS
- Также узнаете о возможностях языка JavaScript, которые сделали Pug поистине потрясающим инструментом современного фронтенд-разработчика
- Создадите большой макет с разными фишками - переменными, условиями, с подключениями других блоков на сайт, с использованием миксинов, где это было нужно. С использованием конфигурационного файла, дополнения этого файла, изменений и прочих нюансов.
Программа курса:
1. Введение. Подготовка окружения.
- 1.1 Введение
- 1.2 Настройка среды разработки для Pug
2. Основы синтаксиса PUG(JADE)
- 2.1 Быстрые теги HTML и вложенность
- 2.2 Работа с текстом внутри тегов
- 2.3 Быстрое добавление классов и идентификаторов
- 2.4 Расширенная работа с атрибутами
- 2.5 Создание базовой структуры HTML-документа
3. Работа с шаблонами
- 3.1 Создание родительских и дочерних шаблонов
- 3.2 Добавления в блоки - в конец и в начало
- 3.3 Переменные и условия для конфигурации шаблона
- 3.4 Обновление конфигурации для каждой страницы
4. Работа с другими языками внутри PUG
- 4.1 Добавление строчного JS или CSS
- 4.2 Использование языковых фильтров
- 4.3 Подключение внешнего HTML
5. Продвинутые техники шаблонизатора PUG
- 5.1 Возможности JavaScript
- 5.2 Использование миксинов. Пример со слайдером
- 5.3 Меню с использованием миксина
6. Заключение
- 6.1 Подведение итогов