Поторопитесь! Заканчивается через 
Видеозаписи лекций без обратной связи и участия преподавателя. Вы получите доступ к материалам сразу после оплаты.
О курсе
Продвинутый и ёмкий курс
Вы изучите все возможные темы, которые относятся к Webpack: от основ эффективной сборки проекта до продвинутых подходов типа code splitting и shimming.
С самых азов
Мы подразумеваем, что вы не знакомы с Webpack, но хотите освоить его и другие технологии, используемые в продакшене на современных проектах.
В комфортном темпе
Мы предоставим вам весь материал по курсу, чтобы вы в своём ритме занимались изучением Webpack.
Структура курса
1. Знакомство с webpack
– Что такое webpack?
– Bundler vs task runner
– Отличия webpack от остальных решений
– Dependency graph
– Самый простой запуск webpack: config-free, CLI
– Разработка самой простой конфигурации webpack
– Типы конфигураций: Объект, Функция, Промис
– Подключение HTML
2. Основы webpack
– Запуск webpack через Node API
– Что такое Loader
– Что такое Plugin
– Настройка сервера для разработки
– webpack-dev-server
– webpack-dev-middleware
– Hot module replacement
3. Загрузка кода
– Сборка JavaScript
– Чистый JavaScript
– Транспайлинг
– Сборка React
– Композиция конфигурации: разделение конфигураций на development и production
– Сборка CSS
– CSS Modules
– Загрузка PostCSS
4. Загрузка ассетов
– Улучшенная композиция конфигурации
– Перевод конфигурации на ESM
– Вынесение частей конфигурации в модули
– Source maps
– Загрузка изображений
– Загрузка лодером
– Загрузка инлайн
– Загрузка SVG: React-компонент, атрибут src, CSS
– Загрузка шрифтов
– Загрузка лодером
– Загрузка Google-шрифтов
5. Оптимизация сборки
– Разбор webpack runtime
– Переменные окружения и feature flags
– Анализ сборки
– Оптимизация режимов сборки: development, production
– JavaScript
– Минификация
– Tree shaking
– Scope hoisting
– Dead code elimination
6. Продвинутая оптимизация
– CSS
– Отделение CSS от сборки
– autoprefixer
– Минификация
– Оптимизация изображений
– Деплоймент сборки
– Long term caching
7. В долгое путешествие
– Что такое чанк, модуль, зависимость
– Code splitting
– Bundle Splitting
– Manifest management
– Polyfilling
– gzip-компрессия сборки
– Настройка publicPath
– Продвинутая отладка сборки
8. Копаем ещё глубже
– Проблемы, связанные с code splitting и их решение
– Code splitting React-приложений
– Shimming
– Глобальное управление сборкой
