Hosting your Node app on Namecheap and cPanel

In this article I will cover hosting a Node.js app on Namecheap’s shared hosting servers using cPanel. I won’t discuss setting up the database server or the React front end for your web app in this article. Instead I want to focus on the challenges you might face with running a Node app in a shared hosting environment.

Don’t delay, host today!

Before you get too far down the path of developing your web app it is a good idea to put a stable version online. This could be in your production environment, or in a staging environment which is similar to your production environment. Most people will wait until their app is almost complete before hosting it online – and this is what I did when developing my first React and Node web app. However, at that point I faced a lot of challenges in getting my Node API server running and I also had to make a lot of changes to my React app. That’s why I recommend putting a version online early on so that you can make adjustments before writing too much code.

Using a shared hosting service

Namecheap’s shared hosting servers use cPanel as the control panel interface to manage the Apache server. These instructions should also help anyone who’s using a shared hosting service with cPanel such as A2 Hosting and GoDaddy.

I also have my Namecheap server set up with an SSL certificate and cPanel by default redirects all HTTP traffic to HTTPS. So all traffic to my server is secure.

You will find many guides instructing you on how to host a Node app on a VPS (Virtual Private Server) hosting service such as DigitalOcean. If you’re starting from scratch then hosting using a service like that will give you more control. But it is usually more expensive than shared hosting. And in my case I had already paid for a Namecheap shared hosting service.

Some advantages of using cPanel and shared hosting:

• Managed with a simple web management console
• Easy to configure
• Cheap, especially if you’re already hosting a site / domain
• Can easily set up dynamic websites using other technologies like PHP, etc, if you’re exploring different technologies

Some disadvantages:

• Less “control” as you don’t have access to the underlying operating system
• Not scalable

Where does everything go?

First you need to create a folder for all the source files for your Node apps. I created a folder called “nodejs” in the /home/username directory and within this folder I then create a subfolder for each app. Now upload all your source files into this subfolder. Make sure you include the package.json file too. You don’t upload the “node_modules” folder as that will be created with the package manager later.

Remember we are just hosting the Node API server in our web app architecture example. We will not host the React app using Node (more on this topic in the next article).

The problem – Node app can’t access the ports

The biggest challenge I faced was in getting my Node API app running. The issue was that the sample code given in Namecheap’s support documentation just didn’t work! It tries to create a httpserver to listen on port 80 and a httpsserver on port 443. However, I always got a EACCESS error saying that I didn’t have permission to use those ports. 

The solution – Node doesn’t need to access the port!

Eventually I found the solution by reading a comment by user SibProgrammer in a thread about Plesk, another hosting control panel. cPanel uses Phusion Passenger application server to host Node apps, as does Plesk. In summary: 

When you send a request from your browser it goes to the Apache server, then to Phusion Passenger, and then to your Node app. Your Node app doesn’t need to own the port as it is handled further upstream by the Apache and Phusion Passenger application servers.

This simplifies the code for creating the httpserver in your www.js (or app.js) file:

/********
 * www.js
 * Testing the creation of the http server for Namecheap.
 * Dave 
 */
 
const http = require('http');

http.createServer(function(request, response) {
  response.writeHead(200, {'Content-Type': 'text/html'});
  response.end("<h1>Hello World!</h1>");
}).listen(process.env.PORT);

console.log('App is running...');

A few things to note:

• Listen on process.env.PORT (instead of manually setting 80 or 443). When testing I noticed that process.env.PORT is undefined! But interestingly that doesn’t matter in this case.
• Use a http server even if you have SSL set up. cPanel has configured Apache to redirect all HTTP traffic to HTTPS and consequently to respond to all requests by HTTPS. You don’t need to manually configure your Node app to set up a https server and read in your SSL certificates.

Final steps for Node API server

Now it should be the relatively simple process of following the instructions to set up your node app.

• Choose the appropriate version of Node.js and application mode (Production is recommended). 
• The “Application root” will be the folder where you uploaded your source files earlier (“nodejs/mynodeapi” in the example above).
• The “Application URL” will be the URL used to access your API (“myapi” in the example). The name you give in this box will be used to create a subfolder in your /home/username/public_html folder. It doesn’t have to be the same name as the “Application root” folder (but often will be).
• The “Application startup file” will be www.js or app.js depending on how you created your Node app.
• It’s up to you how you want to configure the Passenger log file.
• Once you’ve created the app you’ll see the button to “Run NPM Install”. Run this and it will create the “node_modules” folder with all the dependant modules that your app needs.

Once you’ve set up your Node app and started it, it will create the subfolder in your /home/public_html folder. You will now need to go to that folder and edit the .htaccess file and add in the following line:

RewriteEngine off

This prevents the Apache server from rewriting (or redirecting) any of the requests that need to go to your API server intact.

And that’s it! Now your Node API app should be up and running and responding to your API calls.

So what’s next?

Now that we have set up the Node API server we could change our React front end in our development environment to point to this API server. Or we could use Postman to test our API calls.

In the next article we’ll look at hosting up the React app on Namecheap and cPanel.