You have probably made a folder that looks like this:
essay.docx essay_final.docx essay_final_FINAL.docx essay_final_FINAL_v2.docx essay_final_FINAL_v2_actually_final.docx
This is manual version control. It works (barely) for a single document. For code, it breaks immediately:
Git is a version control system. It tracks changes to files over time. Every time you take a "snapshot" — called a commit — Git records exactly what your project looked like at that moment, plus a short message from you describing what you did.
Think of it as a timeline of your project:
[start] ──── [added HTML structure] ──── [added CSS] ──── [added animation] ──── [now]
You can jump back to any point on that timeline. You can see exactly what changed between any two points. You can compare what AI gave you to what you kept.
| Git is... | Git is NOT... |
|---|---|
| A timeline of snapshots you choose | Dropbox / Google Drive (automatic sync) |
| Local — runs on your computer | GitHub — GitHub is a separate thing (more on that later) |
| Intentional — you decide when to save | A backup that runs in the background |
| A record of decisions | A code review tool |
Every commit follows the same three-step cycle, whether you do it in the terminal or in VS Code:
You don't have to push after every commit — commits accumulate locally and you push when you're ready. But pushing often is a good habit.
Your computer ──── (push) ────► GitHub
▲
│ commit (local)
│
Your editor
VS Code has a built-in Git panel. You'll do most of your Git work here — no terminal commands needed.
How to find it:
Click the Source Control icon in the left sidebar (it looks like a branching diagram), or press Ctrl+Shift+G.
The three steps in VS Code:
+ button next to a file to stage it, or click Stage All Changes to stage everything.Cmd+Enter).The first time you open the Source Control panel in a new folder, you'll see two buttons. They do very different things.
git init. Local only. Starts tracking the folder on your computer. No account, no internet required.
Here's what the three steps actually look like on screen. Your changed files show up under Staged Changes once you click the + / − next to them, then you write a message and click Commit, then Sync Changes to push.
To see or restore an earlier snapshot, open the Graph (or Timeline/History) panel in Source Control, right-click the commit you want, and choose Checkout. Your files instantly change to match that point in time.
You don't need to memorize commands right now. You do need to know these words — because Copilot, GitHub, and every tutorial you find will use them.
| Term | What it means |
|---|---|
| repository (repo) | A folder that Git is tracking. Your project folder, once you've initialized Git in it. |
| commit | A saved snapshot. One point on the timeline. Includes all your files at that moment, plus a message you write. |
| staging / stage | Choosing which changes to include in the next commit. Like deciding what goes in the photo before you take it. |
| remote | A copy of your repo stored somewhere else — usually GitHub. Your local repo and the remote stay in sync when you push/pull. |
| push / pull | Push = send your commits to GitHub. Pull = get changes from GitHub onto your computer. |
| branch | A parallel version of your project. You won't use branches much in this course, but you'll see the word constantly. |
| merge | Combining two branches. Also something you'll see but won't need much. |
Every commit contains four things:
Git log shows you the history — a list of every commit, most recent first:
commit a3f7c29 (HEAD)
Author: Your Name <you@reed.edu>
Date: Wed Oct 15 14:22:11 2025
add animation loop to cube scene
commit 8b1d4a1
Author: Your Name <you@reed.edu>
Date: Wed Oct 15 13:55:04 2025
set up three.js scene with basic cube
Each commit is a checkpoint you can return to. If something breaks, you can always go back to any of these points.
A commit message is short — usually one sentence. It should describe what decision you made, not just what file you changed.
| Weak ✗ | Better ✓ |
|---|---|
update file |
add rotation to cube in animation loop |
changes |
replace Copilot's color picker with a slider — felt more tactile |
fixed |
fix camera position — scene was rendering behind the cube |
stuff |
initial three.js scene — cube renders, no animation yet |
copilot code |
accept Copilot's orbit controls — works as expected |
You'll mostly use Copilot or VS Code's Source Control panel rather than typing these. But you need to know what each command does — so that when Copilot uses one, you know what happened.
| Command | What it does |
|---|---|
| git init | Start tracking the current folder. Creates a hidden .git/ folder inside it. Do this once per project. |
| git status | Show what has changed since the last commit. What's new, what's modified, what's staged. Run this constantly. |
| git add . | Stage everything that has changed. The . means "all files." You can also stage specific files: git add index.html |
| git commit -m "message" | Save the staged changes as a commit. The -m flag lets you write the message inline. |
| git push | Send your local commits to GitHub (or another remote). The first time you push a new project, it may ask you to set up the remote first. |
| git log | Show the history of all commits — most recent first. Each entry shows the message, author, date, and hash. |
| git diff | Show exactly what changed since the last commit — line by line. Green = added, red = removed. |
These two words get confused constantly. They are different things.
| Git | GitHub |
|---|---|
| Software that runs on your computer | A website (github.com) that stores git repos online |
| Tracks your changes locally | Stores a backup copy you can push to |
| Works offline | Requires internet |
| Open source, owned by no one | Owned by Microsoft |
| Does nothing visible | Shows your commit history publicly (or privately) |
GitHub is also a portfolio. Your public repos — and your commit history — are visible to anyone. For creative web work, GitHub is where your process lives. Future collaborators, employers, and professors can see not just the finished work, but how it was built.
In most programming courses, Git is introduced as a technical safety tool — "so you don't lose your work." That's true, but it misses the more interesting use.
In this course, your commit history is your decisions log in code form.
Every time you accept something from AI and it works — commit it. Every time you change something AI gave you — commit it, and say why. The result is a timeline that shows not just what you built, but how you thought.
"accept Copilot's basic three.js scene"
"change cube to sphere — cube felt too expected"
"slow down rotation speed — was too fast to read"
"replace Copilot's flat color with gradient material — more interesting"
"add mouse interaction — rotation follows cursor"
...is a record of creative judgment. It shows what you changed and why — something no finished file can show.
This also solves the attribution question: if a professor or collaborator asks "did you write this or did AI?" — your commit history shows the actual answer.
Because every commit is a complete snapshot, you can return to any point in your history at any time. This is one of the most useful things Git does — and one of the main reasons to commit often.
How to do it in VS Code:
git log --oneline — see all commits and their short hashesgit checkout a3f7c29 — go back to that snapshot (read-only; your other commits are still there)git checkout main — return to the presentcheckout, revert, reset) with different tradeoffs. As a beginner, ask Copilot which to use for your specific situation before running anything.
You do not commit every single save. You commit at meaningful moments — when something works, when you make a decision, when you accept or change something from AI. This is the same habit professionals use.
For Phase 2 and Phase 3 projects, your commit history is a graded artifact. A submission with one commit ("final version") shows no process. A submission with 8–12 commits showing incremental decisions shows engaged, thoughtful work.
Git works on any plain text file — not just HTML, CSS, and JavaScript. If you're writing a thesis, a long essay, or any document where you make significant revisions over time, Git can track that too.
"first full draft of chapter 2"
"restructure argument — moved section 3 before section 2"
"advisor feedback incorporated — introduction rewritten"
"cut 800 words from lit review per advisor note"
"final proofread pass"
Each commit is a named checkpoint. You can go back to any earlier draft at any time. You can see exactly what changed between drafts. If you decide the restructure was wrong, you can recover the original.
The one constraint: Git works best with plain text files — .md, .txt, .html. It can track Word documents (.docx), but it can't show you a readable diff of what changed inside them. For a thesis, writing in Markdown or plain text and converting to a final format at the end is a workflow many writers use for exactly this reason.
Every step below uses the same commands you would use with code. The example is a short artist statement being written and revised. Follow along — the file is called statement.txt.
1 — Start tracking the folder
$ git init Initialized empty Git repository in /artist-statement/.git/
2 — Write a first paragraph. Stage it. Commit it.
statement.txt
My work explores the relationship between memory and place. I collect fragments — receipts, photographs, recorded voicemail — and reassemble them into structures that resist easy narrative.
$ git add statement.txt $ git commit -m "first paragraph — memory and place"
git add is required here because statement.txt is a brand new file — git has never seen it before and won't track it automatically. Once a file has been added, you don't need to git add it again for future changes.
3 — Write a second paragraph. Commit again.
statement.txt
My work explores the relationship between memory and place. I collect fragments — receipts, photographs, recorded voicemail — and reassemble them into structures that resist easy narrative. The browser is my primary medium. I am drawn to the web because it is simultaneously public and intimate, permanent and ephemeral.
$ git commit -am "add second paragraph — browser as medium"
The -a flag stages all changes to already-tracked files automatically. No separate git add needed.
4 — Try a different direction. Rewrite paragraph 1. Commit that too.
statement.txt
My work is interested in systems that forget. GPS coordinates that drift. Timestamps that contradict. I build things that fail in precise ways. The browser is my primary medium. I am drawn to the web because it is simultaneously public and intimate, permanent and ephemeral.
$ git commit -am "rewrite paragraph 1 — shift to systems that forget"
git add statement.txt — stage one specific file. Required the first time a new file is added.git add . — stage everything that has changed. Useful when you have multiple files and want to commit all of them.git commit -am "message" — skip the staging step entirely for already-tracked files. Fastest option for a single ongoing file.
5 — Look at your history
$ git log --oneline a3f7c29 rewrite paragraph 1 — shift to systems that forget 8b1d4a1 add second paragraph — browser as medium f2c3d11 first paragraph — memory and place
Three snapshots. Each one a decision.
6 — See exactly what changed in the last commit
$ git diff HEAD~1 - My work explores the relationship between memory and place. - I collect fragments — receipts, photographs, recorded voicemail — - and reassemble them into structures that resist easy narrative. + My work is interested in systems that forget. GPS coordinates + that drift. Timestamps that contradict. I build things that + fail in precise ways.
Lines beginning with - were removed. Lines beginning with + were added. HEAD~1 means "the commit just before the current one."
7 — The rewrite isn't working. Go back to the previous version.
You want to return to the state after Step 3 — both paragraphs, original first paragraph. Copy the hash from git log:
$ git checkout 8b1d4a1
statement.txt now reads:
My work explores the relationship between memory and place. I collect fragments — receipts, photographs, recorded voicemail — and reassemble them into structures that resist easy narrative. The browser is my primary medium. I am drawn to the web because it is simultaneously public and intimate, permanent and ephemeral.
The rewrite commit still exists in the history — nothing was deleted.
8 — Come back to the present
$ git checkout main
You are back at the most recent commit. All three commits are intact. You can go back and forward as many times as you like.
9 — Push to GitHub
All of the above happened locally — only on your computer. To send your commits to GitHub, you push. The first time, you need to tell git where to send them:
$ git remote add origin https://github.com/yourname/artist-statement.git $ git push -u origin main
After that first setup, every subsequent push is just:
$ git push
In VS Code, the first push appears as a Publish Branch button in the Source Control panel — it handles the setup automatically.
initial commit — starting file
git log --oneline in the terminal. Read your own commits back. Do they tell the story of what you did?