Grow your YouTube channel like a PRO with a free tool
Get Free YouTube Subscribers, Views and Likes

Introduction to ESBuild tutorial for React / JavaScript and Typescript bundling. Bye bye Webpack

Follow
Chris Hay

Introduction to esbuild. This video is a getting started guided to esbuild, which is a super fast bundler written in Go and is a potential replacement for WebPack. In this video Chris shows you how to get started with esbuild and how to use it to transpile your Typescript code into Javascript and bundle it for the browser. Chris looks at how to configure the bundler to deploy your React application for production and debugging looking at source maps, minification etc.

In addition Chris looks at how esbuild is a credible alternative to WebPack through it's plugin model and it's ability to not only produce bundles at speed but also it can be used to power React ServerSide rendering.

Finally Chris shows you how to use ESBuild in your developer workflow for hot reloading of your typescript web applications, improving your developer experience

Source Code available at
https://github.com/chrishayuk/chrisha...

Chapters

00:00 Introduction
01:34 Installing esbuild
02:40 Transpiling typescript using esbuild
07:50 Comparing esbuild to TSC
12:00 Creating our React Application
15:57 Transpiling React Applications with esbuild
18:24 Bundling our React Application with esbuild via Command Line
22:20 Browser bundling with esbuild in Node.JS
26:21 Serving bundles with httpserver
27:44 Sourcemaps
28:23 Minify
29:20 Bundling in browsers with ESBuild WebAssembly
31:11 ESBuild Plugins
33:18 ESBuildRegister
35:00 Hot reloading with Express, esbuild Register and Nodemon
40:20 Conclusion

posted by apetitus7d