JS Calculator with ES6 and Babel

Cover image

I built this JS calculator as an excuse to experiment with vanilla Javascript, and use some of the new ES6 syntax. Here, I've used the new arrow function syntax, as well as defining vars and constants with let and const. I'm using flexbox to layout the buttons, and I used a handy CSS feature, the attr() function. This function allows you to pass any attribute on an element to the 'content' property of a pseudo element (such as :before or :after). I used this to output a data attribute to the screen while debugging. Handy stuff.

It uses the Babel transpiler to convert ES6 code features back to ES5, which is supported in all the common browsers.