Відеокурс Шаблонізатор Pug українською мовою - відеоуроки програмування | ITVDN
ITVDN: курси програмування
Відеокурси з
програмування

Замовити дзвінок

Вибери свою IT спеціальність

Підписка

Замовити дзвінок

+38 099 757 27 82

Про курс

Pug – це шаблонізатор або HTML-препроцесор, що дозволяє у зручній манері писати код, який буде  більш зрозумілий для сприйняття людиною. За допомогою шаблонізатору розробник пише менше коду, створює зручні для сприйняття вкладені конструкції, необхідні змінні та інше.

Курс «Шаблонізатор Pug» розглядає особливості цього інструменту. Ви почнете вивчення Pug з історії виникнення та його основних переваг, порівняно з традиційним HTML. Далі крок за кроком  продовжите розгляд  усіх нюансів роботи з цим інструментом.

У ході курсу ви детально дізнаєтесь про особливості синтаксису Pug, його тегів та атрибутів. Будуть докладно розглянуті способи використання тексту в рамках різних тегів, а також ви освоїте можливості управління атрибутами, класами та ідентифікаторами.

Крім основного синтаксису, ви навчитеся працювати з вбудованим кодом JavaScript у Pug, використовувати умовні оператори, а також опануєте створення циклів та міксинів для оптимізації та полегшення роботи над проєктами.

Курс також охоплює важливі аспекти використання макетів та включень, допомагаючи вам освоїти спадкування шаблонів та ефективне використання блоків у своїх проєктах.

На завершальному етапі ви матимете можливість застосувати отримані знання під час створення практичного проєкту, який включатиме розробку повноцінної сторінки з використанням усіх навичок, отриманих під час курсу.

Курс підійде як новачкам, так і досвідченим розробникам, які хочуть поглибити свої знання та навички в роботі з Pug. Для успішного проходження цього курсу необхідні базові знання з HTML, CSS та JavaScript.

Читати далі...
Переглянути безкоштовний урок

Попередні Вимоги

  • Базові знання HTML
  • Базові знання CSS
  • Базові знання JS
Читати далі...

Ви навчитеся

  • Використовувати весь функціонал шаблонізатора Pug.
  • Розуміти основи шаблонізації.
  • Налаштовувати для роботи середовище Pug.
  • Розуміти і використовувати основи Pug: його синтаксис, теги та роботу з текстом.
  • Розуміти використання рядкового тексту (inline) у тегах, вміти використовувати  конвеєрний  (piped) та блоковий текст.
  • Розуміти варіативність атрибутів. Використовувати багаторядкові, логічні атрибути та атрибути “в лапках”. Виконувати розбиття об’єкта на атрибути елемента за допомогою синтаксису &attributes.
  • На практиці використовувати вбудований код Javascript в Pug, а саме: буферизований, небуферизований та неекранований-буферизований код. Також використовувати синтаксис змінних.
  • Використовувати умовний синтаксис в шаблонізаторі Pug, а саме: умовні оператори if та else, оператор unless, оператор case (when).
  • Розуміти та застосовувати цикли each та while в шаблонізаторі Pug.
  • Користуватися міксинами як аналогом функціональних компонентів. Застосовувати атрибути міксинів та так званий Rest Arguments.
  • Застосовувати оператори block , extends, append та prepend.
  • Використовувати Pug для створення структурованих і оптимізованих HTML-шаблонів.
  • Створювати гнучкі та адаптивні макети вебсторінок з використанням всього функціоналу Pug.
  • Розробляти шаблони, що відрізняються чистотою та структурованістю, без використання додаткових стилів та класів CSS.
Читати далі...
Завантажити матеріали курсу Для отримання матеріалів курсу необхідно авторизуватися
Отримати сертифікат Для отримання сертифікату необхідно авторизуватися
  • Тривалість: 6 год 27 хв
  • Уроків: 10
  • Мова: українська

Що входить до курсу

  • 10 відео уроків
  • Домашні завдання
  • Тестування
  • Сертифікат

×

Ви відкрили доступ до тесту! Пройти тест

Ви дійсно бажаєте відкрити доступ до тестування за курсом Шаблонізатор Pug на 40 днів?

Увійдіть або зареєструйтеся для того, щоб продовжити перегляд безкоштовного відео

Ціль уроку – познайомити студентів з явищем шаблонізації, пояснити, для яких потреб вона використовується. Допомогти обрати правильне середовище розробки. Розказати про історію виникнення Pug та розглянути переваги Pug над звичайним HTML.

Читати далі...

Ціль уроку – налаштувати середовище розробки Pug, при цьому встановивши всі необхідні програми, залежності та плагіни. Познайомити студентів із Node.js та таск-менеджером для автоматичного виконання завдань Gulp. Розказати та пояснити принцип роботи нашого базового шаблону Pug для автоматичної компіляції, з яким ми будемо працювати протягом усього курсу.

Читати далі...

Ціль уроку – розглянути базовий синтаксис шаблонізатора Pug, а саме логіку його побудови та різновидність тегів. Навчитись створювати швидкі HTML теги та вкладати їх один в одного. Попрактикуватись вставляти текст всередину тегів, а також додавати необхідні атрибути.

Читати далі...

Ціль уроку – розглянути різні варіанти передачі тексту усередину тегів в Pug. Дізнатись про звичайний та найбільш популярний - рядковий текст (inline) у тегах. Навчитись використовувати так званий конвеєрний текст (piped) та розглянути на практиці доволі популярний блоковий текст. Попрактикуватись із контролем пробілів для запобігання синтаксичних помилок.

Читати далі...

Ціль уроку – навчитись додавати класи та ідентифікатори до тегів, використовуючи скорочений (швидкий) синтаксис Pug. Розглянути варіативність атрибутів, а саме багаторядкові та “в лапках”. Зрозуміти, в яких випадках слід застосовувати логічні атрибути. На практиці засвоїти розбиття об’єкта на атрибути елемента за допомогою синтаксису &attributes.

Читати далі...

Ціль уроку – навчитись додавати коментарі до вашого коду в шаблонізаторі Pug та розуміти різницю між їх видами. Розглянути дуже важливу тему вбудованого коду Javascript в Pug, вміти на практиці використовувати різні види цього коду, а саме: буферизованого, небуферизованого та неекранованого-буферизованого. Засвоїти синтаксис використання змінних в Pug.

Читати далі...

Ціль уроку – навчитись використовувати умовний синтаксис в шаблонізаторі Pug, а саме умовні оператори if та else. Вивчити новий оператор unless для більш стислого та зручного коду. Розглянути на практиці оператор case (when), що по своїй суті є повним аналогом switch (case) в Javascript.

Читати далі...

Ціль уроку – вивчити цикли each та while в шаблонізаторі Pug. Зрозуміти, яким чином вони працюють, вміти контролювати розгалуження та ітерації. Дізнатись про міксини як аналог функціональних компонентів у прогресивних фронтенд-фреймворках. Поговоримо про атрибути міксинів та про задання дефолтного значення аргументу, якщо його не передано користувачем. Розглянемо важливий аспект передачі невідомої кількості аргументів у міксини - так званий Rest Arguments.

Читати далі...

Ціль уроку – навчитись включати різні файли у наш шаблон Pug, використовуючи новий оператор include. Дізнатись про спадкування шаблонів, що дозволяє розділяти складні структури шаблонів сторінок на менші та простіші файли. Вивчити оператори block та extends. На практиці вміти застосовувати блоки append та prepend.

Читати далі...

Ціль уроку – розробити повноцінну сторінку (лендинг) з використанням усіх навичок, здобутих під час даного курсу. Навчитись створювати GitHub репозиторій та заливати туди свій проєкт. На практиці засвоїти процес деплою вашого проєкту на безплатний хостинг Netlify.

Читати далі...
ПОКАЗАТИ ВСЕ

Відгуки наших студентів

DOU

Відгуки в DOU

4,9/5 - 195 відгуків

Віталій Новіцький
Віталій Новіцький
5/5
Проходив курси «JavaScript Стартовый», «JavaScript Базовый» та «HTML5 & CSS3 Углубленный». Матеріал викладається доступно, без лишньої інформації. Незалежно від викладача, кожен курс цікавий по своєму, інформація подається доступно з фокусом на основні деталі. Практичні завдання цікаві й допомагають повністю розібратись в прослуханому матеріалі. Платформа зручна і проста в користуванні. За результатами пройденого матеріалу можна пройти тестування, з об’єктивним оцінюванням засвоєних знань, і отримати сертифікат. Раджу усім.
Почитати оригінал
Facebook

Відгуки в Facebook

5,0/5 - 704 відгуки

Ирина Василенко
Ирина Василенко
5/5
Была участницей акции «Изучай Web Testing бесплатно» на образовательном ресурсе ITVDN.Курс очень насыщенный, много примеров, что для меня важно! Преподаватель показал и рассказал доступно и понятно. Нашла много нового полезного в области тестирования!
Почитати оригінал
Google

Відгуки в Google

4,9/5 - 814 відгуки

Илья Абросимов
Илья Абросимов
5/5
Прошел курс по FLASK (автор Романюк Влад). Влад, подробно и обстоятельно рассказывает о Flask, SQLAlchemy, Marhmallow и прочим инструментам. В конце курса затронута тема потоков и асинхронной работы. На выходе получил хороший проект в Git
Почитати оригінал

Купуй передплатуз доступом до всіх курсів та сервісів

Бібліотека сучасних IT знань у зручному форматі

Вибирай свій варіант підписки залежно від завдань, що стоять перед тобою. Але якщо потрібно пройти повне навчання з нуля до рівня фахівця, краще вибирати Базовий або Преміум. А для того, щоб вивчити 2-3 нові технології, або повторити знання, готуючись до співбесіди, підійде Пакет Стартовий.

Стартовий
  • Усі відеокурси на 3 місяці
  • Тестування з 10 курсів
  • Перевірка 5 домашніх завдань
  • Консультація з тренером 30 хв
59.99 $
Придбати
Базовий
  • Усі відеокурси на 6 місяців
  • Тестування з 16 курсів
  • Перевірка 10 домашніх завдань
  • Консультація з тренером 60 хв
89.99 $
Придбати
Преміум
  • Усі відеокурси на 12 місяців
  • Тестування з 24 курсів
  • Перевірка 20 домашніх завдань
  • Консультація з тренером 120 хв
169.99 $
Придбати

Запитання і відповіді

У чому перевага онлайн курсів програмування у порівнянні з офлайн?
Яка вартість навчання?
Скільки часу знадобиться, щоб опанувати програмування?
Скільки часу знадобиться, щоб опанувати ІТ-спеціальність?
З якого курсу розпочинати навчання?
Як керувати своїм часом та організувати ефективне онлайн-навчання з тренером?
Чи є у вас допомога з працевлаштуванням після закінчення навчання?
Чи можливе персональне навчання з тренером ITVDN?
З якого віку можна навчатися на платформі?
Чи потрібні знання англійської мови для навчання?Чи потрібні знання англійської мови для навчання?
Якого рівня можна досягти, пройшовши навчання зі спеціальності?
Коли закінчиться підписка, що далі? Доступу до уроків не буде?
Чи додаються знижки на придбання підписки?
У чому перевага онлайн курсів програмування у порівнянні з офлайн?

Онлайн курси мають низку переваг перед офлайн форматом:

  1. Незалежність від локації. Онлайн дозволяє навчатися де завгодно.
  2. Збереження часу та грошей на дорогу. Ви економите час та гроші з поїздок на курси та назад.
  3. Онлайн курси дешевші. Немає потреби в приміщенні та ноутбуках для студентів, тому вартість нижча
  4. Комфортний темп навчання, постійний доступ до інформації. Навчання у вашому темпі будь-коли і будь-де 24/7. Також є доступ до записаних уроків, чого немає в офлайн форматі.
Яка вартість навчання?

На ITVDN є 2 формати навчання: Live Online та відео курси. Ціна навчання залежить від обраного вами способу навчання.

Якщо ви хочете навчатися самостійно у форматі відео курсів, вартість навчання складе в середньому 10-15 USD на місяць в залежності від обраного вами пакету підписки.

Live Online – це онлайн навчання з тренером у групах разом із іншими студентами. Навчання у даному форматі коштує в середньому 6-7 USD за одну годину.

Скільки часу знадобиться, щоб опанувати програмування?

Залежить від того, скільки уваги програмуванню ви виділятимете щоденно, яка саме це мова і який у вас досвід кодингу. Середній час на опанування однієї мови за умови регулярних занять хоча б 2 год/день:

  • новачки – від 3 до 6 місяців;
  • ті, хто мають базові знання з іншої мови – від 1 до 3 місяців;
  • професійні програмісти – до 1 місяця.

Найкращий варіант інвестиції часу – 8 годин щоденно (20% теорії + 80% практики). Більше практики – швидше опанування програмування.

Скільки часу знадобиться, щоб опанувати ІТ-спеціальність?

Для опанування ІТ-спеціальності треба виділити не менше 500 годин, з яких близько 100 годин – на перегляд відео уроків або відвідування онлайн занять із ментором, а 400 – на виконання практичних завдань за пройденими темами.

В залежності від того, скільки часу ви готові виділяти на навчання в день, ви зможете пройти програму за 3-8 місяців. Якщо у вас є певна база знань з ІТ, кількість необхідного часу буде меншою.

Також тривалість навчання залежить від обраної вами спеціальності, оскільки набір технологій, які ви маєте вивчити, буде різним. 

З якого курсу розпочинати навчання?

Починати варто з тих, які містять в назві слово “Стартовий”. Такі курси мають вступний матеріал для знайомства з мовою або технологією.

Якщо ж ви плануєте навчатися за конкретною спеціальністю у форматі відео курсів, перейдіть на сторінку спеціальності і прокрутіть до заголовку “Відео курси за спеціальністю …”. Нижче буде список відео курсів, котрі відсортовано в порядку необхідності вивчення.

Ще нижче ви знайдете Roadmap зі спеціальності – путівник, на якому зображені відео курси у вигляді дерева, що також вас легко зорієнтує у послідовності проходження курсів.

Як керувати своїм часом та організувати ефективне онлайн-навчання з тренером?

Якщо ви обираєте Live Online навчання з тренером, все дуже просто:

  • відвідуйте всі заняття, вчасно виконуйте д/з;
  • додатково дивіться відео уроки на ITVDN;
  • після кожного уроку проходьте коротке тестування;
  • практикуйтеся в Інтерактивному практикумі;
  • спілкуйтеся з одногрупниками в ході вирішення д/з, задавайте питання ментору на уроках та поза ними;
  • в кінці кожного курсу складайте екзамен на TestProvider (та отримуйте Сертифікати);
  • в кінці всього навчання проходьте екзамен зі спеціальності і отримайте Диплом.
Чи є у вас допомога з працевлаштуванням після закінчення навчання?

Ми маємо спеціальний розділ – “Вакансії”, котрий допомагає нашим студентам шукати першу роботу в ІТ. Детальніше про можливості та призначення розділу за посиланням.

А для тих, хто навчається онлайн з ментором, у нас додатково передбачена індивідуальна допомога HR-фахівця щодо підготовки до працевлаштування з першого дня навчання і до отримання першого job-оферу. Вона включає в себе допомогу в оформленні соцмереж, підготовці резюме, проведення пробної співбесіди, надання порад щодо пошуку роботи та самопрезентації тощо. 

Чи можливе персональне навчання з тренером ITVDN?

На жаль, дана послуга на ITVDN не передбачена, однак ви можете замовити індивідуальну консультацію з нашим ментором. Деталі ви знайдете за посиланням.

З якого віку можна навчатися на платформі?

На ITVDN відсутні курси для дітей, тому комфортний вік для початку навчання за нашими матеріалами – від 14 років.

Чи потрібні знання англійської мови для навчання?Чи потрібні знання англійської мови для навчання?

Ніяких вимог до вашого рівня англійської ми не висуваємо, оскільки всі навчальні матеріали йдуть російською або українською мовами. При цьому базові знання англійської будуть корисні для комфортного пошуку інформації в гуглі, читання документацій в інтернеті тощо.

Якого рівня можна досягти, пройшовши навчання зі спеціальності?

На ITVDN можна пройти повне навчання з нуля до спеціаліста рівня Trainee/Junior. Якщо ви вже практикуючий розробник, наші відео курси допоможуть поглибити ваші знання до рівня Middle.

Коли закінчиться підписка, що далі? Доступу до уроків не буде?

Після закінчення дії вашої підписки доступ до відео курсів, на жаль, буде закрито. Однак ви зможете користуватися тими навчальними матеріалами, які ви завантажили на свій девайс під час навчання.

Чи додаються знижки на придбання підписки?

Ні, знижки не додаються.

Notification success