John Cheesman

ES6 Boilerplate

Projects

A starting point for using ES6 with Gulp, Browserify and Babel.

With the latest ECMA Script standard looking set for release in June I’ve been looking at how we can take advantage of the new features at work. As a proof of concept for using a transpiler I wrote a simple boilerplate project, which is available on GitHub.

The boilerplate demonstrates a simple example of the new class syntax, with a Developer class that extends Person. There is also an example of the useful string interpolation feature in the Person.render method.

Transpilers

The best way to start using ES6 now is with the help of a transpiler that will process your scripts into the equivalent ES5 code, allowing you to write JavaScript that will eventually work natively in most browsers. I initially looked at Traceur but was put off by its dependency on a library script being included in the browser. While this makes sense in terms of refactoring out common functionality it’s an extra step to be managed in the build process.

I’m now using Babel (formerly 6to5), or more specifically its Browserify transform Babelify. Using Babel in conjunction with Browserify gives you the freedom to use the module syntax outlined in the new specification, which will be familiar to those already importing and exporting code.