Note: This tutorial has been replaced by a full-length book on building web apps with Node and Express called ExpressForBeginners.com. Navigate there for a complete guide.


In this tutorial you’ll learn how to build a simple web app with Node, Express, and MongoDB.

Node is a server-side JavaScript environment. Before Node, JavaScript could only be used in the client-side (front-end) of web applications, not on the server-side (back-end) which interacts with a database.

Express is the most popular framework for building web applications on top of Node.js. Frameworks greatly simplify common tasks around web development and exist for every major programming language: Python (Django, Flask), Ruby (Rails), PHP (Laravel, CakePHP), etc.

MongoDB is a No-SQL database commonly used with Node.js. It is also possible to use Node with relational databases such as PostgreSQL, MySQL.

In this tutorial we will use Terminal/command line heavily. If this is totally new to you, check out this article to learn the basics.

Setup

The first step is to install Node. To check if it’s already installed, open up your command line and run the following command:

$ node -v

You should see a version number if Node is installed already. If not, here is a short guide on how to install Node on a Mac and on a Windows computer.

The second step is to create a new folder for this project and navigate into it from the command line. You can call the new directory anything you like but for our purposes I’ll call it nodeTut.

$ mkdir nodeTut
$ cd nodeTut

Next we need to create a package.json file to manage all our dependencies as we proceed in the project. With this file we’ll know exactly which packages we’re using and their version number. We can do this by running the command npm init.

$ npm init

For now you can hit Enter through all the prompts that appear after this command. You’ll see a package.json file has been automatically created.

As a final step, let’s create a new file called index.js which we’ll use to run Node for the first time. To create a new file from the command line use the touch command:

$ touch index.js

In your text editor (I recommend Atom if you’re unsure what to use) edit the index.js file with the following code and hit Save.

// index.js
console.log('Hello World! Node is working…')

Now let’s run node index.js from the command line to see the statement we just logged:

$ node index.js
Hello World! Node is working...

Awesome! We’re ready to start using Express and building our actual web app.

Express

To install Express we’ll use npm (Node Package Manager), which comes bundled with Node already. (Note, you may have heard about yarn which similar to npm. Either is fine to use, but we will use npm in this tutorial.

Run the following command to install Express.

$ npm install express --save

The flag —save “saves” it to our package.json file, where you can see Express has been added to the list of dependencies.

Express is installed on our computer but we need to explicitly instruct our web app to use it. Let’s update our index.js file to do that. You can delete our previous console.log code.

// index.js
const express = require('express')
const app = express()

And now let’s showcase how powerful Express really is! With only one line of code we can spin up a simple server that we can then visit in our web browser. Add the following code to use Express’s built-in listen method as follows:

// index.js
const express = require('express')
const app = express()

app.listen(3000, () => console.log('listening on port 3000'))

Now if you now run node index.js on the command line you’ll see our console.log text of “listening on port 3000” and you can open a web browser to http://localhost:3000/.

$ node index.js
listening on port 3000

However you’ll see on the web page the message “Cannot GET /” because while we have a server running, we haven’t given it any routing instructions. Let’s do that.

Routing

Routing is a core part of any web application. We need to tell the computer what to do if a user goes to the home page URL or the about page URL.

Update the index.js file with the following code to set up routes for both pages:

const express = require('express')
const app = express()

app.get('/', (req, res) => {
	res.send('Homepage! Hello world.')
})

app.get('/about', (req, res) => {
	res.send('About page. Nice.')
})

app.listen(3000, () => console.log('listening on port 3000'))

On the command line, type Ctrl + C (the control key and the “c” key at the same time) to quit the server. And then node index.js to start it up again.

This time if you go to http://localhost:3000/ you’ll see the response “Homepage! Hello world.” If you click on http://localhost:3000/about you’ll see “About page. Nice.” on our about page.

So how does this really work? The get method from app.get returns a req and res object, short for “request” and “response.” Note that these arguments are positional so you can could instead use the names a, b instead of req, res and so long as you also updated the send method to use b.send(), the code would work. But don’t do that. Use req and res since that’s a best practice at this point.

Next Steps

We’ve successfully installed and setup our first Express web app but it still can’t do much. In the next tutorial we’ll learn how to connect it to a database so we can send, retrieve, and save information from our users.

Stay tuned…