Replace Webpack with Esbuild as Your Bundler with Create React App

Learn how to replace Webpack with esbuild as the bundler for React applications created using Create React App in this 28-minute video tutorial. Discover how to speed up your development workflow by implementing a faster JavaScript bundler. Follow along as the instructor guides you through creating a React app, understanding build scripts, installing and configuring esbuild, handling inline SVGs with plugins, setting up a web server, and implementing hot reloads. By the end of the tutorial, you'll have a working React app using esbuild as the bundler, with improved development speed and efficiency.

- intro
- creating a react app with create-react-app
- understanding create-react-app build scripts
- installing esbuild
- understanding esbuild
- replacing cra build script with esbuild
- using plugings to handle inline svg's
- creating a build script including the esbuild-plugin-inline-image plugin
- starting our webserver with http-server
- fixing index.html public_url
- adding our bundles to the index.html
- importing react to app.js
- a working react app using esbuild
- fixing npm start with http-server
- using esbuild as a development server with esbuild serve
- hot reloads
- finale