Deploying Your Express.JS Apps to AWS in 7 steps

This article is intended for people who, like me, intend to to build and deploy their own websites in AWS. I’ve gathered knowledge from several sources and this is a summary of everything I picked up along the way.

AWS and Node/Express

The prep work

AWS offers a 12 month free subscription. Within this subscription you will get access to all free tier services. The only caveat is that the hours on these services are limited. Having multiple instances of these services may cause you to go over your free tier limit. However, the cost is still under $10 a month for a website.

The AWS services we’ll be working with are:

1. AWS EC2
2. AWS Elastic Beanstalk
3. AWS Code Pipeline
4. (Optional) Route 53

Assumptions for this tutorial:

1. You have at least some basic knowledge of Node/Express
2. You have a Github account
3. You know how to use Git

Step 1: Write Your Code

The most fun and arguably, the most important part of all this. I’m going to show you how to create a pipeline which will update your website every time you make a change in your local machine.

Start by writing a simple “hello world” node application like this one:

const express = require("express")
const app = express()
app.set("view engine","ejs")
app.get(["/",'/home'], function(req,res){
res.render("index"); // I'm using a view which contains my HTML code for the app. 
})
const port = process.env.port || 3000;
app.listen(port,function(){
console.log("serving application on port 3000!");
})

The environment variable process.env.port I highlighted above will be how we got from using http://localhost:3000 to an AWS defined port for our app.

Step 2: Git’r done

Once you have an app you like and you have tested it locally. We’re going to move that app to Github, which is going to be our code pipeline source. Make sure you include a .gitignore file. In your command line, insert the following statement BEFORE you add any files to your git version.

npx gitignore node

Step 3: Deploy an Elastic Beanstalk (EB) Environment

This step will generate the resources required to run an environment. Find Elastic Beanstalk from the “All Services” search bar. Once There selecte “Create Application”

Once you hit create, You’ll be taken to the “create environment” section. I apologize for not having the exact screenshots for brand new users, since the GUI does change a little bit when you already have an application/environment created.

The environment options will be relatively simple. You just need to choose the Platform you’re using, in our case Node.js.

Keep the “Application code” section on Sample application, since our code will come from code pipeline directly. Hit create environment and we’re done with this for now. You can view the status right on the Elastic Beanstalk UI. Wait a few minutes for it to finish creating.

Step 4: Continuous Delivery With CodePipeline

This step is how we “link” our Github code to AWS. From your console’s homepage, find CodePipeline

On the left-hand pane there should be a “Pipeline” drop-down. Click it and then click “Pipelines” where you’ll see a “create pipeline” button

Select a pipeline name and make sure everything else is selected as the picture below and click Next.

Select “Github (Version 1)” as your Source. A button saying “Connect To Github” will appear. Since this will likely be your first time connecting to Github, you will be redirected to Github to allow AWS access to your repository. Once authorization is done, you will be redirected back to AWS.

On the “repository” dropdown, choose the repository where you pushed your changes. Then below it choose the branch in that repository where your changes are. By the way, If you want to look at some of my other projects on Github, click here.

Below the repo information, you’ll notice “Github Web-hooks” is selected. This setting is what allows CodePipeline to update your code in AWS each time you push a change to your repository. This is very handy since you’ll be able to code locally and when you’re ready to deploy, the code will be uploaded to AWS for you.

Step 5: CodePipeline Build and Deploy Stages

Once we configured our Github source, the next step will ask us to configure a build stage. I went ahead and skipped that step. However, when you’re comfortable enough with deploying apps and you want to have both a dev and prod environment, do use the build stage option. For now though, please click Skip build stage.

For the deploy stage, we’re going to select our code pipeline app and environment we created in Step 3.

If you did everything correctly, your Pipeline state will be something like this

To reiterate. From now on, every time you push any changes to your code, they will be automatically be picked up by CodePipeline, so be mindful to not update delicate information such as credentials.

Step 6: Configuring system variables

We want to configure a port where our application will be running on. Let’s go back to Elastic Beanstalk to do this.

Go to the environments section and click on Configuration.

You’ll see a bunch of configuration sections, they all have an edit button. Click on the Software section.

Now, go down to environment properties and create a key value pair. Port: 8080

Now, if you used process.env.port in your app.listen, it will be replaced by this value (8080). Another use for this is with your database connection strings, for example. I use MongoDB and have an environment variable for it, this way I don’t expose it to the internet on my Github. If you feel fancy, you can experiment with creating this environment variables in the EC2 instance that EB created.

Step 7: (OPTIONAL) Deploying your app to a custom URL with Route 53

I won’t go too deep into this but if you want to spend the money on your own URL, you can use Route 53 to do this. Once you purchase your domain, go to Route 53 -> Hosted Zones and click on Create Record.

Choose “simple routing” and click next. Click on the “Define Simple Record” button. Use the following settings to route to your EB environment and click define simple record.

That’s it! I hope this helps you in your web development journey. My next article will be on how to deploy a MongoDB database, which I used on my personal website. Thank you for reading. Stay tuned and happy coding!