ESBuild полный курс от А до Я. Замена Webpack 5?
В этом ролике мы рассмотрим сборщик (бандлер) для frontend проектов ESBuild. Сравним его с Webpack 5. Разберем основные понятия loader, plugin, dev server, bundle, typescript, css, source map, minify и тд. Esbuild vs webpack. Webpack 5.
Patreon/boosty (доступ к бонусам) - https://boosty.to/ulbitv
Исходный код тут (github) - https://t.me/ulbi_tv/90
tsconfig - https://gist.github.com/utimur/0e47c843fb1d1fb23870d8e8ac5b4bb1
Доп. материалы:
Node js от А до Я - https://youtu.be/243pQXC5Ebs
Real time client-server - https://youtu.be/o43iiH4kGqg
Backend для начинающих (express) - https://youtu.be/tKM44vPHU0U
Таймкоды:
00:00 ➝ Введение и теория. Сравнение webpack и esbuild
06:00 ➝ Начало разработки. Установка, создание конфига. Основы. bundle, outdir.
09:40 ➝ Tree shaking
10:50 ➝ Минимизация бандла
11:30 ➝ Создание конфигурационного файла
14:20 ➝ Переменные окружения, production | development. Cross-env
17:00 ➝ Добавляем React и React-dom
19:45 ➝ Работа со стилями. CSS
21:40 ➝ Sourcemap. Карты исходного кода
23:50 ➝ Настраиваем дефолтный dev (serve) server
28:00 ➝ Production сборка
28:50 ➝ Подключаем TypeScript. Tsconfig.json
32:35 ➝ Переписываем конфиг на TS
36:05 ➝ Настраиваем loader для внешних файлов (png, svg, jpg ..)
38:20 ➝ Динамическое названия бандла. Боремся с кешированием
39:40 ➝ Создаем первый плагин. CleanPlugin. Работаем с файловой системой
44:30 ➝ Cоздаем свой dev-server. Express server. Watch mode. Раздача статики
48:35 ➝ Создаем второй плагин. HtmlPlugin
01:02:20 ➝ Hot reload. Event source. Server sent events
01:09:99 ➝ Итоги. Время ставить лайки и писать комменты :)
Поддержать меня и мой канал вы можете по ссылкам ниже.
Patreon/boosty (доступ к бонусам) - https://boosty.to/ulbitv
Qiwi кошелек - http://qiwi.com/n/BODYE821
Яндекс деньги - https://yoomoney.ru/to/4100116193037469
Видео ESBuild полный курс от А до Я. Замена Webpack 5? канала Ulbi TV
Patreon/boosty (доступ к бонусам) - https://boosty.to/ulbitv
Исходный код тут (github) - https://t.me/ulbi_tv/90
tsconfig - https://gist.github.com/utimur/0e47c843fb1d1fb23870d8e8ac5b4bb1
Доп. материалы:
Node js от А до Я - https://youtu.be/243pQXC5Ebs
Real time client-server - https://youtu.be/o43iiH4kGqg
Backend для начинающих (express) - https://youtu.be/tKM44vPHU0U
Таймкоды:
00:00 ➝ Введение и теория. Сравнение webpack и esbuild
06:00 ➝ Начало разработки. Установка, создание конфига. Основы. bundle, outdir.
09:40 ➝ Tree shaking
10:50 ➝ Минимизация бандла
11:30 ➝ Создание конфигурационного файла
14:20 ➝ Переменные окружения, production | development. Cross-env
17:00 ➝ Добавляем React и React-dom
19:45 ➝ Работа со стилями. CSS
21:40 ➝ Sourcemap. Карты исходного кода
23:50 ➝ Настраиваем дефолтный dev (serve) server
28:00 ➝ Production сборка
28:50 ➝ Подключаем TypeScript. Tsconfig.json
32:35 ➝ Переписываем конфиг на TS
36:05 ➝ Настраиваем loader для внешних файлов (png, svg, jpg ..)
38:20 ➝ Динамическое названия бандла. Боремся с кешированием
39:40 ➝ Создаем первый плагин. CleanPlugin. Работаем с файловой системой
44:30 ➝ Cоздаем свой dev-server. Express server. Watch mode. Раздача статики
48:35 ➝ Создаем второй плагин. HtmlPlugin
01:02:20 ➝ Hot reload. Event source. Server sent events
01:09:99 ➝ Итоги. Время ставить лайки и писать комменты :)
Поддержать меня и мой канал вы можете по ссылкам ниже.
Patreon/boosty (доступ к бонусам) - https://boosty.to/ulbitv
Qiwi кошелек - http://qiwi.com/n/BODYE821
Яндекс деньги - https://yoomoney.ru/to/4100116193037469
Видео ESBuild полный курс от А до Я. Замена Webpack 5? канала Ulbi TV
Показать
Комментарии отсутствуют
Информация о видео
Другие видео канала
Реальное СОБЕСЕДОВАНИЕ на FRONTEND разработчика ЗП 200КVue 3 фундаментальный курс от А до ЯООП на простых примерах. Объектно-ориентированное программированиеКак БЫСТРЕЕ стать ПРОГРАММИСТОМ? 5 ПРАВИЛ!SOLID ПРИНЦИПЫ простым языком (много примеров)Ищем работу на FRONTEND РАЗРАБОТЧИКА. Что не так с этими вакансиями??Шахматы на React и TypeScript С НУЛЯ. Практикуем ООПЧто должен знать JUNIOR BACKEND разработчик? Подробный планCI CD наглядные примерыСОБЕСЕДОВАНИЕ на FRONTEND разработчика JS CSS REACT VUE HTTP. Подготовка к собеседованиюИзучаем JavaScript за 90 минутТестирование JavaScript от А до Я (Jest, React Testing Library, e2e, screenshot)РЕАЛЬНОЕ СОБЕСЕДОВАНИЕ НА FRONTEND РАЗРАБОТЧИКАReact JS фундаментальный курс от А до ЯGit и GitHub Курс Для НовичковБЫСТРЫЙ FRONTEND. Оптимизация. Как писать JAVASCRIPT эффективно?Как успешно пройти собеседование на JUNIOR разработчикаVSCode Extensions - My Top 5 ExtensionsРЕАЛЬНОЕ СОБЕСЕДОВАНИЕ НА FRONTEND РАЗРАБОТЧИКА. ПРИТВОРИЛСЯ ДЖУНОМ