ESBuild полный курс от А до Я. Замена Webpack 5? HD

В этом ролике мы рассмотрим сборщик (бандлер) для 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