Шаблонизатор Pug. Верстка многостраничных сайтов в Pug. Ускорение верстки. Как быстро верстать. PUG.

preview_player
Показать описание
Детальное описание принципов работы шаблонизатора Pug, его синтаксиса, практическое применение. Принципы верскти одностраничных и многостраничных сайтов, автоматизация подключения миксинов. Настройка Webpack.

На развитие канала:

Binance ID: 439718976
Карта USD (Visa): 4731 1856 1108 4077
Карта USD (Master Card): 5168 7520 1955 1822
Карта EUR (Master Card): 5168 7451 2144 3672
Карта UAH: 4731 1856 1217 7318

00:00 - Введение
01:29 - Теория. Написание тэгов
01:29 - Теория. Написание атрибутов, классов и идентификаторов
03:14 - Теория. Виды кодов: буферезированный
03:36 - Теория. Виды кодов: небуферезированный
06:02 - Теория. Виды кодов: буферезированный неэкранированный
04:13 - Теория. Виды буферизации кода: неявная
05:10 - Теория. Виды буферизации кода: явная (с помощью =)
07:09 - Теория. Типы данных и переменные
09:47 - Теория. Интерполяции
10:11 - Теория. Интерполяция выражений
11:19 - Теория. Интерполяция с помощью заполнителя
11:51 - Теория. Строковая интерполяция
12:07 - Теория. Тэговая интерполяция
12:43 - Теория. Условные конструкции if-else, unless, case
15:03 - Теория. Перебор массивов и объектов
18:00 - Теория. Include, extends
20:34 - Теория. Mixins
24:36 - Структура проекта
25:26 - Создание страницы
27:05 - Создание блоков head и scripts. Подключение через include
28:18 - Создание главного слоя layout. Наследование с помощью extends
29:05 - Использование block при наследовании через extends
29:36 - Миксины. Создание секций header, categories, footer. Объявление миксинов на верхнем уровне
33:25 - Миксины. Создание библиотеки элементов. Buttons
36:41 - Миксины. Создание библиотеки элементов. Button-group
38:53 - Миксины. Создание библиотеки элементов. Card
40:21 - Миксины. Создание библиотеки элементов. Accordions
43:37 - Миксины. Создание библиотеки элементов. Carousel
50:15 - Верстка одностраничного сайта. Компонуем миксины
53:49 - Автоматизация процесса подключения миксинов
57:24 - Настройка Webpack для верстки многостраничных сайтов
58:38 - Верстка многостраничного сайта. Верстка страницы categories
59:14 - Верстка многостраничного сайта. Верстка страницы about
59:52 - Заключение

Рекомендации по теме
Комментарии
Автор

Не пони маю, почему это видео не в топе. Без воды. Всё чётко, ясно и понятно.

yuritian
Автор

Спасибо за видео! Концентрат знаний по не самой хорошо освещенной на YouTube теме

vjachaslaunekrish
Автор

ох жалко вы больше не делаете видео, у вас получается превосходно, лучше всех что я встречал: быстро, по делу, без воды.

wavex
Автор

Мужик, ты достоен лучшего микрофона, контент шикарен. (какой я ловкий, затролил и похвалил)

avel
Автор

ну просто бомбическое видео!!! круто, без воды, четко и по сути. спасибо автору

АндрейБ-пян
Автор

За счет того, что ты в процессе записи видео не рисуешь слайды/ пишешь большие куски кода, а используешь заготовленный материал получается очень лаконично и информативно. Большое спасибо за видео, все структурированно, только суть, есть и выжимка теории и последовательная практика, причем по созданию собственных заготовок, которые можно использовать в работе. Считаю эталонным примером в области образовательного контента.

МайклБраун-зм
Автор

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

Mila_Nick
Автор

Гений, рассказываешь так, как будто сам написал этот Pug)😀👍

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

круто и спасибо. Отличный разбор по PUG. Было б ещё лучше с примером не в веб-шторме, а VsCode и какие плагины-расширения лучше для преобразования в HTML и обратно

sergejchap
Автор

Молодец, говоришь все быстро и по делу, без всякой нудятины

ПавелБодренков
Автор

Чувак ты просто красавчик, мне нравится твоя тех. подача👍 жду новых выпусков

АнтонЯковлев-гн
Автор

Спасибо за ваш труд, спасибо что поддерживаете актуальным ваши прошлые работы! Будем ждать ваши новые видео, может посвящённые Framework-ам, например React. 😉👍

HellBoyWot
Автор

Супер! Очень понравились ваши слайды, сохранила как шпаргалку по пагу. До этого была каша в голове, особенно касательно способов вставки js в pug

SekiShi
Автор

Не глядя, ставлю ♥️
У автора очень качественный контент

krylovDev
Автор

Интересно было бы посмотреть Ваше видео про prepros 7 в контексте продвинутых настроек. Надеюсь, вы найдете время .

velessn
Автор

Ничего не понимаю в этом🤦‍♂️, но подача крутая👍👍

sergiioleksiienko
Автор

Мне эта тема интересна. Два месяца использую pug. Но с Prepros. Хотелось бы научиться работать с ним через gulp или webpack

frontend
Автор

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

Tony_
Автор

Спасибо большое за видео! А как настроить dev-server, чтобы он открывал нужную страницу при запуске?

alexvolkov
Автор

Может стоит посмотреть больше чем 5 минут, но задам свой вопрос сразу. КАК ВЫНЕСТЫ ДАННЫЕ В ОТДЕЛЬНЫЙ ФАЙЛ? Я устал искать ответ, надеюсь в конце этого видоса у меня будет ответ ))

Xolerik