You've been editing a project for three days without knowing its shape. Today, a five-minute guided tour of your own files.
Video script (for recording): "You don't need to become a developer to understand your own project. Today's short — just enough to know what's actually sitting on your computer."
Install Claude Code, ship your first live page
Turn a plain-English idea into a working page
Edit what it built — ask for changes without breaking things
Understand what got created: files, folders, why they matter
Connect to GitHub so your work is never lost
Get a site live: your first real deploy
Fix things when they break — read errors without panicking
Add a second page and link it up: your landing page
Automate updates: push once, redeploy every time
Ship the deliverable: portfolio + business landing page, live
You've been editing a real project for three days without looking at its structure. That's fine — but understanding it means you can ask smarter questions later. Ask Claude Code to explain it in plain language rather than guessing.
| File / folder | What it's for |
|---|---|
| index.html | The page itself — the text and structure a browser reads |
| style.css (or a <style> block) | Colors, spacing, fonts — how it looks, separate from what it says |
| /assets or /images | Pictures and files the page displays or links to |
| .git (hidden folder) | Version history — you'll use this properly tomorrow |
Whatever Claude Code names as the main HTML file and the styling — open them in a plain text editor (Notepad works) just to look, not to edit.
Pick anything confusing you saw and ask about just that one thing — small, specific questions build real understanding faster than reading everything at once.