ExpressJS REST API using Firebase Cloud Functions

Most of us find it pretty difficult to find a simplified hosting solution for our modern web applications. Firebase provides an easy and convenient way to develop and host our applications on google cloud.

Here is a quick-start guide and a short tutorial on how to launch your own API using Google Firebase and ExpressJS.

Pre-Requisites:
1. Node Version (8.0 and above)
2. Node Package Manager (npm)

Click on the Hosting in the left pane to get started with the web application development.

This image contains screenshots from two different instances merged into a single image.

Hit “Next” twice and “Continue to Console”.

** If you want to add a database for the API, then go to “Database” in the firebase console and follow the steps as in the image below.

This image contains screenshots from three different instances merged into a single image.

After that open a command window on the desktop using “Shift + Right Click”, “Open Command Window Here / Open PowerShell Here”.

Follow the steps as in the image to set up the firebase CLI on your system.

Choose the application that you have built using the Firebase console and continue with the same.

Keep on pressing the “Enter” / Choose “Y” or “N” according to your preference for the application. Here I have chosen Javascript and “n” for a single-page app configuration. (This can also be changed later)

So my firebase initialization is now complete.

Start a local web server

I will now proceed with the spinning up of a local web server using the firebase CLI itself.

Now let us start with the overall routing of the web application.

The overall routing of the application depends on the rewrites defined in the specific config file for firebase in the file named “firebase.json” generated during the initialization.

Rewrite Traffic to Cloud Functions / API

Here I am going to rewrite all the traffic to the cloud function named “api”.

The project structure can be clearly seen in this image.

Add dependencies to the application

Before writing our express API let us start with its installation in our project. We begin by adding express and its requisites in the functions folder as shown in the image below.

Link the API and the rewrite

Let us now build and link the functions to our web application. To begin with, we export the variable “api” which will be the endpoint that is searched by firebase after finding it on the rewrite in “firebase.json”.

Then shut down the server previously started and restart the server to emulate the functions in the local environment.

Test the API

Test the API using Insomnia / Postman / Browser as shown in the figure below.

( NB: Even though the API does not contain a response for the root, the application will still show the default landing page, since the static contents like index.html have been given higher priority than the cloud functions in firebase. )

Deploy the API

Use the built-in “firebase deploy” command to deploy the firebase application.

The hosting URL should work the same way as the local URL now.

Go to: https://project-name.web.app as shown in the command window to open the application.

Use https://project-name.web.app/bongs to test the API.

Thank You. Hope you enjoyed the tutorial. I will be coming up with the frontend and backend programming tutorials on this website as soon as possible. Keep supporting.

If you liked the tutorial please do like share and comment.