Webpack: Transpiling and Bundling JavaScript

Webpack, touted as a bundler, is a robust compiler platform. In this course, you'll learn the basics of transpiling and bundling JavaScript.
Course info
Rating
(86)
Level
Intermediate
Updated
Jan 30, 2018
Duration
4h 56m
Table of contents
Course Overview
What Is Webpack?
Bundling Code
Accelerating Development
Dev Isn't Prod
Transpiling: Using the Future Now
Understanding Loaders
Running Build Tasks
Troubleshooting with Source Maps
Generating Code
Description
Course info
Rating
(86)
Level
Intermediate
Updated
Jan 30, 2018
Duration
4h 56m
Description

Webpack is the most prevalent bundler for front-end web app development, but more than that, it's a compiler platform. It's everything you need to write modern, modular web applications. In this course, Webpack: Transpiling and Bundling JavaScript, you'll learn the basics of bundling, how to setup a rapid development environment that instantly updates with hot module replacement, and how to parameterize Webpack to optimize production builds for the fastest user experience. First, you'll learn how to integrate the babel-loader so you can write modern JavaScript while providing support for a wide variety of legacy browsers. Next, you'll write several custom loaders, including a code generation loader. Finally, you'll discover how source maps make troubleshooting a breeze. Once you've finished this course you'll understand how Webpack works, what benefits it affords, and how to setup a robust build process to optimize both development and production environments.

About the author
About the author

Wes Higbee is passionate about helping companies achieve remarkable results with technology and software. He’s had extensive experience developing software and working with teams to improve how software is developed to meet business objectives. Wes launched Full City Tech to leverage his expertise to help companies delight customers.

More from the author
What Is DevOps: Executive Briefing
Beginner
23m
Nov 2, 2018
Implementing a Self-hosted Docker Registry
Intermediate
4h 8m
Jun 5, 2018
More courses by Wes Higbee
Section Introduction Transcripts
Section Introduction Transcripts

Course Overview
Hi, my name is Wes Higbee. Welcome to my course, Webpack: Transpiling and Bundling JavaScript. These days, about every other article I read online about JavaScript or front-end development contains some mention of webpack. And that's not really surprising because webpack is a very flexible and powerful build tool. In this course, I'll help you understand what webpack is and why it's useful, how to set up webpack to bundle your JavaScript applications, accelerate development with Hot Module Replacement, optimize a production build, integrate Babel to transpile so you can use modern JavaScript while supporting legacy browsers, look under the hood of webpack to truly understand what's going on, and how to leverage source maps to optimize your development experience. Coming into this course, you should have a basic understanding of JavaScript development, and preferably some experience with writing modular JavaScript. By the end of this course, you'll know how to use webpack to provide the fastest user experience possible in your production application, while also improving your development experience. And you'll be well-prepared to dive into advanced webpack concepts that can further improve your front-end applications. Let's get started.