
We’ve now created all of the code we need to display “Hello World” in a browser using React components. With Node and npm installed fire up your terminal, head over to the directory where you want your project to live and run: First make sure you have NodeJS and npm installed as we’ll use those to install the packages we need. Visiting the toolshedīefore we get started writing code we have to install the right tools. This is going to be fun because React, ES6, Babel and Webpack play together particularly well. In this post, we’ll go through the steps of setting up two basic React components that use ES6 features, use Babel to transpile them to ES5 and bundle them using Webpack. Babel lets us write code that uses new ES6 features, and then transpile s that code into standard ES5 code that can run in older JavaScript environments. Unfortunately, browser support for ES6 is not as widespread as many would hope which is where handy utilities like Babel come into play.

Take the Twilio Javascript library for a spin hereįacebook has done a great job of keeping React up to date, and even made it compatible with new features from ECMAScript 6 (ES6), the significant update to the JavaScript language that is finally available for use. Combined with a bundler utility like Webpack, React greatly simplifies building and maintaining Single Page Applications. Described by its own homepage as the V in MVC, React allows you to build reusable UI components and makes maintaining changes in your data’s state effortless by abstracting the DOM.

ReactJS has been taking the world of front end development by storm.
