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

Атум

Infoguru
Автор темы
Администратор
6 Сен 2014
85.285
2.006
freesliv.info
Автор: Lectrum
Название: Продвинутый курс по Webpack v4, с чистого листа (2020)

image_0.png


О курсе

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

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

С самых азов
Мы подразумеваем, что вы не знакомы с Webpack, но хотите освоить его и другие технологии, используемые в продакшене на современных проектах. Для облегчения обучения доступно техническое skype-собеседование, которое выявит пробелы в знаниях и поможет их закрыть.

В комфортном темпе
Мы предоставим вам весь материал по курсу, чтобы вы в своём ритме занимались изучением Webpack. Доступна ежедневная менторская поддержка в чате курса.

С сильной менторской поддержкой
Закрытое комьюнити выпускников в Slack, персональный ментор на время обучения, проверка домашних заданий и даже индивидуальные занятия с автором курса — поддержки вы получите ровно столько, сколько вам нужно.

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

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
  • Глобальное управление сборкой
Подробнее:
Скрытое содержимое. Вам нужно войти или зарегистрироваться

Скачать:
Скрытое содержимое. Вам нужно войти или зарегистрироваться