Tutorial: How to deploy a production Express app - Part 1

19 Jun 20 ~ 5 min read

Express is a web application framework that allows you to build fast and scalable web apps and APIs for Node.js.

This tutorial will guide you through creating and deploying a production Express app to Heroku.

Before you start

Before getting started with this tutorial, make sure you have the following:

Node.js 8 or higher installed on your machine.

Step 1: Project setup

Open a terminal window and create a new folder on your machine with the name of your project. I suggest using only lowercase letters and dashes instead of spaces, as this is the naming convention for repositories. 

mkdir example-app
cd example-app

Step 2: Add project dependencies

A package.json file defines all the dependencies your app requires. To create a package.json, run the npm init command.

npm init

Add Express as a dependency.

npm install express --save

Step 3: Add express app

Create a new file called server.js.

touch server.js

Open the file in your favourite code editor and add the following lines of code:

server.js
const express = require('express’);
const app = express();
const PORT = process.env.PORT || 5000;

app.get('/', (req, res) => res.send('My Express app'));
app.listen(PORT, () => console.log('Ready on port ${PORT}...'));

Step 4: Add scripts

The scripts section of your package.json file is where you add all the scripts used for your app. Add the following scripts to your package.json.

package.json
{
    ”start”: “node server.js”
}

This command tells node to run the code in server.js.

Step 5: Test your app locally

So that we don’t have to stop and start the server every time we make a change, we’ll add Nodemon as a dependency. Nodemon will watch your files for changes and automatically restart the server for you.

npm install Nodemon --save-dev

We’re adding it as a dev dependency, as it is not needed for running the app in production.

Add the following dev script to your package.json:

package.json
{
    “dev”: “nodemon server.js”,
    ”start”: “node server.js”
}

Open your terminal window and run the dev command:

npm run dev

You should see the following message:

Ready on port 5000…

Open http://localhost:5000 in your browser to see your Express app.

Step 6: Basic security

We’ll cover security extensively in another article, but for now we’ll add a middleware called helmet to our app to provide some basic security. View the Helmet docs to learn more.

npm install helmet --save

Once installed, add the following code to server.js. 

const helmet = require('helmet');

app.use(helmet());

Your server.js file should now look like this:

server.js
const express = require('express');
const app = express();
const PORT = process.env.PORT || 5000;
const helmet = require('helmet');

app.use(helmet());
app.get('/', (req, res) => res.send('My Express app'));
app.listen(PORT, () => console.log('Ready on port ${PORT}...'));

Note that the helmet middleware comes before the 'app.get' route. Express executes middleware in the order that they appear in your code.

Conclusion

You now have a production-ready app ready to be deployed. Next we'll look at the various options of deployment and pointing a custom domain to the app.

Marcel Thomas
Written by
Marcel Thomas