Redirect Port 3000 to Port 80 with ExpressJS in Production with Nginx

Several hours ago I purchased a domain from namecheap and my goal was to have the site go live. Simple right? Well it wasn’t as simple as I first thought.

First I was using ExpressJS. I like Express.
I was also using Digital Ocean. I like Digital Ocean.
Namecheap is a great place to get cheap domain names.

You buy the domain and you manage that domain by pointing it to the 3 name servers of Digital Ocean. Simple. Done.

You create a DigitalOcean droplet. Make it Ubunto. Have node preinstalled. Choose the smallest size and select one of your existing SSH keys. Kind of simple. Done.

You use Express generator to make a quick down and dirty Express app. Simple, fun and done.

I watched a few Youtube videos on how to create a deploy user on Digital Ocean. You don’t want to do everything as root user as that is not safe.

The video walked through SSH on Digital Ocean and using flightplan to quickly push the express app to production or staging. Super cool.

I had to work with flushing DNS to make sure I wasn’t looking at a cached domain. I had to make sure I found the right flush for the right Mac OS (Capitan). I screwed up a few droplets so I blew them up and recreated them. Then had to recreate the deploy user. I also had to get SSH access for both root and deploy.

I had to move from using forever to a service so that if my server ever rebooted it would start my site back up automatically.

I had to change jade templates to Pug because jade is not longer the name because of a copyright violation.

My IP would work on port 3000 but not the domain. After flushing and waiting a bit, the $ ping 1.2.3.4 (fake IP to show that I was pinging my domain to see if it was pointing to the correct IP.. it wasn’t at first, but after flushing, it was – this was caused by my deletion and recreation of several droplets).

Eventually, my domain was working but since my Express is only showing on port 3000 in the code, I could not get my domain to just work without the port number. I was mad that people would have to access my site with a port number. There had to be a better way. There is.

Install Nginx

You have to first install Nginx. This link showed me how to do this on my DO server (make sure you are logged in as root).

my-site.conf

You can use a very simple Nginx configuration to “re-route” port 3000 request to the port 80.

Create this file

etc/nginx/sites-enabled/my-site.conf (name it your domain.conf – example.conf)`

I used nano to edit this file:

/etc/nginx/sites-enabled/my-site.conf

server {
        listen 0.0.0.0:80;
        server_name my-site.com;
        location /  {
                proxy_pass http://localhost:3000;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_cache_bypass $http_upgrade;
        }

}

Reboot the server

$ reboot

Now visit the domain without the port number appended and you should be golden.

Not the way I wanted to spend my Saturday but hopefully my pain can be your gain.

Leave a Reply

Your email address will not be published. Required fields are marked *