Introduction

Express v4 improved the Router to be much simpler to register middleware. It allows us to separate routes into files & modules. This tutorial covers how we can accomplish this using a single point of entry.
Let’s take a look!
Stack:

Directory Structure

The directory structure is as follows for our barebone NodeJS & Express Web Application.
tutorialProject/
├── app.js
├── bin
├── node_modules
├── package.json
├── package-lock.json
├── public
├── routes
│   ├── index.js
│   └── users.js
└── views

Routes Folder

Our routes folder contains any route scripts to register with Express. We’ll be making a few tweaks here. For more details, check out the Express Documentation.

Step 1) Create index.js Script

Create an index.js file in the routes folder.
$ cd ./routes
$ touch index.js

Step 2) Registering Routes

In our index.js script, we’ll need to add a few things. We’ve added inline comments to explain what is happening. Note that router.use is flexible & offers other functionality, we’ll cover these in a later post.
/* Express Module */
var express = require('express');
/* Express Router */
var router = express.Router();

/* 
 * Register user controller
 * This is where we configure the router to use our controller.
 * The base endpoint for this route is /users so we won't need
 * to write /users in front of every endpoint in the controller.
*/
router.use(
  '/users',
  require('./users')
);

/* Export our Router. */
module.exports = router;

Step 3) Create Route Controller

Creating our route controller is simple. When we require a module using router.use, it will pick up any defined routes. Let’s create our first controller.
$ cd ./routes
$ touch users.js
Add the following contents to the users.js script.
/* Express Module */
var express = require('express');
/* Express Router */
var router = express.Router();

/* 
 * GET users listing. 
 * Notice that we don't need to add '/users' to the endpoint.
 */
router.get('/', function(req, res, next) {
  res.send('TODO send user listing');
});

/* Export the router module. */
module.exports = router;

Step 4) Modify Express app.js

Now that we have our basic configurations set up, we need to import our created routes into our entry point script. Add the following line to our app.js file, make sure that this goes before any error handling and after any middleware registration as Express runs middleware in an ordered fashion.
app.use('/api/v1', require('./routes'));
Note: We version our APIs in case we need to add non-backword compatible functionality. This way we can notify clients to migrate to these new endpoints at their own convenience.

Step 5) Testing 1…2

Let’s make sure our route is working properly!
$ npm run debug 

tutorialProject@1.0.0 debug /tutorialProject
> ./node_modules/nodemon/bin/nodemon.js --delay 80ms --exec 'fuser -k 3000/tcp; node --inspect ./bin/www'

[nodemon] 1.18.6
[nodemon] to restart at any time, enter `rs`
[nodemon] watching: *.*
[nodemon] starting fuser -k 3000/tcp; node --inspect ./bin/www​
That’s it! Open your favorite browser & navigate to localhost:3000/api/v1/users.
post_7_screeny_1

🎉 Congratulations! 🎉

You’ve now registered routes using Express 4! Use this process to continue registering any new controllers by only needing to modify them in one source. We’ll be creating another post on how to version APIs.

Have any questions, concerns, found a bug or mistake? Leave us a comment below.
Need a Web Application or Website developed? Get in touch with us!

 

About the Author Sean Proulx

Fullstack Software geek with a passion for music and art.

Leave a Reply