How to install and use Node - npm

September 15, 2019

Goals

👉Learn what Node.js and npm are;

👉 Set up Node.js and npm on Linux and Mac

What is npm?

npm doesn't stand for Node Package Manager*, which means it’s the tool to connect to the repository containing all the Node.js programs, plugins, modules and so on.

*npm actually does not stand for "Node Package Manager" but essentially that's what it is and does, so most people refer to it that way.

What is Node.js?

JavaScript is a client-side programming language, which means it’s processed in the browser. With the advent of Node.js, JavaScript can also be used as a server-side language.

Local vs. Global

This is the most confusing concept to understand at first, so it's important to let this settle in. Traditionally, you're used to globally installing any sort of program or software on your computer. If you want Spotify, you'll download Spotify, and then it will be available to you.

With npm, you will have some global installs, but mostly everything will be done on a local project basis, meaning you'll have to install everything you need for each project in its own directory. If you want to have a project running Gulp and Sass, you'll create a directory, with a new npm install.

For future reference, any global installations will have the -g flag.

Installation on a Mac or Linux

In order to install everything on a Mac, we'll be running commands in Terminal.app, and Linux distributions vary.

Install Node.js and npm We’re going to use Node Version Manager (nvm) to install Node.js and npm.

$ curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.1/install.sh
| bash

Open the ~/.bash_profilefile, and make sure source ~/.bashrc is written in there somewhere. Restart the terminal.

Run the install command.

nvm install node

Creating your first app with Node.js

In this lesson we’re going to create a real Node.js app from start to finish. You will find out what "low level" means and we will have to manage all parts of the web server that will handle the visitor’s HTTP requests and give them an HTML webpage.

This will be a chance for you to experiment with the infamous callbacks, the functions that are run as soon as an event occurs. Node.js is full of them, so you won’t be able to avoid them! ;)

Web servers and threads

Node.js is low level. So low level that you will have to do things that you aren’t used to doing to make your program work properly.

When you create websites with PHP for example, you associate the language with an HTTP web server such as Apache or Nginx. Each of them has its own role in the process:

Apache manages HTTP requests to connect to the server. Its role is more or less to manage the in/out traffic.

PHP runs the .php file code and sends the result to Apache, which then sends it to the visitor.

As several visitors can request a page from the server at the same time, Apache is responsible for spreading them out and running different threads at the same time. Each thread uses a different processor on the server (or a processor core).

🛑 Node.js doesn’t use an HTTP server like Apache. In fact, it’s up to us to create the server!

Constructing your HTTP server

var http = require('http')

var server = http.createServer(function (req, res) {
  res.writeHead(200)
  res.end('Welcome on board everybody!')
})
server.listen(8080)

In some ways it’s the "minimal code" for a Node.js project. Put it in a file and name it server.js (for example).

👉 What does this code do?

It creates a mini web server which sends a "Hi everybody" message in every case, regardless of the page requested. This server is launched on the 8080 port on the last line.

Let’s analyze some code

var http = require('http')

require makes a call to a Node.js library, here it’s the "http" library which allows us to create a web server. There are loads of libraries like this one, most of them can be downloaded using NPM, Node.js’s packet manager (we’ll learn how to use that later on).

The http variable represents the JavaScript object that will let us launch a web server and that’s exactly what we’re doing here:

var server = http.createServer()

We call the createSever() function contained within the http object and we save this server in the server variable. You’ll notice that the createServer function takes on a setting and that this setting is a function. This is why the instruction is a little complicated, because it runs over multiple lines:

var server = http.createServer(function (req, res) {
  res.writeHead(200)
  res.end('Welcome on board everybody!')
})

All this code corresponds to a call to the createServer(). Its settings contain the function to be run when a visitor connects to our website.

🛑 Note that you can do this in two steps, as mentioned previously. The function to be run is the callback function. We can define it beforehand in a variable and transmit this variable to createServer(). This way, the code is exactly the same as the previous one:

// Code exactly the same as the previous one

var instructionsNewVisitor = function (req, res) {
  res.writeHead(200)
  res.end('Hi everybody!')
}

var server = http.createServer(instructionsNewVisitor)

👉 It’s very important that you understand this idea, because Node.js only works like that. There are callback functions everywhere and, generally speaking, they are placed within the lines of another function as you saw in the first code. This can seem a little tough to read, but you will soon get the hang of it, don’t worry. 😄

🛑 Don’t forget to close the callback function properly with a brace, to close the brackets that contain the function, and to place the infamous semicolon. This is why you see the }); symbols on the last line of my first code.

👉 The callback function is therefore called each time a visitor connects to the website. It takes on 2 settings:

The visitor’s request (req in the examples): this object contains all the information about what the visitor asked for. In it you will find the name of the page that was requested, the settings, and any fields filled in on a form.

The response that you should send back (res in the examples): this is the object that you need to fill to give a response to the visitor. In the end, res will generally contain the HTML code of the page to be sent to the visitor.

Here, we are doing 2 simple things in the response:

res.writeHead(200)
res.end('Hi everybody!')

To be continued.....

Up next