Module Bundlers Explained... Webpack, Rollup, Parcel, and Snowpack

#webdev #tutorial #javascript

Install the quiz app 🤓

Use code lORhwXd2 for 25% off your first payment.

My VS Code Theme

- Atom One Dark
- vscode-icons
- Fira Code Font

[josueem]

As someone starting in the web development industry, all these technologies feel so overwhelming.

[AshesOfEther]

Fireship: *Uploads a video.*
Someone in the comments: OMG I WAS JUST LOOKING FOR THIS!!!!

[naturesdip]

Configuring Webpack from scratch for enterprise scale projects has been one of my best skill investments. It honestly feels like 90% of previous struggles have been due to bad project configs. Thank you so much for this video!

[estelagartija]

It literally took me 6 hours to watch the video and follow the steps and breaking my pc and braking my head but it was worth it. Thanks for taking us by the hand.

[gonefishing]

I'm so glad I have notifications on; I was just trying to figure out how to use webpack! How did you know, Jeff???

[jvcmarc]

this channel is my gateway into the world of webdev!
always when I'm confused about a subject such as docker, webpack, or anything like that, a new video comes out that helps me get started

[ionitaa]

Classic YouTube tutorial... First 5 steps (that are obvious to everybody) explained in detail, the next 3 (slightly harder steps) glanced over and the following 100.000 hard steps are not even addressed. There is no shortcut around the grind. Read the docs and and put aside a few days for learning webpack. 6 months from now when they ship a new major release you'll do it i all over again and you'll love it!

[mathiasdeweerdt]

Love the video, 3 small issues with the video though.

- You have to install sass aswell and not only the loaders
* npm install --save-dev sass
- You used the scss variable "$color" but u defined "$text".
- Add publicPath to devServer so it should like this:
devServer: {
publicPath: '/dist',
contentBase: path.join(__dirname, 'public'),
port: 9000
},

[adipradhan]

Today I wasted my time understanding webpack with all the 2 hours courses and you explained it in what 10 minutes. Awesome dude 😎

[lohar]

Webpack on default minifies code. Setting "mode" to "development" reduces bundling times significantly.

[BigGingerJake]

I've been watching these tutorials for a while now, and I continue to be blown away by how much value you are able cram into each short video. The quality and conciseness that your style delivers is just brilliant, and imho fits perfectly in line with what your target audience desires. I'd just like you to know that you are doing a phenominal job, and I've decided to sign up for full membership.
Thank you for your hard work and amazing content.

[london]

For the record, you can use script tags with es6 Import syntax by delcaring the type as a module. i.e. <script src="./script.js" type="module"></script>

[PenguinjitsuX]

This is hands down the best development channel on YouTube. The videos are succinct, perfectly to the point, and extremely useful. I've probably watched over 50 videos so far and every single one has been useful!

[speckyferns]

Some of the best courses ever - specific topics, clear delivery, fast, everything just works! Thank you!

[scott]

Update (April 20, 2022): Snowpack is no longer actively maintained and is not recommended for new projects.

[danimunf]

I really love this, I'm new js environment, so I've been watching a lot of your videos and thanks God i learn a lot. Now I'm confident enough to build my own portfolio and start my journey on js

[amnaatarapper]

Every time I come across one of this guy's video I end up learning a new skill... thank you man keep the great work going

[CodingWithLewis]

Always releasing quality videos Fireship! I get excited everytime you are in my sub box.

[zoaybk]

I never tried to learn how to configure webpack because it seemed daunting to me. But you make it look so effortless. So quickly.

[vadityag]

This video is perfect in delivery. It doesn't bore people who are familiar with part of the stuff and it is very useful for beginners.