Full Reference

🌱 Beginner's Guide

Brand new to Git, GitHub, Firebase & AI coding? Start here — plain English, real commands, one step at a time.

🧭 START HERE — Where Your Code Lives

Your code lives in three places. Almost everything you'll do is just moving it between them.

YOUR COMPUTER
Where you actually edit files. Also called “local”. Nobody else can see it yet.
push 
 pull
GITHUB
Cloud backup + full history of every save. Lets other computers (and the cloud) get your code.
deploy 
(one way)
LIVE WEBSITE
Firebase Hosting — the public URL anyone on the internet can open.
In one line each: push / pull move code to and from GitHub  ·  deploy makes it live on the internet via Firebase. Editing on your computer changes nothing online until you push and/or deploy.

🏷️ The Tags You'll See on Each Command

🔧One-time setupDo it once per project or per computer, then never again.
🔁Every timePart of your routine — you'll run it in most work sessions.
⚡Claude Code can do thisYou can just ask the AI to do it for you.
⚠️Be careful / destructiveCan delete work or overwrite things. Read before running.

🤔 Which Workflow Is Mine?

Two of the sections below are “deploy loops.” You only need one of them — pick by what's in your project folder.

📄 Just HTML files, no build step?
Your folder has .html files you can open directly. → Use the Static HTML Flow (Section 3).
⚛️ Has a package.json with a build step (React / Vite)?
You run npm run build to make the site. → Use the React Workflow (Section 4).
Not sure? Look in your project folder. No package.json = Static. Has a package.json with a "build" script = React.
1. GitHub Setup Put a brand-new project folder onto GitHub for the first time

What is this? Git = a time machine for your code (it saves snapshots you can rewind to). GitHub = a website that stores those saves online so they're backed up and shareable. This section links your local folder to a GitHub repo once.

🔧 One-time setup⚡ Claude Code can do this

Do these four steps once to get your folder onto GitHub.

1
Start tracking your folder
Run this inside your project folder. It creates a hidden .git folder that begins recording changes.
git init
→
2
Make an empty repo online
Go to github.com/new and create a new repo. Leave it completely blank — no README, no .gitignore, no license.
→ github.com/new → Create empty repo
→
3
Link your folder to that repo
Copy the HTTPS URL from your new GitHub repo and paste it in. This tells Git “GitHub is my home base” (called the origin).
git remote add origin
→
4
Save & upload everything
Commit (save a snapshot) and push (upload it). Your code is now safely on GitHub.
SAVE A SNAPSHOT
git add . && git commit -m " "
UPLOAD (BRANCH = main)
git branch -M main && git push -u origin main
IF YOUR BRANCH IS master
git push -u origin master
Not sure which? Run git branch — the branch with a * is yours.
✅ What you should see: after the push, refresh your GitHub repo page in the browser — all your files now appear there. That means the backup worked.
🩹 When it breaks — “has no upstream branch”: that means the very first push didn't set up the link. Use the -u flag: git push -u origin main (or master). The -u sets it up once; after that a plain git push works forever.
2. New PC Download an existing GitHub project onto a fresh computer

What is this? Your project already lives on GitHub (from Section 1). Now you're on a different computer and want a copy to work on. Cloning downloads the whole project — files and history — in one command.

🔧 One-time setup (per computer)

Got a new machine? Run these top to bottom.

1
Tell Git who you are
One-time per computer. The --global flag means it applies to every project on this machine. Skip if Git is already set up here.
YOUR NAME
git config --global user.name " "
YOUR EMAIL
git config --global user.email " "
→
2
Download the project
On your GitHub repo, click the green Code button, copy the HTTPS URL, and paste it below.
git clone
Then cd into the new folder before running anything else.
→
3
Install & log in
Restore the project's packages, then log into Firebase and Google Cloud so this machine can build and deploy.
INSTALL PACKAGES
npm install
FIREBASE LOGIN
firebase login
GCLOUD LOGIN
gcloud auth login
✅ What you should see: after git clone, a new folder appears with all your files. After npm install, a node_modules folder shows up (that's normal and can be huge — it's ignored by Git).
🩹 When it breaks — the .env trap (does NOT come with the clone): Your .env file holds secret keys, so it's deliberately kept out of Git. After cloning, the app loads but Firebase / API calls silently fail because the keys are missing — no error tells you why.
MAKE ONE FROM THE TEMPLATE (WINDOWS CMD)
copy .env.example .env
Then paste the real values into .env from your password manager.
CHECK IT EXISTS & ISN'T EMPTY
type .env
⤷ Heads up: if you're running a dev server, it won't pick up .env changes until you restart it (Ctrl+C → rerun).
💡 Got a functions/ subfolder? It has its own package.json, so install there separately: cd functions && npm install && cd .. — Firebase won't deploy functions without it.
3. Static HTML Flow Everyday loop for plain HTML sites — no build step

What is this? The everyday loop for a plain HTML/JS site (like this cheat sheet). There's no “build” step — your files are the website — so you deploy them straight to Firebase. Every session: pull → deploy → push.

🔁 Every time⚡ Claude Code can do this

Working from more than one computer? Never skip a step. Every session starts and ends here.

1
Pull first — get the latest
Always download the newest code before you touch anything. Another computer may have pushed changes you don't have yet.
git pull origin
→
2
Deploy — make it live
Push your files to the internet. For a plain HTML site, hosting-only is all you need.
HOSTING ONLY (the usual)
firebase deploy --only hosting
EVERYTHING (rare)
firebase deploy
→
3
Commit & push — save the backup
Don't walk away without pushing. If you forget, your next computer will be behind and you'll hit merge conflicts.
3A — SAVE A SNAPSHOT
git add . && git commit -m " "
3B — UPLOAD TO GITHUB
git push origin
✅ What you should see: after firebase deploy you'll get a “Deploy complete!” line with your Hosting URL — open it to confirm your change is live. After git push your commit shows up on GitHub.
🩹 When it breaks — merge conflict on pull: if git pull says “conflict,” it means the same lines were edited in two places. Git marks them with <<<<<<< / ======= / >>>>>>> in the file. Edit the file to keep the version you want (delete those marker lines), then git add . and commit. Best prevention: always pull first, push last.
4. React Workflow — The Golden Loop Everyday loop for projects with a build step (React / Vite)

What is this? React / Vite projects have a build step — your source code gets compiled into a dist/ folder, and that is what goes live. So the loop is longer: pull → check → build → deploy → verify → push. Follow it in order every time.

🔁 Every time⚡ Claude Code can do this
⚡ The order matters. ① pull latest → ② check it runs → ③ build → ④ confirm project → ⑤ deploy (rules → functions → hosting) → ⑥ verify live → ⑦ commit & push.
1
Pull latest FIRST
Working from a different machine? Sync before touching anything, or you'll get merge conflicts. Then npm install if packages changed.
git pull origin
2
Run it locally to check
Opens localhost (usually :5173). Click through what changed before you build.
npm run dev
3
Build — does it compile?
Compiles to dist/ (what Hosting serves). If it fails, fix it before deploying — nothing reached live yet.
npm run build
4
Confirm the project
Must print your intended project ID before deploying — so you don't push to the wrong one. Reflex check, every time.
firebase use
5
Deploy in order
Order matters: the UI calls rules + functions, so deploy those FIRST. Skip any line you didn't change — UI-only = just hosting.
firebase deploy --only firestore:rules
firebase deploy --only functions
firebase deploy --only hosting
6
Verify live
Open your live site and confirm it works — sometimes it passes locally but not in production.
firebase open hosting:site
7
Commit & push LAST
So every computer stays in sync. Your next machine pulls this in step 1 — forgetting here is what causes the conflicts step 1 prevents.
SAVE A SNAPSHOT
git add . && git commit -m " "
UPLOAD TO GITHUB
git push origin
✅ What you should see: npm run build ends with a list of files written to dist/ and no red errors. Each firebase deploy ends with “Deploy complete!” and a URL.
🩹 When it breaks: npm run dev won't see .env changes until you restart it (Ctrl+C → rerun). If npm run build fails, read the first red error — that's the real one; fix it and rebuild. Broke the live site? Roll back instantly in Firebase Console → Hosting → release history.
5. Firebase Log in, pick the right project, and deploy

What is this? Firebase is Google's hosting service — it's what actually puts your site on the internet at a public URL. The Firebase CLI (the firebase command) is how you log in, choose which project you're deploying to, and push your site live.

🔧 Login is one-time🔁 Deploy is every time⚠️ Always check the project first

Log In & Pick a Project

🔧 Log in to Firebase
firebase login
Opens your browser to sign in with your Google account. Do this once per computer.
See all your projects
firebase projects:list
Lists every Firebase project on your account, with its project ID.
⚠️ Check which project is active
firebase use
Shows which project your deploys will go to. Always run this before deploying so you don't publish to the wrong site.
Switch to a different project
firebase use
Changes which project your commands target. Paste a project ID from the list above.

Deploy (Go Live)

🔁 Deploy your website (the usual)
firebase deploy --only hosting
Pushes just your site files. This is the one you'll use most for a plain HTML site.
Deploy everything at once
firebase deploy
Deploys all configured services (Hosting, Functions, Rules) together. Slower — only when you changed more than the site.
Open your live site
firebase open hosting:site
Opens your published site in the browser so you can confirm the deploy worked.
Preview locally before deploying
firebase serve --only hosting
Runs your site on your own computer first, so you can check it before it goes public.
✅ What you should see: a successful deploy ends with “Deploy complete!” and a Hosting URL like https://your-site.web.app. Open it to see your changes live.
🩹 When it breaks: if the deploy fails saying you're not logged in, run firebase login again. If it deploys but you see the wrong site, you were on the wrong project — run firebase use to check, switch, and redeploy.
6. Claude Code Let the AI do the work — launch, prompts, and honest limits

What is this? Claude Code is an AI coding assistant that runs in your terminal. You type claude to start it, then talk to it in plain English — it can read your files, make changes, run commands, and even commit, push, and deploy for you.

⚡ This IS Claude Code⚠️ Skip-permissions runs with no prompts
⚠️ --dangerously-skip-permissions = “YOLO mode.” It auto-approves every file write, command, and network call with no prompts. Only run it in a trusted project where git is your undo button — commit before you start so you can roll back.

Launch (from your terminal)

Plain, careful start (recommended for beginners)
claude
Normal mode — Claude asks before each write or command. Safest while you're learning.
⚡ Skip-permissions (works uninterrupted)
claude --dangerously-skip-permissions
All prompts off — Claude works without stopping to ask. Powerful, but only in a trusted repo.
Continue your last chat
claude --continue
Picks up the most recent conversation in this folder. Short form: claude -c.
⚡ Launch with an opening instruction
claude " "
Starts the session already working on your instruction.

Install & Manage

🔧 Install / reinstall (npm)
npm install -g @anthropic-ai/claude-code
The global install. Use this if claude isn't recognized in your terminal at all.
Update to the latest version
claude update
Pulls the newest build. Run it when flags or features look out of date.
Check who you're logged in as
claude auth status
Confirms your account. claude auth login to sign in, claude auth logout to switch.
Something misbehaving? Check the install
claude doctor
Diagnoses common setup problems.
❓ Can one prompt also commit and deploy?
Yes. In your prompt, tell Claude Code to make the change and then commit, push, and run firebase deploy --only hosting. In --dangerously-skip-permissions mode it does all of it without stopping to ask. For example:
Update the homepage headline, then commit, push to GitHub, and run firebase deploy --only hosting
❓ If I turn off my computer, does it finish?
No — the normal claude command runs on YOUR machine. If you turn the computer off, close the terminal, or it goes to sleep, Claude Code stops and does not finish the job.

There's a separate cloud version (claude --cloud, or Claude Code on the web at claude.ai/code) that runs on Anthropic's servers and keeps going with your computer off. But it's a more advanced setup: it clones your project from GitHub (so you must push first) and needs your secret keys stored in its cloud settings, not your local .env.
💡 Tip: when you're new, start with plain claude so it asks before each step — you'll learn what it's doing. Switch to --dangerously-skip-permissions once you trust it and have committed your work as a safety net.
📖 Plain-English Glossary Every term above, in one sentence each
repo — Short for “repository” — the folder that holds your project plus its full save history.
clone — Download a full copy of a repo (files + history) from GitHub onto your computer.
commit — A saved snapshot of your changes with a short message describing what you did.
push — Upload your commits from your computer to GitHub.
pull — Download the latest commits from GitHub onto your computer.
branch — A separate line of work, so you can try changes without touching the main version.
main / master — The default main branch — the “real” version of your project. (Newer repos use main, older ones master.)
remote / origin — The online copy of your repo. “origin” is the nickname for your main remote (usually GitHub).
deploy — Publish your site to the internet so anyone can open it at a public URL.
hosting — The service that serves your live website (here, Firebase Hosting).
dependencies — Outside code packages your project needs to run.
npm install — Downloads all the dependencies listed in package.json into a node_modules folder.
build — Compiling your source code into the final files that actually get served (a dist/ folder for React/Vite).
localhost — Your own computer acting as a web server — a preview only you can see, not the internet.
.env — A hidden file holding secret keys. Kept out of Git on purpose, so it never comes with a clone.
CLI / terminal — The text window where you type commands (Command Prompt / PowerShell on Windows).
💡 Ready for more? Once these six feel comfortable, open the Full Reference → for the complete command set: Git internals, NPM, Docker, Google Cloud, and terminal power tools.