Добрий день, друзі!
Сьогодні маємо гарні новини для всіх, хто хоче спростити та прискорити свою техніку верстання вебсторінок – на ITVDN вийшли всі уроки курсу “Шаблонізатор Pug”. Курс українською мовою!
Pug – це HTML-препроцесор, який дозволяє у зручній манері писати код, котрий буде більш зрозумілий для сприйняття людиною. За допомогою шаблонізатору розробник пише менше коду, створює зручні для сприйняття вкладені конструкції, необхідні змінні та інше.
У ході курсу ви детально розберете особливості синтаксису Pug, його тегів та атрибутів. Будуть докладно розглянуті способи використання тексту в рамках різних тегів, а також ви опануєте можливості управління атрибутами, класами та ідентифікаторами.
Навчитеся працювати з вбудованим кодом JavaScript у Pug, використовувати умовні оператори, а також опануєте створення циклів та міксинів для оптимізації та полегшення роботи над проєктами.
На завершальному етапі на вас чекає практика – проєкт, який включатиме розробку повноцінної сторінки з використанням усіх навичок, отриманих під час курсу.
Автор курсу – Кінаш Станіслав, FrontEnd Developer.
Тривалість курсу – 6 годин 27 хвилин.
Структура курсу:
- Pug. Основи шаблонізації.
- Налаштування середовища Pug.
- Основи Pug: синтаксис, теги, текст.
- Робота з текстом всередині тегів.
- Робота з атрибутами. Класи та ідентифікатори.
- Робота зі змінними. Вбудований код JavaScript.
- Умовний синтаксис / Оператор case (when).
- Цикли та міксини.
- Використання макетів та включень.
- Практичний проєкт з використанням Pug.
Чого ви навчитеся на даному курсі:
- Використовувати весь функціонал шаблонізатора Pug.
- Розуміти основи шаблонізації і налаштовувати для роботи середовище Pug.
- Використовувати Pug для роботи з синтаксисом, тегами та текстом.
- Використовувати рядковий текст (inline) у тегах, конвеєрний (piped) та блоковий текст.
- Використовувати умовний синтаксис в шаблонізаторі Pug, а саме: умовні оператори if та else, оператор unless, оператор case (when).
- Розуміти та застосовувати цикли each та while в шаблонізаторі Pug.
- Користуватися міксинами як аналогом функціональних компонентів.
- Застосовувати атрибути міксинів та так званий Rest Arguments.
- Використовувати Pug для створення структурованих і оптимізованих HTML-шаблонів.
- Створювати гнучкі та адаптивні макети вебсторінок з використанням всього функціоналу Pug.
- Розробляти шаблони, що відрізняються чистотою та структурованістю, без використання додаткових стилів та класів CSS.
Попередні вимоги
Курс підійде тим, хто вже має базові знання HTML, CSS та JavaScript.
Дивіться перший урок у вільному доступі. Курс вже доступний на нашому сайті в повному обсязі – до кожного уроку є практичні завдання та опорний конспект для більш глибокого засвоєння матеріалу. Якщо у вас є активна підписка, ви можете дивитися його прямо зараз.
Курс входить до комплексної програми підготовки за спеціальностями:
