Use TypeScript with Google CloudFunction and Deploy locally

TypeScript + Node.js + CloudFunction + FireStore

This blog try to demo how to deploy a Google Cloud Function that will interact with fireStore NOSQL database, and use TypeScript for static typing at development, and instead of use CI/CD pipeline will just use husky at local to gard and watch the quality of the code and deploy to the Google cloud locally.

Pre Requirement

Before we start writing the code, there're few pre requirement are not include in this blog but require the application to run.

• GCP Account/Project - make sure has active GCP account and GCP project setup.
• Firebase Account/Project - Your fireBase should connect with GCP, logged on to the Firebase and find the fireStore.
• Run gcloud config list - to make sure your local environment are connect to the correct project.

Setup npm repo

Now, let's get started, first we'll need to initialize the npm repo by run the following command on your local. This will create package.json file with default setting.

npm init -y

Install dependencies packages

We'll install following dependencies packages since we'll interact with firebase.

npm install --save firebase-admin firebase-functions

Install dev dependencies packages

Install following package during the build time, such as typescript for static typing and eslint for syntax analyzer.

npm install --save-dev typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint eslint-config-google eslint-plugin-import firebase-functions-test

Update main field at package.json

Update the package.json for start file.

"main": "dist/index.js",

Start writing Code index.ts

let's create a file index.ts under root folder, and add following code. These are import some package we'll use later, the firebase-functions/v2 will use the Google Cloud Function gen2, which will have better performance.

import * as functions from "firebase-functions/v2";
import {initializeApp} from "firebase-admin/app";
import {getFirestore} from "firebase-admin/firestore";

Next, we'll initialize the app, and start use the fireStore, so add following code.

initializeApp();

const db = getFirestore();

Finally, we'll hook with firebase's functions to listen to the request, no inside the onRequest will be add our main logic, which either get data from fireStore or some update or delete operations.

exports.main = functions
    .https.onRequest(async (request, response) => {

      console.info('on request');

    });

Create tsconfig.json

Since we have our first code is ready, let's create our first tfconfig.json to compile the typescript into javascript. We'll also add following command to the package.json's scripts section.

Once run the npm run build, so our code will start to compile the index.ts and create javascript file under the dist/index.js.

"scripts": {
    "build": "tsc"
}

Ready to Deploy Code

So that's all we need for now, we should be able continue adding code to the typescript file index.ts, and able to use the simple typescript build to run the npm run build to compile the typescript into the javascript and ready to deploy to the production.

Deploy from Local

In this blog, we don't have lots developer works on the same repo, when many ppl work on the same repository it'll be better to use CI/CD with git pull request so whenever some one create new pull request to the main branch can start continue integration and deploy the latest code to the correct environment.

So instead we'll add following gcloud command to the scripts section, when you ready to deploy to the google cloud, we can just run the npm run deploy, which will set the gcloud project and deploy cloud function.

"scripts": {
    "deploy": "npm run deploy:project && npm run deploy:run",
    "deploy:project": "gcloud config set project set-to-the-correct-project-id",
    "deploy:run": "gcloud functions deploy your-cloud-function-name --trigger-http --region=us-central1 --runtime=nodejs16 --gen2 --allow-unauthenticated --entry-point=main --run-service-account=service-account-can-run-the-cloud-function"
}

TypeScript deployment with Cloud Function with fireStore

That'a all for create typescript for cloud function and interact with fireStore and deploy locally.

Other choice?

Since we use fireStore, which is part of firebase, we could use firebase's firebase-tools to generate list of files to support typescript, now when use with firebase tools, to setup the cloud function, few setting you'll have to follow with firebase's setting.

set node.js version

"engines": {
    "node": "16"
}

set region

functions.setGlobalOptions({
  region: 'us-west1-a'
});

set gen2

import * as functions from "firebase-functions/v2";

set function name

Now, following is how you set the function name, once I don't like is that exports.main limit the name can be define, use glcoud to define the function name, entry point, or gen2 are much more easlier than the firebase's settings.

exports.main = functions

Conclusion

Use firebase's firebase-tools could simply setup typescript for firebase cloud function, and after tried a while use gcloud has maximum flexibility compare with firebase-tools, it could be improve but at this point I feel just use the typescript is much more easier.