Tech Tutorial: Learning React.js for Single-Page Web Applications – Episode 05: ES6 vs ES5 and Transpiling Source Code

As programming languages evolve more features and abilities are added to it. Sometimes these changes may not be supported by existing execution environments, these are known as breaking changes. In the case of JavaScript, it has continually changed over the last 20+ years. With each new version, we have to wait for user’s browsers to slowly implement those new features. This can sometimes take years and yet developers would like to use those new features the second they are available.

Frameworks like React.js rely on these new language features many of which are not yet supported in modern browsers. Being that React.js SPAs run in browsers, we run into some serious issues if we try to run modern JavaScript in those browsers. To handle this, developers came up with a nifty solution called transpiling source. When we transpile source code we convert source code from one language to another or from one version of a language to another version of the same language.

When we create a React.js SPA using the CreateReactApp NPX utility, it sets up the application to be transpiled from ECMAScript 6 or ES6 (the latest version of JavaScript not entirely supported in modern browsers, but progress is being made) to ECMAScript 5 or ES5 before it is run in the browser. This allows React.js developers to use modern JavaScript features while having their code transpiled to a backward-compatible version that will run in all browsers.

Personal Recommendation (unpaid)
Programming and software development are awesome! Being that you are learning along with me, there is a really good chance you can make this a career. Based on my own life experience, let me suggest to you that you go get a Computer Science degree from Neumont College of Computer Science and kick your life into hyper-drive.


Published by

Tim Clark

Experienced Business Owner, Chief Information Officer, Vice President, Chief Software Architect, Application Architect, Project Manager, Software Developer, Senior Web Developer, Graphic Designer & 3D Modeler, University Instructor, University Program Chair, Academic Director. Specialties: Ruby, Ruby on Rails, JavaScript, JQuery, AJAX, Node.js, React.js, Angular.js, MySQL, PostgreSQL, MongoDB, SQL Server, Responsive Design, HTML5, XHTML, CSS3, C#,, Project Management, System Design/Architecture, Web Design, Web Development, Adobe CS6 (Photoshop, Illustrator)

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s