Configure a project

Connect your copy of Arc CMS to a Firebase project in three moves: create the project, give it the Firebase CLI alias default, and fetch its web settings. Do this before the first npm run dev: a fresh copy names no project, and stops until it has one. A project that Arc CMS has to itself needs nothing more; one shared with another app also runs npm run arc:configure.

Create the Firebase project

  1. In the Firebase console, add a project (or open one you have) and move it to the Blaze plan. Cloud Functions do not deploy without it.

  2. Firestore Database: create the database in production mode, in the region nearest your visitors. Arc CMS deploys its own security rules, and its first deploy puts the functions in the same region (see Regions). For a project shared with another app, skip this step: Arc CMS gets a database of its own (see Install profiles).

  3. Authentication: click Get started and turn on the Email/Password provider. The first admin signs up with it.

  4. Storage: click Get started. Arc CMS deploys its own storage rules.

  5. Project settings, General, Your apps: add a Web app. The next step fetches its settings for you.

Point the code at the project

  1. Tell the Firebase CLI which project to use. Give your development project the alias default:

    firebase use --add

    This writes .firebaserc, which git ignores. Add your live project the same way with the alias production when you have one.

  2. Fetch the project's web settings:

    npm run arc:configure -- --project=default --web-config=fetch

    This writes src/environments/firebase-web.<projectId>.ts; commit it. From then on npm run dev and npm run build use the default alias's project and print it as they start: Firebase project: <id> (the default alias, ...). Do the same for each other project (see Dev, staging and production).

Arc CMS ships environment.ts, environment.prod.ts and arc-install.ts with no project in them, so a new copy never talks to someone else's project. Until it has one, npm run dev and npm run build stop with "No Firebase project configured: run npm run arc:configure". You can instead paste your web settings into environment.ts by hand (environment.example.ts shows the shape); it is then used whenever the default alias has no file of its own.

The environment files

FileUsed by
src/environments/firebase-web.<projectId>.tsBuilds for that project (npm run deploy, ARC_PROJECT), and npm run dev and npm run build when it is the default alias's project. Written by npm run arc:configure -- --web-config=fetch, with the project's install settings too; never edit it by hand. See Dev, staging and production
src/environments/environment.tsnpm run dev when the default alias has no file of its own, and website builds for the default alias then. Ships with no project
src/environments/environment.prod.tsnpm run build when the default alias has no file of its own, and website builds for the production alias when it has none. Ships with no project
src/environments/environment.example.tsNothing: the template to copy from
src/environments/arc-install.tsThe app, for the database, bucket, upload folder and hosting site of each project. Written by npm run arc:configure; never edit it by hand. Ships empty
src/environments/index.tsRe-exports environment.ts

The app reads its own entry in arc-install.ts by the projectId in its firebaseConfig, so one build can hold settings for several projects. A project with no entry there uses the one its firebase-web.<projectId>.ts carries. These files are yours: Arc CMS never changes their values in an update (see Upgrade Arc CMS).

Install profiles

The profile says whether Arc CMS has the Firebase project to itself or shares it with another app.

standalone (the default)backend
Use it forA website or an app that owns its Firebase projectArc CMS next to an app you already have, as its admin or backend
Firestore database(default), unless you set databaseIdIts own named database, required (for example arccms); (default) is refused
Hosting siteThe project's own site, named like the project idRequired: a second site of its own, or none for no website
Storage bucketThe bucket in firebaseConfig.storageBucketRequired: a bucket of its own
Sign-ups after setupStay openClosed by the setup wizard once the first admin exists (adminOnlySignIn defaults to yes)
Setup commandsNonearc:configure prints the commands that create the database, site and bucket

For the reasons behind the backend rules (why the other app's database, rules and bucket are left alone), see Sharing a Firebase project.

Run arc:configure

Recommended: let the first npm run deploy do it. For a project with no settings it asks how the project is used (only by Arc CMS, or shared with another app), asks for the names it needs, and runs arc:configure for you (see Deploy for the first time). A standalone project that keeps every default needs no settings at all.

Alternative: run it yourself, with flags that set the project's entry in the config file. For example, a backend install on the default project:

npm run arc:configure -- --project=default --profile=backend --database=arccms --site=YOUR_PROJECT-arccms --bucket=YOUR_PROJECT-arccms --prefix=arccms/

To see what would change without writing anything:

npm run arc:configure -- --project=default --dry-run

What it does, step by step

  1. Finds the project: --project takes an alias from .firebaserc or a project id; without it, the default alias. With neither, it stops.

  2. If you passed flags, merges them into projects.<projectId> in arccms.config.json, creating the file if needed.

  3. Works out the project's settings: the top-level keys, overridden by the project's own entry, with blanks dropped and the defaults filled in.

  4. Checks them, and stops with a message for each problem: an unknown profile, a backend without its own database, site or bucket, a bad database id or upload folder.

  5. Writes the generated files (below), each only when its content changes, and lists what it created, updated or removed.

  6. For a backend profile, prints the commands that create the database, hosting site and bucket. It never creates cloud resources itself.

For a backend install, create the named database with the printed command before any deploy. A deploy, even firebase deploy --dry-run, creates a missing named database itself, in the project's default location, which cannot be changed afterwards. Create it in the same location as the other app.

The config file

arccms.config.json sits at the repository root and is ignored by git: it belongs to the checkout, like .firebaserc. arccms.config.example.json shows the shape. Top-level keys apply to every project; projects.<projectId> overrides them for one project. With no file, every project uses the defaults.

{
  "profile": "standalone",
  "projects": {
    "your-project-id": {
      "profile": "backend",
      "databaseId": "arccms",
      "hostingSite": "your-project-arccms",
      "storageBucket": "your-project-arccms",
      "storagePrefix": "arccms/"
    }
  }
}

Every value is a string.

KeyFlagDefaultWhat it sets
profile--profilestandalonestandalone or backend (see Install profiles)
projectsNoneNoneSettings for one project, keyed by project id; the keys below, for that project only
databaseId--database(default)The Firestore database Arc CMS uses: lowercase letters, digits and hyphens, 3 to 63 characters, starting with a letter
hostingSite--siteThe project's own siteThe Hosting site the website is deployed to and published pages go to; none publishes no website
storageBucket--bucketThe bucket in firebaseConfig.storageBucketThe bucket for uploads, without gs://
storagePrefix--prefixNone: the bucket rootThe folder every upload goes in: exactly one folder ending in a slash, such as arccms/
region--regionNoneThe location written into the printed setup commands, such as nam5; it also chooses the functions region when that is not set
functionsRegion--functions-regionus-central1, until the first deploy sets it next to the databaseWhere the functions run (see Regions)
firebaseConfig--web-config=fetch or --web-config=<file>None: the environment filesThe project's Firebase web settings, an object (see Dev, staging and production)
production--productionNot setyes: deploying asks for the project id to be typed back
buildMode--build-modeproduction for a project marked production, else developmentproduction: a build for this project runs like production, with no debug tools or instance label (see Build like production)
adminOnlySignIn--admin-only-sign-inyes for backend, no for standaloneyes: the setup wizard turns sign-ups off when it finishes
offlineCache--offline-cacheoffsingle-tab or multi-tab: data stays on the device for use offline (see Keep working offline)
analyticsConsent--analytics-consentalwaysrequired: Google Analytics tracks only visitors who accept the site usage banner (see Analytics)
appUsers--app-usersNoneown: this install's own users are the App audience
appUsersDatabase--app-users-database(default)The database the other app keeps its users in
appUsersPath--app-users-pathNot setWhere the other app's users are, as collection/{id}, such as users/{uid}

The three App audience keys are explained on App audience.

storagePrefix must be one folder with a trailing slash. arccms would put uploads in arccmsusers/, and a nested folder would leave private uploads outside the rules that protect them, so both are refused.

What gets generated

FileWhat it holdsIn git
src/environments/arc-install.tsFor every configured project that differs from the defaults: its database id, bucket, upload folder, admin-only sign-in, functions region and hosting site. The website build reads it.Yes: commit it
functions/.env.{projectId}The same settings for the Cloud Functions: ARC_DATABASE_ID (always), ARC_APP_USERS_DATABASE and ARC_APP_USERS_PATH (always), and ARC_HOSTING_SITE, ARC_STORAGE_BUCKET, ARC_STORAGE_PREFIX when set. Other lines in the file are kept.No
firebase.{projectId}.jsonA copy of firebase.json with the named database, own bucket or own site filled in, and without Hosting when the site is none. Removed when the project uses none of these. npm run deploy uses it for that project.No

The committed functions/.env holds the defaults every project starts from. The guided npm run deploy (run with no options) runs arc:configure again before each deploy of a configured project, so the generated files never go stale.

Always deploy with npm run deploy, never plain firebase deploy: only the former picks up firebase.{projectId}.json, so a plain deploy of a backend install sends the rules to the wrong database. And because arccms.config.json is not in git, copy it to any other computer you deploy from; the guided deploy stops when a project is set up in arc-install.ts but missing from the config file.

Next

Deploy for the first time: the local app calls the deployed functions and needs the deployed rules. Then Run it locally. Every key and generated value is also listed in Configuration keys.