Набір учасників [HTML Academy] Веб-пакет

[Gadzhi]

Переглянути вкладення 73168
​

програма курсу:

Розділ 1

введення
Дізнаємося, навіщо потрібен webpack і як його застосувати в будь-якому проекті.
‍

• Що таке webpack
• Базові команди при роботі з webpack-файл package.json
• Демо: створення простого базового конфіга

‍
Практика

• Завдання: збірка тестового проекту
• Рішення: покрокова еталонна реалізація

‍
- Тест по першому розділу

Розділ 2

конфігураційні файли
Розглянемо формати конфігураційних файлів webpack.
‍

• Формат конфігураційних файлів webpack
• Мультисторінкові додатки, основні концепції webpack
• Початок роботи з конфігами додаткових інструментів
• Демо: додавання ESLint і Prettier в готовий проект

Практика

• Завдання: налаштування додаткових залежностей
• Рішення: покрокова еталонна реалізація

- Тест по другому розділу

РОЗДІЛ 3

вхідна точка додатка
Почнемо розглядати основні концепції роботи з webpack.

• Що таке вхідна точка додатка
• Демо: перенесення проекту на webpack
• Демо: мультисторінковий додаток

Практика

• Завдання: налаштування мультисторінкового додатка
• Рішення: покрокова еталонна реалізація

- Тест по третьому розділу

Розділ 4

вихідна точка та збірка програми
Розглянемо концепцію webpack-output.

• Вихід з програми по закінченню розробки. Output
• Нововведення webpack v5
• Оптимізація і кодспліттінг-вендори
• Обробники
• Демо: приклад роботи asset

‍
Практика

• Завдання: оптимізація проекту
• Рішення: покрокова еталонна реалізація
• Завдання: виправлення помилок і пожвавлення проекту
• Рішення: покрокова еталонна реалізація

- Тест по четвертому розділу

Розділ 5

Webpack-плагіни
Розберемо концепцію webpack-плагіни.
‍

• Що таке плагіни і навіщо вони потрібні
• Необхідні в розробці плагіни
• Демо: робота необхідних плагінів, розвиток збірки, мінімальна кастомізація

Практика

• Завдання: налаштування плагінів
• Рішення: покрокова еталонна реалізація
• Завдання: створення і підтримка багатосторінкового додатки
• Рішення: покрокова еталонна реалізація

- Тест по п'ятому розділу

Розділ 6

режими розробки
Вивчимо концепцію webpack-моди.
‍

• Режим розробки
• Production-режим і браузерна підтримка
• Вихідні карти
• Демо: робота webpack в залежності від режиму

‍
Практика

• Завдання: налаштування режимів і їх оптимізація
• Рішення: покрокова еталонна реалізація

‍
Тест по шостому розділу

Розділ 7

Підведення підсумків
Згадаймо, що ми вивчили, підведемо підсумки і закріпимо отримані знання.

• Згадаймо основні моменти
• Демо: приклад роботи динамічно настроюється збірки під кілька сторінок

‍
Практика

• Завдання: збірка багатосторінкового додатка
• Рішення: покрокова еталонна реалізація

‍
- Підбиваємо підсумки курсу
‍
- Підсумковий тест по курсу

https://privatelink.de/?https://levelup.htmlacademy.ru/webpack