Skip to main content

Setting a new staging | production for your team.

Checkout a new branch for this staging

Checkout your code to a new brand, later on, you will push this branch to remote.

git checkout -b stagingX

Request leader to upgrade Project to Blaze plan (contact Thomas)

Without Blaze plan, we cannot deploy Firebase Functions to live. We need to upgrade the plan to Avada Billing account to setup.

Create Firestore DB

By default, Firebase may not yet create a Firestore DB for the project. You will need to create it manually. Prefer to choose the region on us-central for the default database and create with production mode.

Create authentication

Besides the Shopify App Bridge authentication via Shopify admin, we also use Firebase Authentication for managing logging via email for customers, and via our CRM. You will need to setup the Authentication with email/password enabled.

Create Firebase Storage

Same as the Firestore, Firebase does not init your Firebase Storage service by default. You may need to create it manually.

Create your Shopify app

Go to Avada Development partner account, create a new app for your staging with following setup:

  • Distribution set to public
  • Update Protected Data setting if needed.
  • Setup Shopify configuration with app URL, callback URL (replace with your domains)

App URL:


https://86e9-171-224-180-130.ngrok-free.app/auth/shopify

Allow redirection URLs:


https://86e9-171-224-180-130.ngrok-free.app/auth/shopify/callback
https://86e9-171-224-180-130.ngrok-free.app/authSa/shopify/callback
https://86e9-171-224-180-130.ngrok-free.app/auth/shopify/embed/callback
https://86e9-171-224-180-130.ngrok-free.app/auth/shopify/embed/callback/updateScopes
https://localhost:3000/auth/shopify/callback
https://localhost:3000/authSa/shopify/callback
https://localhost:3000/auth/shopify/embed/callback

Update gitlab.yaml file

Copy the Gitlab script for the new staging, replace the matching variable echoed from the Gitlab CI.

Add value to Gitlab CI/CD settings

In .gitlab-ci.yaml file, we echo credentials from Gitlab CI/CD settings via something like: echo VITE_SHOPIFY_API_KEY=$PROD_SHOPIFY_API_KEY >> packages/assets/.env.production. So to build and deploy your apps with credentials, you need to add our credentials from Firebase, Shopify to Gitlab CI/CD settings. Mostly, gitlab CI/CD settings will store assets .env file, scripttag .env file.

Update .firebaserc

Add you new project to .firebaserc. Remember to update your gitlab.yaml deploy command with firebase use match this staging alias.

firebase use --add

Update firebase functions config

You can copy the functions config from other staging using firebase functions:config:get and then set the value to notepad, sublime text. And then use this helper to form a new functions:config:set command.

Object.keys(config).map(masterKey => {
const childKeys = Object.keys(config[masterKey]);
return childKeys.map(keyItem => `${masterKey}.${keyItem}="${config[masterKey][keyItem]}"`)
}).flat().join(" ")

If your project use Firebase Functions Version 2, you cannot store backend credentials via firebase functions:config:get.

Deploy extensions and app

Deploy extensions and app config manually using Shopify CLI. Remember to change the production CDN URL to your staging URL.

Remember to set the access scopes config of the .toml file to use_legacy_install_flow = true instead of using scopes. Our app does not store scopes of each oAuth in Shopify app config but in each oAuth request. See Shopify documentation If you by default deploy app with use_legacy_install_flow=false, you might see that upon installing, you apps will only ask for Store Owner info, because you leave the scopes field under [access_scopes] empty.


[access_scopes]
# Learn more at https://shopify.dev/docs/apps/tools/cli/configuration#access_scopes
use_legacy_install_flow = true

After the push, it should NOT have the scopes saved in the Shopify partner.

Create app engine

Go to: https://console.cloud.google.com/appengine/start?project=PROJECT_ID and hit create. Sometimes, it is created by default or via Firebase CLI deploy already.

Update Service Account Token Creator role for app engine

It is the @appspot.gserviceaccount.com not the firebase SDK account. Make sure you add to the correct account.

Check if needed for Shopify Protected Data

If your app need to access Protected Data, remember to enable it, view the related guide

Enable IAM Service Account Credentials API

We need to assign our App Engine the role to sign the Token, it is just GCP IAM thing.

Copy Big Query table if needed

You can copy Big Query dataset and tables across your projects easily by going to Big Query, click the Copy button, and then choose your desired destination. If you have staging 1 setup with the Big QUery already, just copy it over to the staging 2, staging 3, etc.

Use Avada Private Runner

You need to be the Owner of the gitlab project to change it CI/CD settings. You need to disable the shared runner and enable the group runner for your project:

If you forget this, your new project will use Gitlab shared runner , which requires top-up. In Avada, we use self-hosted Gitlab runner instances to run our CI/CD tasks.

Check if function is public

If after deploying your functions, but public functions like Client API, or auth response with 403, 401 error that you cannot access the function, you need to check if the function is public. You can check the function in the Firebase to see if allUsers is assigned the Cloud Function Invoker role. If not, the function is not public.

Request Asset API exemption if needed.

Some apps like Avada SEO, SEOon Blog, we have the Asset API exemption request approved. If you need extra staging sites for these app, you may need to ask your exemption via Google Form as well.