git add stages changes — it chooses what goes into the next snapshot. git commit saves those staged changes as a permanent snapshot with a message.The three places your files live
This is the one idea that makes Git click. A changed file moves through three areas:
- Working directory — your actual files as you edit them.
- Staging area — a "loading dock" where you gather the changes you want in the next snapshot.
- Repository — once you commit, the snapshot is saved into history.
Why the middle step? Because it lets you commit related changes together with a clear message, even if you edited ten files. You choose what goes in.
Plain-English version: git add = "include this in my next save." git commit = "save it, with a note about what I did."
Stage changes with add
After editing files, git add moves them to the staging area. Use a filename for
one file, or . (a dot) to stage everything you've changed.
Stage your changes
Terminal
$ git add index.html
$ git add . # stage everything changed
In VS Code
- Open the Source Control panel
- Hover a changed file and click the + (Stage Changes)
- Or click the + next to 'Changes' to stage all of them
Save a snapshot with commit
A commit bundles everything in the staging area into one snapshot, with a message. Keep the message short and in the present tense — describe what the change does.
Commit the staged changes
Terminal
$ git commit -m "Add contact form to homepage"
In VS Code
- In the Source Control panel, type your message in the box at the top
- Click the ✓ Commit button (or press
Ctrl+Enter)
The -m flag is the message. Without it, Git opens a text editor and asks for one.
A shortcut: add + commit together
Once you're comfortable, git commit -am stages and commits all already-tracked
files in one step (it won't pick up brand-new files — those still need git add).
Stage tracked changes and commit at once
Terminal
$ git commit -am "Fix typo in footer"
In VS Code
- In VS Code you don't need this shortcut — staging and committing are already one or two clicks
Seeing what changed
git status lists which files are changed or staged. git diff shows
the exact lines that changed, so you can review before committing.
Review before you commit
Terminal
$ git status
$ git diff
In VS Code
- Click any changed file in the Source Control panel
- VS Code opens a side-by-side view: old version on the left, your changes on the right
What makes a good commit message?
- Be specific: "Fix crash when email field is empty" beats "fix bug".
- One idea per commit: small, focused commits are easy to understand and undo.
- Present tense, imperative: "Add", "Fix", "Remove" — as if completing the sentence "This commit will…".
For a bigger change, write a short subject line, then a blank line, then a paragraph of detail.
Run git commit with no -m and Git opens your editor for the full message.
Fixing or browsing what you committed
Typo in the message, or forgot to include a file? Repair the most recent commit with
git commit --amend — as long as you haven't pushed it yet.
Amend the last commit
Terminal
$ git commit --amend -m "Clearer message"
$ # or stage a forgotten file first, then keep the message:
$ git add forgotten.css
$ git commit --amend --no-edit
In VS Code
- Source Control → '…' menu → Commit → Commit Staged (Amend)
Only amend commits you haven't pushed yet — it rewrites history. The Undo chapter has the full toolkit.
To browse what you've saved, Viewing History covers
git log, git show and git diff; to undo a commit, see
Undo Commits.
Up next: before the history piles up — which files should never be committed, and how to make Git look away.