Node.js in Front-end Development - You’re Already Using It Every Day

We, too, recently included it in our offering - with in-house initiatives like our starter app already proving themselves in real-world projects.

But developers don’t have to write Node.js applications to be using it everyday. Node.js as de facto only JavaScript runtime outside of the web browser is already present everywhere. And whether we, the developers, know it or not - chances are, it’s already run by us every single day, hidden in our daily development tasks.

Front-end Project Tooling - and How Node.js is a Perfect Fit for It

These days, the code that we write in our text editors is not at all identical to what is present in our production bundles. This especially applies to the front-end projects - where we’re not writing raw HTML and CSS anymore, and even our JavaScript gets severely transformed and minified before reaching the web browser.

Node.js, with its minimalism, universality, speed and - last but not least - common language being used is the perfect tool to develop and run all these tools.

Task Runners and Bundlers

Front-end application written with React, and built using Webpack? Or maybe Ember.js is more up your alley, with ember-cli handling all tooling around the project? Perhaps we’re talking about Gulp tasks, if not some less-popular solutions, like Grunt, Brunch or several others?

Guess what basically all of them are written in - that’s right, JavaScript, executed with Node.js.

Code Pre- and Post-Processors

Any ES6 JavaScript ever written destined for the browser was almost certainly transpiled using Babel to universally digestible, older ES5 standard. Alternative scripting languages, like CoffeeScript or TypeScript? They’re still ran by Node.js under the hood - transformed into vanilla JavaScript code beforehand.

Styles are the same story. PostCSS, universal tool for transforming CSS, is written in JavaScript - along with all of its plugins. Same can be said about Less, the popular CSS pre-processor. Sass is an exception here, with node-sass being just a thin Node.js wrapper around LibSass, an extremely fast native C implementation.

Let’s not forget about templates. Among most popular template languages, Handlebars and Pug are both executing in Node.js environment. And JSX syntax, used for describing markup in React? JSX already is JavaScript.

Code Linters

Linting your code is important to keep basic aesthetics in place and avoid many common mistakes, especially when working in teams - where project is supposed to fit into predefined code conventions. It shouldn’t be too surprising that most popular JavaScript code linters, like ESLint and JSHint, are written in JavaScript themselves, and their executables ran using Node.js. Same can be said about stylelint - an universal, modern CSS linter

This is Just Tip of the Iceberg

The aforementioned tools are just some of the most striking examples of how Node.js is already a commonplace even in front-end development - there are many more positions that could be easily found and mentioned.

It’s safe to say that JavaScript is the most common language in web development in days, and thanks to Node.js basically anything can be written with it - not only the code which is executed in the browser. Even when not used as main back-end technology, it’s quite likely that it’s already used in your project every day, in one form or another.