Про курс
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
- українська
Що входить до курсу
×
Ви дійсно бажаєте відкрити доступ до тестування за курсом Шаблонізатор 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.
Доступ до повного курсу з навчальними матеріалами та тестуванням на 30 днів за 14,99 USD
Придбати
Запитання і відповіді
Онлайн курси мають низку переваг перед офлайн форматом:
- Незалежність від локації. Онлайн дозволяє навчатися де завгодно.
- Збереження часу та грошей на дорогу. Ви економите час та гроші з поїздок на курси та назад.
- Онлайн курси дешевші. Немає потреби в приміщенні та ноутбуках для студентів, тому вартість нижча
- Комфортний темп навчання, постійний доступ до інформації. Навчання у вашому темпі будь-коли і будь-де 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 відсутні курси для дітей, тому комфортний вік для початку навчання за нашими матеріалами – від 14 років.
Ніяких вимог до вашого рівня англійської ми не висуваємо, оскільки всі навчальні матеріали йдуть російською або українською мовами. При цьому базові знання англійської будуть корисні для комфортного пошуку інформації в гуглі, читання документацій в інтернеті тощо.
На ITVDN можна пройти повне навчання з нуля до спеціаліста рівня Trainee/Junior. Якщо ви вже практикуючий розробник, наші відео курси допоможуть поглибити ваші знання до рівня Middle.
Після закінчення дії вашої підписки доступ до відео курсів, на жаль, буде закрито. Однак ви зможете користуватися тими навчальними матеріалами, які ви завантажили на свій девайс під час навчання.
Ні, знижки не додаються.
Відгуки наших студентів
Відгуки в DOU
4,9/5 - 195 відгуків
Відгуки в Facebook
5,0/5 - 704 відгуки
Відгуки в Google
4,9/5 - 814 відгуки