Ten tiny stages. One webpage that visibly changes. Every Git concept you need, with nothing you don't.
You'll build the start screen of a fictional game called Box Runner — a title, a tagline, a Start button, and a score panel — using only HTML and CSS. The webpage is the prop. The real thing you're learning is the Git workflow underneath it: every visible change becomes a save point you can return to, branch from, merge into, or publish.
The everyday Git loop — learned through a webpage you can see.
Build a webpage and learn what a commit is.
0Make index.html and see a real webpage in the browser.
git init, add, commit — your first save.
Make visible improvements and stack up save points.
2Create style.css and commit new + edited files together.
Add score and lives, then explore git log.
Try a new idea safely, then bring it back.
4Create a dark-theme branch. See what a branch really is.
Rewrite the CSS in dark mode — safely, on the branch.
Switch back to main and merge the dark theme home.
Put your project online and keep improving it.
7Create a repo and add it as a remote.
Upload every commit so far with git push.
Cement the everyday edit → commit → push loop.
Just enough markup to put a title, a button, and a scoreboard on the page.
Plain stylesheet — no preprocessors, no variables, no build step.
The save system you'll actually learn. Every stage is a commit.
Where your project goes when you're ready to share it with the world.
You'll get the most out of this if you:
You don't need:
cd and ls