Environment configuration in Firebase - Step-by-Step Execution

Process Flow - Environment configuration

Start

↓

Create .env file

↓

Add environment variables

↓

Use variables in firebase config

↓

Deploy or run locally

↓

Firebase reads env variables

↓

App uses config values

↓

End

This flow shows how environment variables are created, added to Firebase config, and used during deployment or local run.

Execution Sample

Firebase

FIREBASE_API_KEY=abc123
FIREBASE_AUTH_DOMAIN=myapp.firebaseapp.com
firebase deploy

Defines environment variables and deploys Firebase app using those variables.

Process Table

Step	Action	Environment Variable State	Firebase Behavior	Result
1	Create .env file	No variables yet	No config available	File created, empty
2	Add FIREBASE_API_KEY	FIREBASE_API_KEY=abc123	Config updated with API key	API key ready for use
3	Add FIREBASE_AUTH_DOMAIN	FIREBASE_API_KEY=abc123, FIREBASE_AUTH_DOMAIN=myapp.firebaseapp.com	Config updated with auth domain	Auth domain ready for use
4	Run firebase deploy	Variables loaded from .env	Firebase reads env variables	App deployed with correct config
5	App starts	Variables accessible in app	App initializes with config	App connects to Firebase services
6	End	Variables remain accessible	Firebase services running	App fully functional

💡 Deployment completes and app runs using environment variables from .env file

Status Tracker

Variable	Start	After Step 2	After Step 3	After Step 4	Final
FIREBASE_API_KEY	undefined	abc123	abc123	abc123	abc123
FIREBASE_AUTH_DOMAIN	undefined	undefined	myapp.firebaseapp.com	myapp.firebaseapp.com	myapp.firebaseapp.com

Key Moments - 3 Insights

Why do we need a .env file instead of hardcoding variables?

Using the .env file keeps sensitive info like API keys out of code, and lets Firebase read them securely during deploy (see execution_table steps 2-4).

What happens if environment variables are missing during deploy?

Firebase won't have the needed config, so the app may fail to connect to services (see execution_table step 4 where variables must be loaded).

Are environment variables accessible after deployment?

Yes, they remain accessible to the app at runtime for configuration (see execution_table steps 5-6).

Visual Quiz - 3 Questions

Look at the execution_table, what is the state of FIREBASE_API_KEY after step 3?

A abc123

B myapp.firebaseapp.com

C undefined

D empty string

💡 Hint

Check the 'Environment Variable State' column at step 3

At which step does Firebase read the environment variables?

A Step 2

B Step 3

C Step 4

D Step 5

💡 Hint

Look at the 'Firebase Behavior' column for when variables are loaded

If FIREBASE_AUTH_DOMAIN was not added in step 3, what would happen at step 5?

A App connects normally

B App fails to initialize auth domain

C Firebase deploy fails

D No effect on app

💡 Hint

Refer to variable_tracker and execution_table steps 3 and 5

Concept Snapshot

Environment configuration in Firebase:
- Store sensitive keys in a .env file
- Add variables like FIREBASE_API_KEY and FIREBASE_AUTH_DOMAIN
- Firebase reads these during deploy
- App uses variables at runtime
- Keeps config secure and flexible

Full Transcript

Environment configuration in Firebase involves creating a .env file to store sensitive information like API keys and auth domains. These variables are added step-by-step and loaded by Firebase during deployment. The app then accesses these variables at runtime to connect to Firebase services securely. This method avoids hardcoding secrets and allows easy updates without changing code.

Practice

1. What is the main purpose of environment configuration in Firebase functions?

easy

A. To create new Firebase projects

B. To write the main logic of the function

C. To deploy the Firebase project

D. To store settings outside the code for security and flexibility

Solution

1. Step 1: Understand environment configuration role

   Environment configuration holds settings like API keys or URLs outside the code to keep them safe and easy to change.

2. Step 2: Compare options with this role

   Only To store settings outside the code for security and flexibility describes storing settings outside code for security and flexibility, which matches the purpose.

3. Final Answer:

   To store settings outside the code for security and flexibility -> Option D

4. Quick Check:

   Environment config = store settings outside code [OK]

Hint: Environment config = safe settings outside code [OK]

Common Mistakes:

• Confusing environment config with function logic
• Thinking environment config deploys projects
• Mixing environment config with project creation

2. Which command correctly sets an environment variable named api.key with value 12345 in Firebase functions?

easy

A. firebase config:set api.key 12345

B. firebase functions:config:set api.key=12345

C. firebase functions:set-config api.key=12345

D. firebase functions:config add api.key 12345

Solution

1. Step 1: Recall correct syntax for setting config

   The correct command uses 'firebase functions:config:set' followed by key=value pairs.

2. Step 2: Match options to syntax

   Only firebase functions:config:set api.key=12345 matches the exact syntax: 'firebase functions:config:set api.key=12345'. Others have wrong commands or missing colons.

3. Final Answer:

   firebase functions:config:set api.key=12345 -> Option B

4. Quick Check:

   Set config = functions:config:set key=value [OK]

Hint: Use 'functions:config:set key=value' to set env vars [OK]

Common Mistakes:

• Omitting the colon after 'functions'
• Using spaces instead of '=' between key and value
• Using wrong command verbs like 'add' or 'set-config'

3. Given the following commands run in order:
firebase functions:config:set service.api_key="abc123"
firebase deploy --only functions

What will functions.config().service.api_key return inside your function?

medium

A. service.api_key

B. undefined

C. "abc123"

D. null

Solution

1. Step 1: Understand setting and deploying config

   Setting 'service.api_key' with value 'abc123' and then deploying functions makes the config available inside functions.

2. Step 2: Accessing config in function

   Accessing 'functions.config().service.api_key' returns the string value set, which is 'abc123'.

3. Final Answer:

   "abc123" -> Option C

4. Quick Check:

   Config value = "abc123" after deploy [OK]

Hint: Deploy after setting config to access values [OK]

Common Mistakes:

• Forgetting to redeploy functions after setting config
• Expecting config to be available without deploy
• Confusing key names or accessing wrong path

4. You set an environment variable with firebase functions:config:set db.url="https://mydb.com" but inside your function functions.config().db.url returns undefined. What is the most likely cause?

medium

A. You forgot to redeploy the functions after setting the config

B. The config key name is invalid

C. You need to restart the Firebase CLI

D. The value must be a number, not a string

Solution

1. Step 1: Identify cause of undefined config

   Config values only update inside functions after redeploying them.

2. Step 2: Check other options

   Key names can be strings, no CLI restart needed, and values can be strings. So these are not causes.

3. Final Answer:

   You forgot to redeploy the functions after setting the config -> Option A

4. Quick Check:

   Redeploy needed after config change [OK]

Hint: Always redeploy functions after config changes [OK]

Common Mistakes:

• Assuming config updates instantly without deploy
• Restarting CLI unnecessarily
• Thinking config keys must be numbers

5. You want to store two environment variables for your Firebase functions: api.key with value key123 and api.secret with value secret456. Which command correctly sets both at once?

hard

A. firebase functions:config:set api.key=key123 api.secret=secret456

B. firebase functions:config:set api.key=key123; api.secret=secret456

C. firebase functions:config:set api.key=key123, api.secret=secret456

D. firebase functions:config:set api.key=key123 && api.secret=secret456

Solution

1. Step 1: Recall syntax for multiple config keys

   Multiple keys are set by listing them separated by spaces, each as key=value pairs.

2. Step 2: Evaluate options

   Only firebase functions:config:set api.key=key123 api.secret=secret456 uses spaces correctly. Others use semicolon, comma, or && which are invalid here.

3. Final Answer:

   firebase functions:config:set api.key=key123 api.secret=secret456 -> Option A

4. Quick Check:

   Multiple keys set with spaces [OK]

Hint: Separate multiple keys with spaces, not commas or semicolons [OK]

Common Mistakes:

• Using commas or semicolons instead of spaces
• Trying to chain commands with &&
• Setting keys one at a time unnecessarily