Firebase Setup

Git downloads CrowdCAD's code and later pulls in updates. You only install it once.

%git --version

PS>winget install -e --id Git.Git

PS>git --version
git version 2.51.0.windows.1

Node.js runs CrowdCAD's setup scripts. It includes npm, which downloads the packages CrowdCAD needs.

PS>winget install -e --id OpenJS.NodeJS.LTS

PS>Set-ExecutionPolicy -Scope CurrentUser -ExecutionPolicy RemoteSigned

Check that Node.js and npm work:

%node -v
%npm -v
v22.20.0
10.9.3

PS>node -v
PS>npm -v
v22.20.0
10.9.3

CrowdCAD's code is hosted on GitHub. You need a free account to make your own copy. If you already have one, sign in and skip this step.

Go to github.com/signup and follow the prompts. Remember your username. You will use it in a later step.

A fork is your own copy of CrowdCAD on GitHub. It belongs to you, it can hold your organization's changes, and it stays connected to the original so you can pull in new releases.

1. Open github.com/crowdcad/crowdcad while signed in to GitHub.
2. Click Fork near the top right of the page.
3. Leave the owner as your username and the name as crowdcad, keep Copy the main branch only checked and click Create fork.

GitHub opens your fork at github.com/YOUR_USERNAME/crowdcad. From here on, the original crowdcad/crowdcad is called upstream: it is where new CrowdCAD releases come from.

First move the terminal to your home folder. cd means "change directory", and ~ is a shortcut for your home folder.

%cd ~

PS>cd ~

Now download (clone) your fork. Paste the command, replace YOUR_USERNAME with your GitHub username and press ReturnEnter:

%git clone https://github.com/YOUR_USERNAME/crowdcad.git
Cloning into 'crowdcad'...
Resolving deltas: 100%, done.

PS>git clone https://github.com/YOUR_USERNAME/crowdcad.git
Cloning into 'crowdcad'...
Resolving deltas: 100%, done.

Move into the new folder. Every remaining command in this guide runs from inside it.

%cd crowdcad

PS>cd crowdcad

Your download already knows about your fork, under the name origin. This command also connects it to the original CrowdCAD, under the name upstream, so you can download future updates with one command.

%git remote add upstream https://github.com/crowdcad/crowdcad.git

PS>git remote add upstream https://github.com/crowdcad/crowdcad.git

Check both connections:

%git remote -v
origin    https://github.com/YOUR_USERNAME/crowdcad.git (fetch)
origin    https://github.com/YOUR_USERNAME/crowdcad.git (push)
upstream  https://github.com/crowdcad/crowdcad.git (fetch)
upstream  https://github.com/crowdcad/crowdcad.git (push)

PS>git remote -v
origin    https://github.com/YOUR_USERNAME/crowdcad.git (fetch)
origin    https://github.com/YOUR_USERNAME/crowdcad.git (push)
upstream  https://github.com/crowdcad/crowdcad.git (fetch)
upstream  https://github.com/crowdcad/crowdcad.git (push)

This downloads the code libraries CrowdCAD is built from into a node_modules folder inside crowdcad.

%npm install
added 1024 packages in 1m

PS>npm install
added 1024 packages in 1m

1. Go to console.firebase.google.com and sign in with your Google account.
2. Click Create a project (or Get started with a Firebase project).
3. Name it, for example crowdcad-your-team. Under the name, Firebase shows a project ID such as crowdcad-your-team-1a2b3. Write the project ID down. You will need it in step 15.
4. Continue through the next screens. You can turn off Google Analytics and the AI assistant.
5. Click Create project, wait a minute, then click Continue.

1. Open Authentication from the left sidebar of the Firebase console. It may sit inside a category such as Build, or you can type "Authentication" into the search bar at the top.
2. Click Get started.
3. On the Sign-in method tab, click Email/Password.
4. Turn on the first switch (Email/Password). Leave "Email link" off. Click Save.

1. Open Firestore Database from the left sidebar of the Firebase console. It may sit inside a category such as Build, or you can type "Firestore Database" into the search bar at the top.
2. Click Create database. If asked to choose an edition, pick Standard.
3. Leave the database ID as (default). CrowdCAD only uses the default database.
4. Pick a location close to where your team works. It cannot be changed later.
5. Choose Start in production mode and click Create.

Production mode locks the database until CrowdCAD's own security rules are uploaded in step 15.

1. Click the gear icon next to Project Overview and choose Project settings.
2. On the General tab, scroll to Your apps and click the web icon </>.
3. Enter a nickname such as CrowdCAD. Leave Firebase Hosting unchecked. Click Register app.
4. Firebase shows a block of code containing const firebaseConfig = {. Keep this page open for the next step. You can find it again any time under Project settingsGeneralYour apps.

const firebaseConfig = {
  apiKey: "AIzaSy...",
  authDomain: "your-project-id.firebaseapp.com",
  projectId: "your-project-id",
  storageBucket: "your-project-id.firebasestorage.app",
  messagingSenderId: "123456789012",
  appId: "1:123456789012:web:abc123def456"
};

CrowdCAD reads its settings from a file named .env.local. Make it by copying the example file that came with the download:

%cp .env.example .env.local

PS>Copy-Item .env.example .env.local

Then open it in a text editor:

%open -e .env.local

PS>notepad .env.local

Copy each value from the firebaseConfig block in your browser into the matching line of .env.local. Copy only the text between the quotation marks, and don't add quotation marks or spaces in the file.

When you are done, the Firebase section of the file looks like this, with your own values:

NEXT_PUBLIC_BACKEND=firebase
NEXT_PUBLIC_FIREBASE_API_KEY=AIzaSy...
NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=your-project-id.firebaseapp.com
NEXT_PUBLIC_FIREBASE_PROJECT_ID=your-project-id
NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=your-project-id.firebasestorage.app
NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=123456789012
NEXT_PUBLIC_FIREBASE_APP_ID=1:123456789012:web:abc123def456

• NEXT_PUBLIC_BACKEND should stay firebase.
• If your firebaseConfig has no measurementId, delete the NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID line.
• Leave the PocketBase lines as they are. They are ignored.

Save with ⌘+SCtrl+S and close the editor.

Skip this step if you don't need to upload venue map images yet. Everything else works without it.

1. Open Storage from the left sidebar of the Firebase console. It may sit inside a category such as Build, or you can type "Storage" into the search bar at the top.
2. Click Upgrade project and follow the prompts to add a billing account and switch to the Blaze plan. When offered, set a budget alert (for example $5) so Google emails you before any real charges.
3. Back in Storage, click Get started. For the lowest cost choose a location in US-CENTRAL1, US-EAST1 or US-WEST1, start in production mode and click Create.
4. Open the Rules tab, replace everything in the editor with the rules below and click Publish. They let signed-in users upload images up to 20 MB into the venue map folder.

rules_version = '2';
service firebase.storage {
  match /b/{bucket}/o {
    match /venue_maps/{file} {
      allow read: if request.auth != null;
      allow write: if request.auth != null
        && request.resource.size < 20 * 1024 * 1024
        && request.resource.contentType.matches('image/.*');
    }
  }
}

CrowdCAD comes with rules that control who can read and change each venue, event and log. This step uploads them to your database with the Firebase command-line tool. First, sign in:

%npx -y firebase-tools login
? Allow Firebase to collect CLI and Emulator Suite usage and error reporting information? (Y/n)

✔  Success! Logged in as you@gmail.com

PS>npx -y firebase-tools login
? Allow Firebase to collect CLI and Emulator Suite usage and error reporting information? (Y/n)

✔  Success! Logged in as you@gmail.com

Answer the question with Y or n (either is fine) and press ReturnEnter. A browser window opens. Choose your Google account and click Allow, then return to the terminal.

Now upload the rules. Replace YOUR_PROJECT_ID with the project ID from step 8:

%npx -y firebase-tools deploy --only firestore:rules --project YOUR_PROJECT_ID
✔  firestore: released rules firestore.rules to cloud.firestore

✔  Deploy complete!

PS>npx -y firebase-tools deploy --only firestore:rules --project YOUR_PROJECT_ID
✔  firestore: released rules firestore.rules to cloud.firestore

✔  Deploy complete!

%npm run dev
   ▲ Next.js 15.5.23
   - Local:        http://localhost:3000

 ✓ Ready in 3.2s

PS>npm run dev
   ▲ Next.js 15.5.23
   - Local:        http://localhost:3000

 ✓ Ready in 3.2s

1. When it says Ready, open http://localhost:3000 in your browser. The first page load takes a little longer.
2. Click Sign In, then Sign Up under "Don't have an account?", and create an account with your email and a password of at least 6 characters.

Admins can manage the certification list and give admin access to others from ProfileAdmin. The first admin is set with a private key file that lets a script change your account.

1. In the Firebase console, open Project settingsService accounts and click Generate new private key, then Generate key. A .json file downloads.
2. Rename the downloaded file to crowdcad-admin-key.json and move it into your home folder (/Users/your-nameC:\Users\your-name). Keep it out of the crowdcad folder.
3. In your second terminal window, run the command below. Replace you@example.com with the email you signed up with in step 16.

%GOOGLE_APPLICATION_CREDENTIALS="$HOME/crowdcad-admin-key.json" node scripts/setAdmin.js you@example.com
Granted admin access for you@example.com (uid: Xy12AbCdEf34GhIj)

PS>$env:GOOGLE_APPLICATION_CREDENTIALS="$HOME\crowdcad-admin-key.json"
PS>node scripts/setAdmin.js you@example.com
Granted admin access for you@example.com (uid: Xy12AbCdEf34GhIj)

Refresh CrowdCAD in your browser to see the Admin section in your profile. From now on you can make other people admins from ProfileAdminManage Admins.

In the terminal running npm run dev, press Ctrl+C to stop it. Then run these two commands, one at a time:

%npm run build

PS>npm run build

%npm start
   ▲ Next.js 15.5.23
   - Local:        http://localhost:3000
   - Network:      http://192.168.1.20:3000

 ✓ Ready in 412ms

PS>npm start
   ▲ Next.js 15.5.23
   - Local:        http://localhost:3000
   - Network:      http://192.168.1.20:3000

 ✓ Ready in 412ms

Keep this window open while CrowdCAD is in use. If macOS asks whether node should accept incoming network connections, click Allow.a Windows Security window says the firewall blocked Node.js, check Private networks and click Allow.

The Network line printed by npm start is the link to share. If it is missing, find the address yourself:

Other devices reach this computer through its IP address on your network, which looks like 192.168.1.20.

%ipconfig getifaddr en0
192.168.1.20

PS>ipconfig
Wireless LAN adapter Wi-Fi:
   IPv4 Address. . . . . . . . . . . : 192.168.1.20

Teammates on the same network open that address with :3000 on the end:

http://192.168.1.20:3000

After a restart, or whenever you closed the terminal, open a terminal and run:

%cd ~/crowdcad
%npm start

PS>cd ~/crowdcad
PS>npm start

You only need npm run build again after changing .env.local or updating CrowdCAD.

New CrowdCAD releases are published to the original repository (upstream). Open a terminal, go to your CrowdCAD folder and pull them in:

%cd ~/crowdcad
%git pull --no-rebase --no-edit upstream main
From https://github.com/crowdcad/crowdcad
Updating 8747b40..4a03ac8
Fast-forward

PS>cd ~/crowdcad
PS>git pull --no-rebase --no-edit upstream main
From https://github.com/crowdcad/crowdcad
Updating 8747b40..4a03ac8
Fast-forward

This downloads the newest code from upstream and merges it into your copy. Your .env.local settings and your data are left alone. If it prints Already up to date., there is nothing new.

See what changed in each release on the changelog.

Run these one at a time, waiting for the prompt to return after each:

%npm install

PS>npm install

%npx -y firebase-tools deploy --only firestore:rules --project YOUR_PROJECT_ID

PS>npx -y firebase-tools deploy --only firestore:rules --project YOUR_PROJECT_ID

%npm run build

PS>npm run build

%npm start

PS>npm start