Environment configuration in Firebase - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to initialize Firebase with the correct environment configuration.

Firebase

const firebaseConfig = {
  apiKey: "[1]",
  authDomain: "your-app.firebaseapp.com",
  projectId: "your-app",
  storageBucket: "your-app.appspot.com",
  messagingSenderId: "1234567890",
  appId: "1:1234567890:web:abcdef123456"
};

Drag options to blanks, or click blank then click option'

Afirebase.apiKey

Bprocess.env.FIREBASE_API_KEY

Cconfig.apiKey

Denv.FIREBASE_KEY

Attempts:

3 left

💡 Hint

Common Mistakes

Hardcoding the API key directly in the code.

Using incorrect variable names like firebase.apiKey.

Use process.env.FIREBASE_API_KEY to securely access the API key from environment variables.

2fill in blank

medium

Complete the code to load environment variables from a .env file using Firebase CLI.

Firebase

firebase functions:config:get > .runtimeconfig.json

const functions = require('firebase-functions');
const config = functions.config();

console.log(config.[1]);

Drag options to blanks, or click blank then click option'

Afirebase_api_key

BapiKey

Capi_key

Dapikey

Attempts:

3 left

💡 Hint

Common Mistakes

Using camelCase keys like apiKey which Firebase does not recognize.

Using incorrect key names that do not match the config.

Firebase environment config keys are usually lowercase with underscores, like api_key.

3fill in blank

hard

Fix the error in accessing the Firebase environment variable in this code snippet.

Firebase

const apiKey = process.env.[1];
if (!apiKey) {
  throw new Error('Missing Firebase API key');
}

Drag options to blanks, or click blank then click option'

AFIREBASE_APIKEY

BfirebaseApiKey

Cfirebase_api_key

DFIREBASE_API_KEY

Attempts:

3 left

💡 Hint

Common Mistakes

Using lowercase or camelCase names for environment variables.

Missing underscores in the variable name.

The environment variable name must exactly match FIREBASE_API_KEY to be found.

4fill in blank

hard

Fill both blanks to correctly set and access Firebase environment variables in functions.

Firebase

firebase functions:config:set [1]="your_api_key"

const apiKey = functions.config().[2];

Drag options to blanks, or click blank then click option'

Afirebase.api_key

Bfirebase_api_key

Cfirebase.apiKey

Dfirebase_apiKey

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing camelCase and underscore styles.

Using dot notation in the key name when setting config.

Use the same key firebase_api_key when setting and accessing environment variables.

5fill in blank

hard

Fill all three blanks to securely use Firebase environment variables in your Cloud Function.

Firebase

exports.myFunction = functions.https.onRequest((req, res) => {
  const apiKey = functions.config().[1];
  if (!apiKey) {
    res.status(500).send('[2]');
    return;
  }
  res.send(`API Key is: [3]`);
});

Drag options to blanks, or click blank then click option'

Afirebase_api_key

BMissing API key in environment configuration

C${apiKey}

Dapi_key

Attempts:

3 left

💡 Hint

Common Mistakes

Using incorrect key names.

Not handling missing keys properly.

Not using template literals for variable interpolation.

Use firebase_api_key to access the key, send a clear error message if missing, and use template literals to display the key.