Managing Firebase App Credentials with Doppler

While .env files are a common method for defining configs and secrets, it gives rise to security risks and the issue of manual management of .env files across different environments can be an uphill task. In this article, we will introduce a better way of managing and securing secrets using Doppler.

Goals

In this article, we will be using a music application linked to Firebase as a case study. The app makes use of its credentials to access and use Firebase services. We will cover how to set up a Doppler project and migrate our Firebase app credentials from the .env file to Doppler.

What is Secret Management?

Secret management refers to the methods and tools used to organize, manage and secure digital authentication credentials. These credentials could be API keys, SSH keys or even encryption keys used to authorize users to provide access to applications or services.

What is Doppler?

Doppler is an amazing service with tools to manage and secure your digital credentials. It makes secret management easier for the programmer, provides a simple interface in the form of a dashboard to access stored secrets thereby boosting productivity.
The Doppler CLI provided by Doppler is an interactive tool in addition to the dashboard, to easily manage secrets in the CLI. It allows multiple workspaces to access the same secret if stored in the same directory.

Why choose Doppler?

Doppler supports different integrations such as Firebase, Docker, and Heroku, among others, making it an all-round choice for secret management. Previously, programmers hardcoded their configuration credentials within a .env file. This file is a configuration file used to store variables that will be used in an application environment. This method though is associated with security risks of credentials and can be a headache to keep hardcoding credentials whenever needed, thus the need for a secret management service. Doppler makes all this easier for the programmer, eliminates the need for hardcoding credentials and provides security features for our secrets.

Doppler Setup

In this article, we will be looking at a music application built on firebase and how to manage the credentials for this application. This application makes use of the firebase credentials to access the firebase cloud storage and database.
The app is integrated with the Algolia service to render data stored in Firebase to the application in real-time. This third-party service requires firebase app credentials to function, hence the need to manage our application's secrets.

App Structure

     ┣ 📂pages
     ┃ ┣ 📂api
     ┃ ┃ ┗ 📜hello.js
     ┃ ┣ 📜index.js
     ┃ ┣ 📜library.js
     ┃ ┗ 📜_app.js
     ┣ 📂public
     ┃ ┣ 📂images
     ┃ ┃ ┣ 📜img1.jpg
     ┃ ┃ ┗ 📜img2.jpg
     ┃ ┣ 📂songs
     ┃ ┃ ┣ 📜Måneskin - Beggin ( Testo)_2.mp3
     ┃ ┃ ┗ 📜Young Dumb & Broke Khalid .mp3
     ┃ ┣ 📜favicon.ico
     ┃ ┗ 📜vercel.svg
     ┣ 📂styles
     ┃ ┣ 📜arrangement.module.css
     ┃ ┣ 📜globals.css
     ┃ ┣ 📜Home.module.css
     ┃ ┣ 📜layout.module.css
     ┃ ┣ 📜library.module.css
     ┃ ┣ 📜nav.module.css
     ┃ ┣ 📜player.module.css
     ┃ ┗ 📜search.module.css
     ┣ 📜.env
     ┣ 📜.eslintrc.json
     ┣ 📜.firebaserc
     ┣ 📜.gitignore
     ┣ 📜firebase.js
     ┣ 📜firebase.json
     ┣ 📜next.config.js
     ┣ 📜package-lock.json
     ┣ 📜package.json
     ┣ 📜README.md
     ┣ 📜yarn-error.log
     ┗ 📜yarn.lock

Here, we have the layout of our music application. Our focus is on our secret file: the .env file containing our firebase app credentials. In this file, we have:

    apiKey=BCzdSeAsRHUqMkC2SK6gEaXSX-GbJXgP5oyIoAQ
      authDomain=music-application-9d266.firebaseapp.com
      databaseURL=https://music-application-9d266-default-rtdb.firebaseio.com
      projectId=music-application-9d266
      storageBucket=music-application-9d266.appspot.com
      messagingSenderId=275317796075
      appId=1:677357796075:web:f01db248b63683x8f3b4ae
      measurementId=H-WL7BLDDZ3D

Creating a Doppler Project

To set up Doppler, we first need to create a user account, create a workspace then we create a project for our application.

After this you will get a project page similar to the image below:

Click on the “+” icon to create a new project and enter the name of the project.

After creating a project, you get an interface with three options: development, staging and production. These interfaces help us manage our app secrets in different stages of development.

Doppler CLI

Now, we will set up the Doppler CLI to manage our secrets via the command line. The Doppler installation guide provides different commands for installing Doppler CLI in different shells. I will be making use of the Windows OS CLI commands. To do this, we must first install the Scoop Package Manager, then use this to install the Doppler CLI. In Powershell, enter the following:

    Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUser

Select yes in the prompt that appears, then enter:

    iwr -useb get.scoop.sh | iex

Now we can install the CLI with the following script:

    # Add Doppler's scoop repo
    scoop bucket add doppler https://github.com/DopplerHQ/scoop-doppler.git

    # Install latest doppler cli
    scoop install doppler

After running the above commands, you can verify the installation by entering the following in the CLI:

    doppler --version

To set up the project on our local machine with Doppler, enter the following into the CLI:

    doppler login

This command opens up a browser window requesting for authentication. Login and enter the auth code provided by the CLI to complete the set up.

Secret management with Doppler

We can now migrate our app credentials from our .env file to Doppler. To do this, navigate to the project we created earlier on Doppler. Under development, click on dev.

Click on the import secrets option, then copy your app credentials into the provided space and click on import secret.

After this, we get a page displaying the added secrets:

Now to set up Firebase to fetch our app credentials from Doppler when we deploy our app, edit your package.json file as shown below:

      "name": "functions",
      "description": "Firebase app credentials",
      "scripts": {
        "lint": "eslint .",
        "serve": "doppler run -- firebase emulators:start --only functions",
        "shell": "doppler run -- firebase functions:shell",
        "start": "npm run shell",
        "deploy": "npm run update_config && firebase deploy --only functions",
        "update_config": "firebase functions:config:unset env && firebase functions:config:set env=\"$(doppler secrets download --config prd --no-file --silent)\"",
        "logs": "firebase functions:log"
      },
      .........
    }

Fill out the required fields and the next time you run firebase deploy in CLI to deploy your app to Firebase, the app credentials will be fetched from Doppler.

Conclusion

We have come to the end of this tutorial. In this tutorial, we learned the concept of secret management, how to set up a doppler project, and how to migrate our application credentials from a native .env file to Doppler and make use of these credentials whenever we deploy our application.