Hire the author: Nurul H

Check the project on GitHub.

Introduction

Learn how to deploy your API effortlessly on Render and share it with the world on RapidAPI!

Before we begin, we have to take note that choosing the right platform to deploy your API depends on several factors, including your specific needs, preferences, and the characteristics of each platform. While Heroku and AWS are popular and widely used for deploying applications, Render also offers several advantages that may make it a compelling choice to deploy your API.

Some reasons why you might choose Render over Heroku or AWS:

  1. Simplicity: Render is designed in a way that its user interface and documentation make it easy to understand and navigate, making it a good option for developers who want a streamlined process to deploy without excessive complexity.
  2. Fully managed infrastructure: Render manages provisioning and managing servers, load balancers, and other infrastructure components which allows you to focus more on developing your API, saving you time and effort.
  3. Automatic scaling: Render provides automatic horizontal scaling, meaning your API can handle increased traffic without manual intervention. As the load on your API increases, Render automatically adds more resources to handle the traffic, ensuring your application remains performant and available.
  4. Cost-effectiveness: Render offers transparent and competitive pricing. You only need to pay for the resources you use, without any hidden fees. Additionally, you may opt for the free tier, which can be beneficial for small projects or during the development and testing phase.
  5. Git-based deployments: Render integrates seamlessly with Git, allowing you to deploy your API directly from your code repository. This makes it easy to manage deployments, rollbacks, and version control, promoting a smooth development workflow. 

Indeed, it’s important to note that Heroku and AWS also have their own strengths and may be better suited for certain situations. For instance, AWS offers a comprehensive suite of cloud services, allowing you to build complex and scalable architectures. Heroku, on the other hand, provides a platform specifically tailored for developers, with features like easy deployment, add-ons, and integration with popular tools.

In this tutorial, I will show you how to create as well as deploy a simple API on Render. Then, I will also guide you on how to upload the API to the RapidAPI platform, where you can share it publicly so that other developers can use it and help you set monetization to earn passive income.

Glossary

API: Stands for Application Programming Interface, understood as a set of protocols and rules that enable different software applications to communicate and interact with each other.

Render: A cloud-based platform that provides infrastructure and services for deploying and scaling websites or applications.

Heroku: A cloud platform that allows developers to deploy, manage, and scale web applications without the need for extensive infrastructure setup.

AWS: Stands for Amazon Web Services, which is a comprehensive cloud computing platform that offers a wide range of scalable services for computing power, storage, database management, etc.

RapidAPI: An online marketplace platform that enables developers to discover, connect, and manage APIs for their projects.

Node.js: A JavaScript runtime environment that enables developers to execute server-side JavaScript, which makes it possible to build scalable and efficient web applications.

Express: A minimalist web application framework for Node.js that simplifies the process of building web applications and APIs.

CORS: Stands for Cross-Origin Resource Sharing, which allows web browsers to relax the same-origin policy and securely enable cross-domain communication between web applications.

CommonJS: A module formatting system for JavaScript used in Node.js, enabling code organization and sharing of modules between files.

Step-by-step Procedure

Step 1: Creating a simple API

Let’s begin by creating a basic API using the Express framework.

Note: If you have already created the API, you may skip to Step 2.

Prerequisites:         

  • Ensure that you have Node.js installed on your system.
  • Have a basic understanding of Javascript to follow the upcoming instructions effectively.
  • Familiarity with GitHub is recommended as it will be used during the process.

To start, create a new project file and name it anything that suits you. For this tutorial, I named it sampleAPI.

Firstly, in the git bash (or command prompt), type npm init which will create the package.json file.

create package command

Secondly, let’s install dependencies. To set up our project, we’ll be installing Express, CORS, and Nodemon. Enabling cross-origin communication between the API and client-side applications requires the installation of CORS, allowing resources to be requested from a different domain. We install Nodemon to automatically restart the server whenever changes are made to the source code, which saves time and provides a convenient development workflow.

To install, in a command prompt type npm install express cors nodemon.

install express command

Now, open the file in your code editor and check your package.json file.

To configure the start command, under the scripts section, add in “start”: “nodemon index.js”. We will use npm start command to start the server and it will proceed to run using the Nodemon package.


{
"name": "sampleapi",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "nodemon index.js"
},
"author": "",
"license": "ISC",
"dependencies": {
"cors": "^2.8.5",
"express": "^4.18.2",
"nodemon": "^2.0.22"
}
}

view raw

package.json

hosted with ❤ by GitHub

After that, create an “index.js” file.

Copy the code below:


const express = require('express')
const cors = require('cors')
const app = express();
//middleware for server
app.use(express.json());
//to make API publicly accessible
app.use(cors());
app.get('/', (req, res) => {
res.json('Welcome to the API')
})
//Listen for a connection
const port = process.env.PORT || 5500;
app.listen(port, () => console.log(`Listening to Port: ${port}`))

view raw

index.js

hosted with ❤ by GitHub

As you can see from the code above, we’ve imported the dependencies using the CommonJS module. This is because Node.js uses CommonJS modules.

We added app.use(express.json()), a middleware for the server to recognize incoming requests objects as JSON. Then, we added app.use(cors()) to make our API publicly accessible. After that, we add get request using app.get to send some responses. We used app.listen to listen for a connection, ensuring the server is running.

Now let’s create a new folder called “routes”. In this folder, add a new file “about.js”.

about.js file creation

In about.js, we will import express.Router() and use get, post, put, and delete like the code below:


const express = require('express');
const router = express.Router();
router.get(`/`, function (req, res) {
res.status(200).json({msg: `Hi there! Welcome to our API. This is a GET request.`});
});
router.post(`/`,function (req, res) {
res.status(200).json({msg: `Hi there! This is a POST request.`});
})
router.put(`/`, function (req, res) {
res.status(200).json({msg: `Hi there! This is a PUT request.`})
})
router.delete(`/`, function (req, res) {
res.status(200).json({msg: `Hi there! This is a DELETE request`})
})
module.exports = router;

view raw

about.js

hosted with ❤ by GitHub

The code above is similar to SQL’s CRUD (Create, Read, Update, and Delete). In Express, post means to create, get means to read, put means to update, and delete means to delete.

After that, in index.js, import the about.js file that we’ve created and register the router from about.js file by using app.use.

The final code should look like this:


const express = require('express')
const cors = require('cors')
const app = express();
const about = require('./routes/about')
//middleware for server
app.use(express.json());
//to make API publicly accessible
app.use(cors());
//Register router from about
app.use('/about', about)
app.get('/', (req, res) => {
res.json('Welcome to the API')
})
//Listen for a connection
const port = process.env.PORT || 5500;
app.listen(port, () => console.log(`Listening to Port: ${port}`))

view raw

index.js

hosted with ❤ by GitHub

Now, let’s run the API using npm start in the command prompt:

command to run API in browser

Let’s check our browser. The homepage should give a response like below:

API response in browser

Let’s check the about page. The about page should show the data like below:

about.js page API response in browser

Now that you have a basic API created, let’s proceed to the step to deploy the API on Render. 

Step 2: Deploying the API on Render

First, create a repository and push the API project to GitHub.

Once completed, go to this link and sign up for a Render account (if you haven’t already).

Create a new web service on Render by connecting your GitHub repository that contains your API project.

create new web service Render

Next, configure the settings for your service, including the name, deployment environment, and path to your API code.

configure deployment environment

For the Root Directory, usually, I just insert a dot.

free tier instance type Render

For the Build Command, I inserted npm install, and the started command as node index.js.

You may also choose the instance type according to your preference. I chose the Free version.

After configuring the settings, click the “Create Web Service” button and leave everything to Render.

API deployed Render

Once deployment is complete, Render will provide you with a unique URL for your API.

API URL generated Render

You can access your API by visiting this URL in a web browser or by making HTTP requests. (This URL can be used to upload API on RapidAPI in the next step).

Step 3: Uploading the API to the RapidAPI Platform

RapidAPI is a platform that allows you to discover, publish, and monetize APIs.

Let’s go to this link and log in to your account (or sign up for a new account).

Once logged in, navigate to the “My APIs” section and click on “Add API Project”.

Provide the necessary details such as API name, description, category, and data import. I chose “do not import data”.

Then, click “Hub Listing” in the “General” tab and add the details such as logo, category, and short description. Also, make sure the “Visibility” is switched to “Public” if you want it to be accessible to everyone.  

set visibility to public

Under the “Base URL” section, add the API URL created from Render.

add API URL Render

Now, let’s move on to the “Definitions” tab.

Here, we can create a REST Endpoint and specify the required parameters, headers, and response formats for each endpoint.

endpoints creation RapidAPI
endpoint config RapidAPI

Here, I created an endpoint using the GET method, which fetches data from the about file.

Click “Save” and you will see your endpoints being listed.

endpoints listing RapidAPI

It is recommended to upload your API documentation, including information on how to access and utilize your API endpoints effectively. You can do this under the “Docs” tab.

Once your API is defined, you can set it up for monetization.

RapidAPI offers various monetization models, including pay-as-you-go, subscription-based, or freemium plans. Click on the monetization tab and choose the model that aligns with your API usage patterns and pricing strategies.

Configure the pricing details for your API, such as the cost per call or the subscription tiers and their associated features. Click on the “Edit” button and you will be able to configure the pricing and recommended plan.

configure price RapidAPI

Click on the “+” button and you will be able to set the quota type, quota requests limit, and limit type.

pro monetization config RapidAPI
monetization settings RapidAPI

You may test your endpoint by clicking the “Requests” tab. Status 200 means it’s working.

request status 200 RapidAPI

Finally, publish your API on the RapidAPI marketplace, making it available to potential users.

sampleAPI endpoint test success RapidAPI

Learning Tools

In order to create your own desirable and satisfying APIs, I recommend you explore the official documentation of Express and Node.js to understand their features, APIs, and best practices.

Likewise, these Express Node.js topics are also trending on YouTube, StackOverflow, and Reddit, so feel free to ask questions and learn from experienced developers.

If you don’t mind investing financially, I suggest learning about Node.js from online educational platforms such as Udemy and Coursera.

Learning Strategy

It is good to better understand the fundamentals of APIs and learn the core concepts of API designs, such as RESTful principles, HTTP methods, requests, and response structures, and not to forget about the data formats (examples: JSON, GraphQL, MongoDB, etc.).

Discovering and reviewing other existing well-designed APIs from established companies or popular platforms is beneficial for gaining insights into how they handle advanced features such as endpoints, payloads, filtering, pagination, and more.

Reflective Analysis

I really had fun developing this project and learning about several cloud hosting platforms, comparing them, and making decisions to obtain the best results. Sometimes we must invest financially to use the best options and determine whether it’s worth it in the future. Luckily, there are free options to choose from for small projects and testing.

Conclusion and Future Directions

In summary, throughout this tutorial, you gained the knowledge to craft a basic API utilizing the Express framework, successfully deployed it on Render, and delved into the process of uploading the API to RapidAPI. With your newfound ability to effortlessly deploy API on Render, you have the potential to enhance, customize, or even create more advanced APIs. If you found this guide valuable, feel free to share it with others who are interested in mastering the art of API deployment.

Check out the full project code here.

You can find out more APIs-related articles here.

Hire the author: Nurul H