- Регистрация
- 30 Дек 2017
- Сообщения
- 149,952
- Симпатии
- 4,186
[Lectrum] Продвинутый курс по Webpack v4, с чистого листа (2020)
О курсе
Продвинутый и ёмкий курс
Вы изучите все возможные темы, которые относятся к 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
[*]Глобальное управление сборкой
Скачать:
О курсе
Продвинутый и ёмкий курс
Вы изучите все возможные темы, которые относятся к 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
[*]Глобальное управление сборкой
Скачать:
Для просмотра содержимого вам необходимо авторизоваться или зарегистрироваться.
Если у Вас нет Премиум статуса:
Преимущества VIP-подписки