Webpack 5 Crash Course | Frontend Development Setup
In this video, we will create a Webpack dev environment from scratch including...
Webpack setup
Webpack Dev Server
HTML Webpack Plugin
Sass Compiling
Babel Transpiling
Asset Resource Loaders
Analyzer Plugin
Source Maps
? Webpack Starter Repo:
https://github.com/bradtraversy/webpack-starter
? Website & Courses:
https://traversymedia.com
? Show Support
Patreon: https://www.patreon.com/traversymedia
PayPal: https://paypal.me/traversymedia
? Follow Me On Social Media:
Twitter: https://twitter.com/traversymedia
Instagram: https://www.instagram.com/traversymedia
Linkedin: https://www.linkedin.com/in/bradtraversy
Timestamps:
0:00 - Intro
2:29 - Initial Files (src/dist)
4:24 - Creating Modules
6:10 - Webpack Install & Building
8:20 - Using NPM Modules
9:27 - Webpack Config File
12:42 - Loaders & Sass Compiling
16:11 - HTML Webpack Plugin
18:30 - HTML Template
20:35 - Caching & Hash Setup
22:10 - Webpack Dev Server
25:22 - Cleaning Up Hash Files
26:50 - Source Maps
27:52 - Babel Loader
30:32 - Asset Resource Loader
34:18 - Finish The Joke App
38:26 - Webpack Bundle Analyzer
Traversy Media
Traversy Media features the best online web development and programming tutorials for all of the latest web technologies including Node.js, Angular 2, React.js, PHP, Rails, HTML, CSS and much more...