When deploying your app to Firebase App Hosting, the build process is automatically handled by Google Cloud Build. While this makes deployment convenient, it poses a challenge: you can’t directly run custom GitHub Actions scripts or set environment configurations during the build.

When working with multiple environments such as development, staging, and production, you need to configure dynamic environment variables, such as API keys.

Firebase App Hosting allows integration with Google Cloud Secret Manager, meaning we can configure Firebase to securely access secrets stored in Google Cloud.

Before going any further, note that this example is taken from our open-source project Tanam CMS, which we’re working on here at Oddbit.

Let’s start with the apphosting.yaml:

Make sure to configure your environment first by setting all the environment variables in a .env file. In this case, for Next.js, it would look something like this:

After populating these values, you can read them into local environment variables and update the app hosting secrets for each field:

However, there’s a way to improve this: instead of manually updating secrets every time, we can automate it. Here’s how to configure Firebase App Hosting to only update environment variables if they have changed, and to do it automatically with GitHub Actions for each push to your live branch (which will trigger a cloud build for Firebase App Hosting deployment on Google Cloud Build).

Configuring App Hosting from GitHub Actions

You’ll need to configure the following GitHub Actions secrets:

• APP_CMS_DOT_ENV - The same contents as your .env file for your app hosting.
• APP_HOSTING_BACKEND - The ID of your app hosting backend.
• FIREBASE_DEPLOY_SA - The service account for deploying to Firebase and GCP.

The workflow file below will check the existing secrets in Google Secret Manager and compare each value to the corresponding environment variable provided in the GitHub Action Secret for .env. The values will only be updated to the cloud if the GitHub environment variable has changed.

Final Thoughts

By combining Firebase App Hosting, Google Cloud Secret Manager, and GitHub Actions, you can securely manage and update environment variables during the build process without manual intervention. This setup not only increases security but also automates repetitive tasks, ensuring a smoother CI/CD pipeline for your app hosted on Firebase.

Now you can rest easy, knowing your deployment is automated, your secrets are secure, and your environment is always up to date.