Supposing you’ve developed your awesome node.js express RESTful API, you have many alternatives of hosting platforms such as Heroku, digital ocean, aws, gcp e.t.c which is perfectly fine. But did you know that you can still deploy your node.js express RESTful API on cpanel which will still behave like it’s hosted on a cloud server? Well, in this article I’m going to show you step by step tutorial on how to deploy your node.js express RESTful API on cpanel.
Video Tutorial
_If you are the visual type like me, go ahead and watch the video below.
Please don't forget to like, share, comment, subscribe and turn on notification as that will give me the motivation to do more awesome videos and tutorials like this.
Things to note before hosting your react.js app
Ensure your domain is linked to your hosting account.
If main domain is already in use, create a subdomain dedicated for this project.
In this article we will be using https://supablogapi.supatechie.ga but go ahead and replace it with your domain or subdomain.
Before we begin, ensure that you change your client app (react.js app) ajax requests base URL to point to URL you will be hosting your node.js app on. For instance, if you used axios in your client app connected to this server to make requests, change all your requests base URL to point to this remote server URL. Example; assuming your server is hosted on http://localhost:5000 locally and your remote server URL is http://supablogapi.supatechie.ga, make the changes below;
const result = axios.get(‘http://localhost:5000/api/posts’)
// change it to
const result = axios.get(‘http://supablogapi.supatechie.ga/api/posts’)
Do this for all your client side requests.
After you have done the above changes, proceed to host your server API.
- Under the server directory run the following command . This will install cors & dotenv dependency for you. Cors stand for cross-origin resource sharing and it allows client server communication. dotenv package will enable us to read environment variables from .env file.
npm install cors dotenv
- Go to your server main file be it index.js or server.js or app.js and require or import dotenv & cors dependency then add it as a middleware and provide the URL of your client app as shown below.
require("dotenv").config();
const express = require("express");
const cors = require("cors");
const app = express();
app.use(cors({ origin: process.env.REMOTE_CLIENT_APP, credentials: true }));
- Create .env file or if it already exist, paste the following code and save.
REMOTE_CLIENT_APP = https://supablog.supatechie.ga
Once you have done, go back to your desktop and locate the server directory and zip all the files in it excluding node_modules, .git, package.json-lock.
Login to your cpanel and navigate to Files explorer. We are assuming our API to be hosted under a subdomain known as http://supablogapi.supatechie.ga. This could be your own subdomain or domain. If you don’t have one, go ahead and create a subdomain with any name of your choice. If you have just created a subdomain, it should create a subdirectory under your Files Manager.
Within the cpanel homepage and scroll down to the software section and click on setup node.js app and it should take you to a page to set up your app.
i. Once you’re on the page, click on Create Application button.
ii. On the same page, change your node.js version to match your development version.
iii. Change node.js mode from development to production.
iv. Enter the app document directory of which in this case it’s the name of the server subdomain or domain directory found under Files manager. E.g supablogapi.supatechie.ga if your server URL is a subdomain
v. Enter select the app domain or subdomain URL. E.g https://supablogapi.supatechie.ga if your server URL is a subdomain
vi. Enter the server startup file which is the name of your main node.js app file e.g index.js or server.js or app.js in your dev environment.
vii. Next click on create app and your app should be up and running assuming no error occurred.
viii. To check if it’s running smoothly, click on the open button to see a message like “it works.Node 14.14”
ix. Click on the button stop app to stop the app from running
LEAVE THE NODE.JS SERVER TAB OPEN & OPEN A NEW TAB
- Go back to cpanel homepage and scroll down to the Files section and click on *File Manager *.
- Navigate back to your Files Manager under the server directory.
- If you’re within the directory, click on upload at the top navigation bar and this should take you to a new page to upload your files.
- This should take you to an upload page. Click on the select file and it should open your system’s file explorer for you. Navigate to your server directory and select the server.zip file
Once the zip file is uploaded, click on the link below to go back to your cpanel File Manager.
You will locate the server.zip over there, select the file and click on extract file on the top right. Your files will be extracted successfully
Right now, we need to install the dependencies.
- Switch back to your node.js app tab and refresh the page and at the bottom, you will notice button run npm install Click on it and wait for it to install your dependencies.
- Once it is installed, you should see the message below;
- Click on start app.
Open a new browser tab and try to search for one of your get endpoints. E.g http://supablogapi.supatechie.ga/api/posts and this will return a successful response displayed in the browser
To test if your client app is connected with your server, open a new browser tab and type your domain name of your client app(assuming it is hosted or check the article below to host your client app as well) and the site should be opened successfully getting data from your server.
If you have made it so far, congratulations.
Credits
Image background is designed by Business vector created by fullvector - www.freepik.com
If you want to watch in-depth tutorial on how to develop your react.js and node.js app completely from the scratch and host it on cPanel, I have created a YouTube playlist for this. Please watch the video below.
If you have any question, ask me below in the comment section or on my YouTube channel.
Also, don’t forget to like, share, subscribe to my YouTube channel and turn on notifications. Thanks
Top comments (3)
very good explanation......
So Im using this as a guide, we have a cPanel application and this is my first time dealing with cPanel. I am getting 404 errors on my API call, so Im wondering if it could be an issue with the Ports. I can hit the API from the mySQL database on localhost:8080, but when I try to route it through my actual site URL, Im getting the error.
Magnificent explanation !!!!!!!