Продвинутый курс по Webpack v4, с чистого листа [Lectrum]

Bot

Администратор
Команда форума
23 Янв 2020
167,852
2,948
113
[IMG]


Продвинутый и ёмкий курс

Вы изучите все возможные темы, которые относятся к Webpack: от основ эффективной сборки проекта до продвинутых подходов типа code splitting и shimming.

Структура курса:

Спойлер: 1. Знакомство с webpack
  1. Что такое webpack?
  2. Bundler vs task runner
  3. Отличия webpack от остальных решений
  4. Dependency graph
  5. Самый простой запуск webpack: config-free, CLI
  6. Разработка самой простой конфигурации webpack
  7. Типы конфигураций: Объект, Функция, Промис
  8. Подключение HTML

Спойлер: 2. Основы webpack
  1. Запуск webpack через Node API
  2. Что такое Loader
  3. Что такое Plugin
  4. Настройка сервера для разработки
  5. webpack-dev-server
  6. webpack-dev-middleware
  7. Hot module replacement

Спойлер: 3. Загрузка кода
  1. Сборка JavaScript
  2. Чистый JavaScript
  3. Транспайлинг
  4. Сборка React
  5. Композиция конфигурации: разделение конфигураций на development и production
  6. Сборка CSS
  7. CSS Modules
  8. Загрузка PostCSS

Спойлер: 4. Загрузка ассетов
  1. Улучшенная композиция конфигурации
  2. Перевод конфигурации на ESM
  3. Вынесение частей конфигурации в модули
  4. Source maps
  5. Загрузка изображений
  6. Загрузка лодером
  7. Загрузка инлайн
  8. Загрузка SVG: React-компонент, атрибут src, CSS
  9. Загрузка шрифтов
  10. Загрузка лодером
  11. Загрузка Google-шрифтов

Спойлер: 5. Оптимизация сборки
  1. Разбор webpack runtime
  2. Переменные окружения и feature flags
  3. Анализ сборки
  4. Оптимизация режимов сборки: development, production
  5. JavaScript
  6. Минификация
  7. Tree shaking
  8. Scope hoisting
  9. Dead code elimination

Спойлер: 6. Продвинутая оптимизация
  1. CSS
  2. Отделение CSS от сборки
  3. autoprefixer
  4. Минификация
  5. Оптимизация изображений
  6. Деплоймент сборки
  7. Long term caching

Спойлер: 7. В долгое путешествие
  1. Что такое чанк, модуль, зависимость
  2. Code splitting
  3. Bundle Splitting
  4. Manifest management
  5. Polyfilling
  6. gzip-компрессия сборки
  7. Настройка publicPath
  8. Продвинутая отладка сборки

Спойлер: 8. Копаем ещё глубже
  1. Проблемы, связанные с code splitting и их решение
  2. Code splitting React-приложений
  3. Shimming
  4. Глобальное управление сборкой

Скрытый контент.
Скрытый контент.
Скрытый контент.