The ES6+ Stack

JavaScript is finally growing up. It’s now running on the web, powering e-commerce websites such as Walmart.com and PayPal, streaming platforms like Netflix, mobile apps, analytics & realtime monitoring, and even IoT devices. It’s also being revised and updated every year starting in 2015 and it’s ranked #1 Top Technologies, according to a recent StackOverflow Developer Survey.

The goal of this guide is to get you familiar with the core pieces of the JavaScript ecosystem: nodejs and npm, and set up a modern stack to build web applications taking advantage of all the latest and greatest features available in ES6+. Caffeine is not required, but highly recommended.

Install latest nodejs LTS

Something to know about node… things are constantly changing and it’s a bit of a moving target. The guys behind it need to catch up with the latest features and specs while also providing support for current and legacy systems. So there are 2 main flavors: LTS and current. LTS stands for Long Term Support while current are short-circuit releases that include all the latest features that have been finalized in-between LTS releases. The safe bet is to go with LTS but if you’re just exploring or working on a toy project the current release is fine.

Get the nodejs installer for your platform here, or if you’d rather use your favorite package manager, check out their guide here.

To check that node was installed correctly, run this on your terminal.

$ node -v

If everything is ok, you should see the version number that you have installed. Now, let’s move on to the cool part.

The Node Package Manager (npm)

Nodejs comes with a powerful sidekick: npm. This little tool allows you to add functionality to your projects without having to write the code yourself via packages. A package is just a program that someone else wrote and shared to the npm registry. You can add-on those packages and build your programs like you’re playing with lego blocks.

To get started on a project, create a new directory and navigate to it using the terminal. Then tell npm that you’re starting a new project:

$ npm init

You will be prompted for the name of your application, version, description, license and so on. Just hit Enter and leave the defaults for now until you get to

Is this ok? (yes).

Hit enter one more time. This will generate a brand new package.json file in your project directory. Think of this file as the entry point to your program.

Open up package.json in your favorite editor and in the scripts section, we’ll add a start command, which will be executed whenever you want to run or deploy your code. Here’s an example:

{
"name": "helloworld",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node index.js"
},
"author": "",
"license": "ISC"
}

Next up, create a new index.js file inside your project directory and add the following snippet:

console.log('Hello, World!')

To run your code, just enter npm start in the terminal, and you should see the Hello, World message! Feel free to change this example to do math or evaluate any other expression. Remember, it’s just JavaScript.

Awesome! You are now ready to start creating applications using node and npm! In the next episode we’ll go over how to install packages from npm and how to reuse your own code in different parts of your apps.


Liked this? Let me know by hitting the ♡ below.