Managing development, staging and production environments in firebase

Use Firebase Functions

Second approach is to use firebase functions as backend server and write functions that act as a api for your client apps to use, in this approach, client apps can use the firebase client SDK to call the function or write their own custom api handler to make the network calls to firebase functions api endpoints. Here is how to do it in code

• 
  .
  
  
  

  Steps of pointing a custom domain to your functions is also different, with v2 functions, you can do it from the ,

  
  
  

  Step 2 - Initialise project aliases in .firebaserc file

  
  
  

  This is what .firebaserc looks like
  
  

  
  
  
  
  

  CODE Kopieren

  {
  
    "projects": {
  
      "default": "<prod-or-stage-project-id>",
  
      "dev": "stage-project-id",
  
      "prod": "prod-project-id",
  
      "stage": "stage-project-id"
  
    },
  
    "targets": {},
  
    "etags": {}
  
  }
  
  

  
  
  
  
  
  
  
  

  Step 3 - Set the correct alias and project id in the build command
  
  

  
  
  
  
  

  CODE Kopieren

      "serve": "firebase use dev && npm run build && firebase emulators:start --import ./.db --export-on-exit ./.db",
  
      "deploy": "firebase use prod && firebase deploy --only functions --project <prod-project-id>",
  
      "deploy:stage": "firebase use stage && firebase deploy --only functions --project <stage-project-id>",
  
  

  
  
  
  
  
  
  
  

  Once this is done, and when we run the commands, firebase initialises the process.env.GCLOUD_PROJECT with the correct firebase project id and process.env.FUNCTIONS_EMULATOR boolean to tell if the emulator is running, we will use these two variables to find the environment, here is how we do it in code, and note that the code below must be executed at the very top of the root file of your project, so others can access the environment variables loaded using the dotenv package.
  
  

  
  
  
  
  

  CODE Kopieren

  const projectId = process.env.GCLOUD_PROJECT;
  
  const isEmulatorRunning = process.env.FUNCTIONS_EMULATOR === "true";
  
  let env;
  
  
  
  if (projectId === "prod-project-id") {
  
    env = "prod";
  
  } else if (projectId === "stage-project-id" && !isEmulatorRunning) {
  
    env = "stage";
  
  } else {
  
    env = "dev";
  
  }
  
  
  
  require("dotenv").config({path: `.env.${env}`});
  
  

  
  
  
  
  
  
  
  

  Once, the above code is executed, you can read the environment variables anywhere in your codebase. The code below will now work
  
  

  
  
  
  
  

  CODE Kopieren

  // In this code, both the variables -- BASE_URL and APP_ENV will be available with the correct values
  
  
  
  const functionsConfig = {
  
    maxInstances: 1,
  
    cors: process.env.BASE_URL,
  
    timeoutSeconds: 540,
  
  };
  
  
  
  exports.api = onCall(functionsConfig, (request) => {
  
      console.log('APP_ENV', process.env.APP_ENV);
  
  });
  
  

  
  
  
  
  
  
  
  

  Let me know if there is another way to achieve this, this is what i have tested and it works just fine for me.

  
  
  

  
  
  
  Managing Staging & Production Environments with Firebase
  

  
  
  

  To have a clear, separate and truly independent environments in firebase, , and this is how you setup a cloudflare rule to block public access to your staging frontend and backend URLs.

  
  
  

  

  Vollständiger Original-Artikel

  Den kompletten Beitrag mit allen Details direkt auf dev.to lesen.

  ↗ Original-Artikel auf dev.to lesen