Программирование [HTML Academy] Онлайн-курс «Webpack» (2023)

  • Автор темы Trinity
  • Дата начала
[HTML Academy] Онлайн-курс «Webpack» (2023)

1682620612803


Для фронтендеров, которые хотят освоить Webpack — один из инструментов, упрощающих разработку.‍
Webpack помогает повысить производительность приложения, оптимизировать код и сократить время на разработку, сборку и тестирование проекта.

Программа курса:
Раздел 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. Подведение итогов
Вспомним, что мы изучили, подведём итоги и закрепим полученные знания.
— Вспомним основные моменты
— Демо: пример работы динамически настраиваемой сборки под несколько страниц
‍Практика
— Задание: сборка многостраничного приложения
— Решение: пошаговая эталонная реализация
‍— Подводим итоги курса
‍— Итоговый тест по курсу

Подробнее:
Скачать:
 

Похожие темы

М
Ответы
0
Просмотры
17
Скоро на Moresliv
Море Слив
М
М
Ответы
0
Просмотры
12
Скоро на Moresliv
Море Слив
М
Trinity
Ответы
2
Просмотры
504
JavaScript
MilkShake
MilkShake
М
Ответы
0
Просмотры
60
Скоро на Moresliv
Море Слив
М
М
Ответы
0
Просмотры
51
Скоро на Moresliv
Море Слив
М
Trinity
Ответы
0
Просмотры
116
Trinity
М
Ответы
0
Просмотры
214
Скоро на Moresliv
Море Слив
М
Trinity
Ответы
0
Просмотры
325
Trinity