Photo by SpaceX on Unsplash

Create Firebase Serverless APP with custom domain name

Create a Firebase Serverless API with Swagger UI

Paul Allies
3 min readJul 13, 2019

--

Install Firebase-tools

npm i -g firebase-tools@latest

Initialise Project

Deploy

View Project in Firebase Console.

Log into firebase console and view project details

You’ll notice that you have two newly created publicly accessible urls for your hosting site, (web.app and firebaseapp.com)

Your project should have the following structure

create an API endpoint in functions/index.js called “hi”

functions/index.js

If you wish, change your single page app index.html file

and configure your project to allow api to be accessed from the /api/* path

deploy one more time

$> firebase deploy

Access SPA from browser

Access API from browser

Change to custom domain

Click on “connect domain” and click through wizard to add your custom name with A records at DNS provider.

Wait a while and then access the site and api from custom domain name. This may take up to 24 hours

Document API with Swagger UI

Swagger UI allows anyone — be it your development team or your end consumers — to visualise and interact with the API’s resources without having any of the implementation logic in place. It’s automatically generated from your OpenAPI (formerly known as Swagger) Specification, with the visual documentation making it easy for back end implementation and client side consumption.

Download the swagger front-end files from git hub repo to the public folder.

add a swagger.yaml file to you folder and edit the index.html. Replace the url: “https://petstore.swagger.io/v2/swagger.json" with url: “swagger.yaml”. This file documents your api

Update the hosting file (firebase.json)

deploy and navigate to documentation /swagger-ui.

--

--