Description
Course info
Rating
(86)
Level
Beginner
Updated
Feb 9, 2016
Duration
2h 3m
Description

This course shows developers how to use next generation JavaScript language features today. Developers will learn to use ES2015 (previously know as ES6/JS.Next/Harmony) without waiting for browser support by introducing Babel, a JavaScript compiler, into their build process. This course will demonstrate how to install and configure Babel. Developers will learn to use Babel with their preferred front-end build tool (Gulp, Grunt, Webpack, npm Scripts), with Node.js on the server, and while writing unit tests. The course also details how to configure Babel for legacy browser support.

About the author
About the author

Craig McKeachie has been a software developer for 15 years and earned the Microsoft Certified Solutions Developer (MCSD) certification for three generations of Microsoft technology. Craig is the author of the JavaScript Framework Guide: AngularJS, Backbone, and Ember, and blogs at funnyant.com

More from the author
Stripe Fundamentals with ASP.NET MVC
Beginner
3h 7m
Sep 22, 2015
Section Introduction Transcripts
Section Introduction Transcripts

Course Overview
Hi everyone. My name is Craig McKeachie. Welcome to my course, Babel: Get Started. I am the author of the Javascript Framework Guide, and have been a developer for over 15 years. This course shows developers how to use next generation Javascript language features today. Developers will learn to use ECMAScript 2015, previously known as ECMAScript 6, JS Next, and Harmony without waiting for browser support by introducing Babel, a Javascript compiler, into your build process. This course is a quick introduction to using Babel to write modern Javascript applications, and no prior experience with Babel is required. Some of the major topics that we will cover include installing and configuring Babel, integrating Babel into your build using your front end build tool of choice, including Gulp and PM scripts, Webpack and Grunt, how to configure Babel to support legacy browsers as far back as Internet Explorer 8 using Babel with React and JSX, Node. js, and in your unit tests with Jasmine and Mocha. By the end of this course you'll have a solid foundation, and be ready to use Babel when developing your Javascript applications. From here you can continue your learning by diving into the specifics of the new Javascript language features in these courses, JavaScript Fundamentals for ES6, JS. Next: ES6. I hope you'll join me on this journey to learn Babel with the Babel: Get Started course at Pluralsight.

Basics of Using Babel
Welcome to the first introductory module of the Babel: Get Started course. I'm Craig McKeachie. In this module we'll be working to understand how Babel can help us generate Next Generation Javascript today. We'll start with a demo of Babel in a REPL, so you can see it in action. We'll compare Babel to Tracer and TypeScript, so you can better understand where it fits in with everything else. We'll install Babel from scratch, and learn how to configure and run it, then we'll take a deep dive into how we can better organize our code by using ES modules today.

Browser Support
You'll need to know which knobs to twist and levers to pull to be confident the code you write is going to run in all the different browser versions you need to support. We'll go over in detail how to do that in this module. We'll learn about shims and polyfills, and how they can help us support older browsers. We'll review a demo project that uses all ECMAScript 2015 features, and use it to work through getting these features to work in various browsers. We'll start with the latest version of Chrome, and then we'll move to more challenging browsers, including Internet Explorer 9, and eventually Internet Explorer 8.

Babel in Your Build
In this module we'll look at lots of different ways to integrate Babel in your build. We'll use build automation tools like npm scripts, Gulp, and Grunt. Then we'll go through the details of using Babel with module loaders like Webpack and Browserify. Lastly, we'll see how we can compile the HTML embedded in our React. js code known as jsx using Babel.

Babel with Node.js and Unit Tests
In this module we'll be going through the ins and outs of using Babel to compile your NodeJS code, as well as your unit tests. We'll look at several ways to compile your Javascript code to run on NodeJS. The first few, babel-node, and the require hook are convenient, but not recommended for production. Using the command line interface to compile your code to ES5 is the recommended approach while being sure to require the Babel polyfill. Lastly, we'll show an alternative to using the Babel polyfill, the Babel runtime, which doesn't pollute global scope. Once you start using Javascript language features you'll want to use them everywhere, including your unit tests. Look at how to setup both Jasmine and Mocha to compile your tests with Babel.