Let’s build your website! 🛠️
This shows you every step. You don’t need to know how to code. You just type what it says.
Pick one helper. There are two robot helpers: Claude Code and Codex. They both do the same thing! So just pick one. Claude Code is in the pink box. Codex is in the purple box. Only follow your box.
Get a grown-up. Some steps have a grown-up helps sticker. Those parts are fiddly. Do them with Uncle Jimmy or your dad sitting next to you.
1. What is a website, really?
Three things work together. Here’s what each one does.
📄 The files
A website is just a bunch of files. Each page is one file. This page you are reading right now? It’s a file. That’s all a website is!
📦 GitHub
A place on the internet that holds your files for you.
It also saves every single change anyone has ever made. That means you can’t break anything forever. You can always go back. Isn’t that nice?
✨ GitHub Pages
This one is a bit magic. It takes your files and puts them on the internet so anyone can see them.
When you change a file, it fixes up the website all by itself. It takes about a minute.
So the whole job is: change a file → send it to GitHub → count to sixty. That’s it. Everything below is just those three things again and again.
2. Getting ready 🎒
This part is the longest. But you only do it once, ever. After this, changing something takes about two minutes.
Get a GitHub account
Go to github.com/signup and make an account. You need an email you can check, because they send you a secret code.
Then tell Uncle Jimmy your username. He will let you in.
You’ll get an email with a button that says Accept invitation. Click it!
Until you click that button, you can look at the files but you can’t change them.
Open the Terminal
The Terminal is an app where you type instead of clicking.
It looks a bit scary. It is not scary. It’s just a box that waits for you.
On a Mac: hold down Command and press Space. Type
Terminal. Press Enter.
On Windows: look for Terminal in the Start menu.
A window opens with a little blinking line. That’s it waiting for you.
From now on, when this page says “type this”, it means:
type it in that window, then press Enter.
Get your robot helper
First you need a program called Node. Go to nodejs.org. Download the one it points at. Install it like any other app.
Then go back to the Terminal and type the line in your box:
Claude Code
npm install -g @anthropic-ai/claude-codeIf that line stops working one day, the real instructions live at docs.claude.com.
Codex
npm install -g @openai/codexIf that line stops working one day, the real instructions live at developers.openai.com.
Lots of red words? If you see a big pile of red text
saying permission denied, nothing is broken! Your computer just
said no. Show it to a grown-up. It happens to everybody and it’s quick
to fix.
Say hello to your helper
Start it up for the first time. It opens a web page and asks who you are.
Claude Code
claudeLog in with a Claude account.
Codex
codexLog in with a ChatGPT account.
Each helper needs its own paid account, so ask Uncle Jimmy which one you have.
Copy the website onto your computer
Type these two lines. One at a time!
cd ~/Documents
git clone https://github.com/thirstypig/rhyschang.gitThe first line walks you into your Documents folder.
The second line copies the whole website down onto your computer. It makes
a new folder called rhyschang.
Now step inside it:
cd ~/Documents/rhyschangYou will type that line every time you want to work on your website. It means “go into my website folder.”
Getting ready is done! 🎉 You never have to do this bit again.
3. Change something! 🖍️
Let’s change one line and put it on the real internet.
Go to your folder, then wake up your helper
Claude Code
cd ~/Documents/rhyschang
claudeCodex
cd ~/Documents/rhyschang
codexYou have to be inside the folder first. That’s how your helper knows which files you mean.
Just ask, in normal words
Type this and press Enter. It works the same in both helpers:
On my home page, change the line that says “Hi! This is my website” to say something about me instead.
Your helper goes and finds the file. Then it shows you what it wants to change and asks if that’s okay.
Read it. If it looks right, say yes!
Put it on the internet
Right now your change is only on your computer. Nobody else can see it yet.
To share it with the whole world, ask:
Save this change and publish it to the website.
Your helper does the rest. Now count to sixty. Then go to rhyschang.com.
It’s there. You made that. 🎉
Looks the same? Don’t worry! Your browser keeps old
pictures of pages to be fast. Hold Shift and click reload to get
a fresh one. Still old? Wait one more minute.
4. Three funny words
When you said “publish”, three things happened. You don’t have to remember these! But if you know them, error messages get much less scary.
Commit
Your change got saved, with a little note about what you did. All the old ones are kept too.
Push
Your saved change got sent up to GitHub.
Build
GitHub saw the new files and fixed up the website. This is the part that takes about a minute.
When something goes wrong, it’s nearly always one of those three. And the message will tell you which one!
5. Making a whole new page 📄
Say you want a page about dinosaurs. Just ask:
Add a new page at /dinosaurs. Make it look like my other pages, and put a link to it on my home page.
Then your page lives at rhyschang.com/dinosaurs. Cool, right?
Always ask for the link too. If nothing points at your new page, nobody can ever find it. It would just be floating out there all alone.
6. Things you can say 💬
Copy these. Change the words to whatever you want.
The trick is: say what you want, not how to do it.
Easy ones to start with
Change the big title on my home page to my whole name.
A good first one. Small, and easy to spot.Add a sentence about me under the title on my home page.
Make my website green and yellow instead.
All the colours live in one file calledstyle.css. Change them there and every page changes at once.
Bigger ones
Add a page at /about with a few sentences about me, and link to it from my home page.
Add a photo to my home page. I’ll put the picture in the folder first.
Add a page where I can put my drawings.
You can ask questions too!
Tell me what’s in this folder, like I’ve never seen it before.
Good for when you come back later and forgot everything.Show me what I changed but haven’t published yet.
Ones that don’t work 🚫
These don’t work because they’re too fuzzy. Your helper has to guess — and it usually guesses wrong!
“Make it better.” → Better how? Say what you
don’t like.
“Fix my website.” → Fix what? Say what looks
wrong.
“Add stuff.” → Add what? Where?
7. Uh oh, something broke 🩹
Good news: you can’t really break it. Every old version is saved. The website can always go back to how it was.
The worst that happens is your page looks silly for a few minutes.
My page looks wrong
My home page looks broken. Can you look at what I changed and fix it?
I want to undo that
Undo my last change and put my website back how it was.
Nothing is changing
Wait two minutes. Hold Shift and click reload. Still nothing?
Ask:
Did my last change actually get published? Check and tell me what happened.
I got a message I don’t understand
Copy the whole thing and paste it to your helper. Then ask what it means.
Paste the exact words! Don’t type it out again or make it shorter. The exact words are the useful bit.
One rule. Just one. Read what your helper says it’s going to do before you say yes. It’s usually right. But it’s your website. Saying “no, do it this way instead” is a totally normal thing to say.
If something won’t work, or a step doesn’t make sense, or you just want help thinking up what to build — ask Uncle Jimmy.
That’s what he’s for.
🔑 And when you’re ready…
Right now Uncle Jimmy looks after your website’s name and the place it lives. When you’re ready, he’ll hand it all over to you — and then it’s completely yours. Just say when.