Build a Website
0 of 15 lessons done

Go at your own pace. Follow the website curriculum in order to make and launch your site, and dip into the general AI skills whenever you want. Use the menu on the left to jump anywhere. Each lesson has a short explanation, the steps, and a prompt you can paste straight into Claude.

Building a website

Work through these in order to plan, build, and launch your first website.

Pick your first project

0/1

A five-minute gut check before you build. There's no wrong answer here, and you are not locked in.

Start herePick your first project (and don't overthink it)
What's happening: The thing that stalls most first websites is waiting for the perfect idea. You do not need the perfect idea. You need one you can start today. This is a practice project, the one that teaches you how to build. You are not signing a contract.
Two questions to point you in a direction
  1. Do you want to make money from this? If yes, build around something you already sell, teach, or want to: your work, a product, a service. If no, even better for a first build. Pick something personal or just fun, where there's zero pressure and you can experiment.
  2. What do you most want to learn? Sometimes the best first project is the one that teaches you the AI skill you came here for. Let the skill choose the project.
AI skills you can pick up from building just one website
  1. Running Claude Code and giving it clear, specific instructions.
  2. Writing prompts that get you a strong first draft.
  3. Reading and editing the files Claude creates.
  4. Wiring up a contact or signup form, and understanding where that info goes.
  5. Adding a database when a simple page isn't enough on its own.
  6. Putting your site live on a real web address.
  7. Reading analytics to see what visitors actually do.
  8. Changing direction fast when you learn something new.

Pick a project that stretches whichever of these you most want to practice.

Don't overthink it. Still torn? Pick the one that makes you a little excited to open your laptop. That's your one for now. And you are not limited to one. The $20 Claude plan is enough to build a dozen sites, so start one today, and if you change your mind in two weeks, spin up another. Nothing is wasted, because the skills carry straight over.
Want help deciding? Paste this into Claude
I want to build my first website but I'm not sure what to make. Ask me one question at a time, and let each answer shape your next question so we get more and more specific about what I do, who I want to reach, whether I want to make money from this or just learn, and which AI skills I'm hoping to pick up through this project. If I'm not sure, ask simpler questions to help me figure it out, and let me say "I'm not sure, let's figure that out later" and keep going. Once you have enough, suggest one simple website I could actually finish this week, plus the first three things I'd build.
You're ready to move on when: you've named one project you're a little excited to start, even if it's just for practice. You don't need to love it forever, you just need somewhere to begin.

Set up your tools

0/5

Get your machine ready to build. You do these once and you're set for everything after. No coding experience needed.

Lesson 1Download Claude for desktop
What's happening: The Claude desktop app is your home base. It's where you'll talk to Claude and, in the next lesson, let it build files on your computer.
Do this
  1. Go to claude.ai/download and download the app for your computer (Mac or Windows).
  2. Install it and sign in with your Claude account.
  3. Keep it open. This is where you'll work.
You're ready to move on when: the Claude desktop app is open, you're signed in, and you can send it a message and get a reply.
Watch out for: downloading from a copycat site. Make sure you're at claude.ai, the real app comes from Anthropic.
Lesson 2Open your terminal (the basics)
What's happening: The terminal is just a text way to tell your computer what to do. It looks intimidating, but you only need a couple of commands. Promise.
Our pick (Mac): Ghostty

Your computer already comes with a terminal, and it works perfectly fine. But if you want a friendlier one, we recommend Ghostty. It's faster, the text is bigger and easier to read, and it feels a lot less intimidating than the default. It's also completely free and open source. Download it at ghostty.org. If you'd rather not install anything, the terminal already on your computer is totally fine, so just use that.

Do this
  1. On Mac, open Ghostty (if you installed it) or the built-in Terminal app (Cmd+Space, type "Terminal"). On Windows, open PowerShell.
  2. Type cd Desktop and press enter. You just moved into your Desktop folder.
  3. Type ls (Mac) or dir (Windows) and press enter. That lists what's there. That's most of what you'll need.
Tip for learning the terminal
Here's what worked for me: Put your terminal on the left half of your screen and the Claude desktop app on the right half. For the first week or so, any time something in the terminal confuses you, screenshot it or copy it, paste it into the Claude desktop app, and ask what's happening. You'll pick it up fast.
I'm brand new to the terminal and want to understand a command before I run it. Ask me to paste the command or describe what I saw, then ask any follow-up questions you need, one at a time, to be sure. Explain in plain language what it does and whether it's safe.
You're ready to move on when: you can open your terminal, move into a folder with cd, and list what's inside with ls (or dir) without it feeling scary.
Watch out for: thinking you need to memorize commands. You don't. When something's confusing, paste it into Claude and ask. That habit is the whole skill.
Lesson 3Install Claude Code in your terminal
What's happening: Claude Code is the tool that lets Claude actually create and edit the files for your website, right on your computer, instead of just chatting. This is the engine of the whole build.
Do this
  1. In your terminal, install Claude Code by pasting the install command below and pressing enter.
  2. When it finishes, type claude and press enter to start it.
  3. Sign in when it asks. You're now talking to Claude inside your terminal.
Run this in your terminal
$ npm install -g @anthropic-ai/claude-code
Hit a snag? Paste it into Claude (desktop)
I'm installing Claude Code in my terminal and hit an error. I'm new to this. Ask me to paste the exact error message and whether I'm on a Mac or Windows, then keep asking one question at a time based on what you see until we fix it. Walk me through each step in plain language.
You're ready to move on when: you type claude, press enter, and you're talking to Claude right inside your terminal.
Watch out for: install errors that mention "npm" or "permissions." They're common and fixable, so don't take it personally. Paste the exact error into the Claude desktop app and let it walk you through.
Lesson 4Make your project folder
What's happening: Everything for your site lives in one folder. You'll create it, move into it in the terminal, and start Claude Code there so it knows where to build.
Do this
  1. Make a folder on your Desktop called my-website.
  2. In your terminal, type cd Desktop/my-website and press enter.
  3. Type claude to start Claude Code inside that folder.
You're ready to move on when: Claude Code is running and, when you ask "what folder are you in?", it answers with your my-website folder. That means it'll build in the right place.
Watch out for: starting Claude Code from the wrong folder. If it builds files somewhere unexpected, you probably skipped the cd step. Just cd into my-website and start it again.
Lesson 5Our recommended tech stack (optional)
What's happening: These are the tools we like and use. You do not have to use any of them. They make the build smoother, but you can swap in whatever you already know or prefer.
What we use
  1. Hosting: Netlify. This is what puts your finished site online, for free. Claude Code can deploy straight to it when you're ready. Sign up at netlify.com. You don't need it yet, and you can use another host like Vercel or GitHub Pages if you'd rather.
  2. Voice typing: Wispr Flow. Instead of typing your prompts to Claude, you just talk and it types for you. It's a game changer for longer prompts. Grab it at wisprflow.ai. The dictation already built into your computer works too.
  3. Your domain name: shop around. A domain is your web address, like yoursite.com. I use GoDaddy and Frances uses Namecheap, and there are plenty of other places to look and buy from too. You only need this when you want a custom address, so there's no rush.
You're ready to move on when: you know these tools exist and where to find them. You don't need to set any of them up yet, this is just so nothing's a surprise later.
Watch out for: feeling like you have to sign up for everything right now. You don't. Come back to this list when a later lesson actually calls for one of these.

Set up your website

0/7

Now the fun part. Plan it, build it, and make it yours, one prompt at a time.

Lesson 6Get clear on your site
What's happening: Before you build anything, you're going to give Claude a "brief," a clear description of who the site is for and what you want them to do. Think of it like telling a designer what you need before they start. You won't write it alone: Claude interviews you, one question at a time, and gets more specific as you go. The clearer this is, the closer the first draft lands and the less you'll redo later. You reuse this brief in almost every lesson after this, so it's worth ten real minutes.
Why this matters
A vague ask ("make me a website") gets you a generic, forgettable site. A clear ask ("a one-page site for new moms in my town who want to book a postpartum visit, and the one thing I want them to do is fill out the contact form") gets you something that already feels like yours. You are not writing this for a client, you're writing it so Claude stops guessing.
Do this first
  1. Name your one goal. What is the single most important thing a visitor should do? Book a call, join your list, read your story, buy the thing. Pick one. If you pick three, your site gets muddy.
  2. Say who it's for in plain words. "Busy parents in Rockland County," not "users."
  3. List the sections you think you need (home, about, contact). Don't overthink it, most first sites are one page.
  4. Find 2-3 sites you like and keep the links open in a tab. You'll use them in the next lesson.
Paste this into Claude
Help me write a detailed brief for my website. Ask me one question at a time, starting with who the site is for and the main thing I want visitors to do. Use each answer to decide what to ask next, so we keep narrowing in and getting more specific: who exactly it's for, what they need, what the calls to action are. If I'm not sure about something, ask simpler questions to help me figure it out, and let me say "I'm not sure, let's figure that out later" and keep going. When you have enough, write it up as a detailed brief I can reuse as we build.
Helpful general AI skillsThis whole lesson is an interview, so it's the perfect place to talk instead of type and to brief Claude like a sharp new assistant.
You're ready to move on when: your brief is detailed enough that you'd feel comfortable handing it to a freelance web designer or a web development agency and trusting them to build the right thing. If a pro could run with it, so can Claude. Keep it, you'll paste it into the next few lessons.
Watch out for: trying to make it perfect. This is a starting point, not a contract, you'll tighten it as you build. And if Claude's brief sounds generic, tell it: "make this sound more like a real person, less like marketing."
Lesson 7Choose your look
What's happening: Telling Claude the feeling you want, the colors, the fonts, the mood, up front is what separates a site that looks like yours from a generic template. You don't need any design training here. You just need to react to what you like and say it out loud.
Why this matters
"Make it nice" gets you beige and forgettable. "Warm, calm, a little playful, like a neighborhood kids' bookshop" gets you something with a point of view. Claude can design beautifully, but only once it knows your taste, so this lesson is about handing it that taste.
Do this first
  1. Pick 2-3 words for the feel you want (warm, playful, minimal, bold, calm). These guide everything.
  2. Pull up the 2-3 sites you saved in the brief lesson. Notice what you actually like about each: the colors, the fonts, how roomy or tight it feels.
  3. Decide if you have a color in mind, or let Claude propose a palette for you. Either is fine.
Paste this into Claude
Based on my brief, help me choose a look. Ask me one question at a time about the feeling I want and any sites I already like, and let each answer shape your next question so we get more specific. If I'm not sure, ask simpler questions or show me a few options to react to, and let me say "I'm not sure, let's figure that out later." Then suggest 3 visual directions, each with a vibe in a few words, a color palette, and a font pairing.
You're ready to move on when: you've picked one of the 3 directions Claude offered and you can say in a sentence why it fits. That's the look you'll build with.
Watch out for: trying to blend all three directions into one. Pick the one that feels most like you and commit. You can tweak details later, but swapping the whole vibe halfway through is what creates a mess.
Lesson 8Build your first page
What's happening: This is the moment it becomes real. With Claude Code running inside your project folder, you describe the site and it writes the actual files for you, no coding by hand. Then you open the file in your browser, and there's your website.
Why this matters
A lot of people expect this step to be the hard one. It's the opposite. The hard work was getting clear on your brief and picking a look. This is where that prep pays off, and the first time you see a real page appear is genuinely a little magic.
Do this
  1. Check Claude Code is running in your my-website folder (you'll see the folder name in the terminal).
  2. Paste the prompt below and answer its questions.
  3. Open the result. When it's done, open the index.html file it created, double-click it, or just ask Claude "open my site in the browser." That's your website.
Paste this into Claude Code
Build me a complete single-page website in this folder, as one HTML file with the CSS included, based on my brief. First ask me which visual direction I picked, then any other questions you need, one at a time, using my answers to get more specific. Let me say "I'm not sure, let's figure that out later" on anything I don't know yet. Then make it look modern and finished, with real placeholder content I can edit.
Helpful general AI skillsBuilding is a big step, so it's a great time to ask for a plan before the work. And as Claude writes files, look before you approve.
You're ready to move on when: you have a real web page open in your browser that matches your brief and your chosen look, even if the words and images are still placeholders. A finished-looking draft is exactly the goal here.
Watch out for: panicking if the first version isn't perfect. It's a first draft, not the final site, and the next lessons are all about making it yours. Resist the urge to scrap it and start from zero.
Coming up: once your page exists, you can ask Claude to put on different expert hats to make it sharper, a conversion expert, a copywriter, a designer. You'll do that in the "Iterate on the design" lesson. For now, just get a draft on the screen.
Lesson 9Make it yours: edit the words
What's happening: Placeholder copy is what makes a site feel fake. The fastest fix is your own voice. You tell Claude how you'd actually describe what you do, the way you'd say it to a friend, and it rewrites the site to sound like you instead of like a template.
Why this matters
People connect with a real human voice, not marketing speak. This is also where "talk, don't type" from the Working with AI lessons earns its keep: ramble your answers out loud and let Claude shape them. You'll get further in two minutes of talking than ten minutes of typing.
Do this first
  1. Skim your placeholder copy and notice which lines feel the most fake or generic.
  2. Get loose on how you'd describe what you do in plain words. You don't need to script it, Claude will ask, and you can just talk it out.
Paste this into Claude Code
Rewrite the copy on my site to sound like me. Ask me one question at a time about what I actually do and how I'd say it out loud, and let each answer shape your next question so we get more specific and it really sounds like me. If I get stuck, ask simpler questions to draw it out, and let me say "I'm not sure, let's figure that out later." Then rewrite the site copy, warm and clear, no jargon.
Go further: make a "My Voice" file
If you like how your site now sounds, capture that voice once and reuse it everywhere. A my-voice.md file is a short plain-text file that describes how you write, and just as importantly, how you don't. You hand it to Claude at the start of anything (your site, an email, a post) and it writes in your voice on the first try, instead of you fixing the tone every time.
Ruben Hassid wrote the tutorial we point everyone to, "I am just a text file." It's a great read on why this works, and it includes his own deeper version of the interview. Read it here. Below is a simpler version you can run right now.
Paste this into Claude Code
Interview me to build a "My Voice" file. Ask me one question at a time (talking it out loud is fine) about how I talk, words I love, words I'd never use, what makes writing feel fake to me, and what I want people to feel when they read me. Push gently for real examples, and let each answer shape your next question. When you have enough, save it as my-voice.md in this folder: a short profile of my voice that leans as much on what I avoid as what I do. Then show me how to use it.
Using it later is one line: "Read my-voice.md first, then write my About section." Keep the file in your project folder, and tweak it any time a line of yours nails the tone.
You're ready to move on when: you can read your site out loud and it sounds like something you'd actually say, not a brochure someone wrote about you.
Watch out for: letting it over-polish into buzzwords. If a line sounds too slick, tell Claude "say this more like a normal person" and it'll pull it back.
Lesson 10Add your images
What's happening: Images are what make a site feel finished instead of like a draft. You drop your photos into your project folder, tell Claude what they are, and it places them in the right spots and sizes them so they look good on every screen.
Why this matters
Real photos (your face, your work, your space) build trust far faster than stock images. Even one good, genuine photo changes how the whole site feels. This is one of the highest-impact lessons for the least effort.
Do this first
  1. Gather a few photos and put them in your my-website folder.
  2. Name them simply so they're easy to refer to, like hero.jpg or me.jpg.
  3. Have a rough idea of where each should go. Claude will ask, and can suggest if you're not sure.
No photos ready yet? Don't let that stall you. Ask Claude to add nice placeholder images for now, and swap in your own later.
Paste this into Claude Code
I've added some image files to this folder. Ask me one question at a time about what each image is and where I want it on the site, using my answers to figure out the best spot. If I'm not sure where something goes, suggest options, and let me say "let's figure that out later." Then place them and make sure images are responsive and don't stretch.
You're ready to move on when: your real images show up in the right places and look crisp, not stretched or squished, on both your laptop and your phone.
Watch out for: giant photo files that make your site slow to load. If yours are very large, just ask Claude to "optimize my images so the site loads fast."
Lesson 11Add more sections or pages
What's happening: Most great first sites are a single page with a few clear sections. You only add more (an about, a gallery, a contact area, or a second page) when you actually have a reason to. Claude can add a new section that matches your existing style in one prompt.
Why this matters
More pages is not better. A focused one-pager that does one job well beats a sprawling site every time. Add with intention, not because a section feels like it "should" be there.
Do this first
  1. Look at your site and ask: is anything missing that a visitor needs in order to take the action my brief named?
  2. If yes, decide what section would fill that gap.
  3. If your one page already does the job, you can happily skip this lesson.
Paste this into Claude Code
I want to add a new section to my site. Ask me one question at a time about which section I want and what should go in it, and let each answer shape your next question so we get specific about the content. If I'm not sure, suggest what usually goes in a section like that, and let me say "let's figure that out later." Then build it and match the existing style.
Stuck on a decision? Try the Council skill
When you're weighing a real choice, like "do I even need this section?" or "which of these two layouts is better?", you can run it past a Council. It's a skill (called llm-council) that puts your question to several AI advisors, has them critique each other, and hands you back one clear recommendation. Think of it as a tiny board of advisors, on demand.
It's just one of many free skills and tools people are building for Claude. In your terminal, ask Claude: "Can you help me find and set up the llm-council skill, then run my question through it?" and it'll walk you through it. While you're there, try "what other skills or tools could help with what I'm building?". There's a whole world of them, and Claude can point you to the ones that fit you.
You're ready to move on when: every section on your site earns its place by helping a visitor do the one thing your brief named. If a section doesn't, cut it.
Watch out for: the urge to add "just one more section" forever. Done and live beats endless and unfinished.
Lesson 12Iterate on the design
What's happening: This is the real skill you came for, and it carries over to everything you'll ever build with AI: make small, specific changes one at a time. Ask for one thing, look at the result, then ask for the next. It feels slower, but it's far faster, because you never have to untangle five changes that all landed at once.
Why this matters
The people who get great results out of AI aren't better prompters, they're more patient. One change, look, repeat. That rhythm is the whole game, and once it's a habit, you can change anything on your site without fear of breaking it.
Do this first
  1. Put your site next to your terminal so you can see each change as it happens.
  2. Make a short list of small tweaks you want (spacing, a headline, a color, a button).
  3. Tackle them one at a time, checking the site after each before moving to the next.
Paste this into Claude Code
I want to make one small change at a time. Ask me what the single change is, and a clarifying question or two if you need them, one at a time, so you're sure what I mean. Make just that change and keep everything else exactly the same.
Power move: bring in expert reviewers
Here's a trick that feels like cheating. You can ask Claude to look at your page as a specific kind of expert, one at a time, and tell you what it would change. Each "expert" catches things the others miss. You don't need to know their jobs already, so here's what each one is for:
  1. A CRO reviewer. CRO stands for "conversion rate optimization," which is a fancy way of asking "does this page actually get people to do the one thing I want?" It hunts for confusing buttons, weak headlines, and anything that makes a visitor hesitate.
  2. A copywriter. Sharpens your words so every line is clear, warm, and earns its place. This is the one for cutting fluff and making your message land.
  3. A UX reviewer. UX stands for "user experience." This one checks that the page is obvious to use: easy to scan, clear what to tap, with nothing that makes someone stop and think "wait, where do I go?"
  4. A visual designer. Looks at how it feels: spacing, fonts, color, and whether the important things stand out. It's the difference between a page that looks fine and one that looks genuinely polished.
Run them one at a time so you can act on each round of notes before the next. You can simply tell Claude to "act as" each expert, or in Claude Code you can spin up a separate agent for each review so each one stays focused on its own job.
Paste this into Claude Code
Review my site one expert at a time. First, act as a conversion (CRO) expert and tell me the top 3 things stopping a visitor from taking the action my site is built for. Wait for me to say go before the next reviewer. Then do the same as a copywriter, then a UX reviewer, then a visual designer. For each one, give me 3 specific, concrete changes, not vague advice, and offer to make any I pick.
Helpful general AI skillIf a change sends Claude in circles or it keeps "fixing" the wrong thing, that's exactly what get unstuck when AI goes in circles is for.
You're ready to move on when: you've made a few changes one at a time, the site looks the way you pictured it, and you trust you can change anything else the same way.
Watch out for: asking for five changes in one message. When something breaks, you won't know which change did it. One at a time, every time.

Launch & share

0/4

Get it online, make it official, and put it in front of people.

Lesson 13Make it look great on a phone
What's happening: Most people will open your site on their phone, not a laptop. A site that looks great on a wide screen can be a cramped, overlapping mess on mobile. A quick check and one prompt fixes it.
Why this matters
If your site looks broken on a phone, visitors leave before they read a word. This isn't optional polish, it's how most of your audience will actually see your work.
Do this first
  1. See it at phone size. Open your site and drag the browser window narrow, or open the live file on your actual phone.
  2. Note what breaks: anything that overlaps, runs off the edge, is too small to tap, or looks cramped.
Paste this into Claude Code
Help me make my site look great on a phone. Ask me one question at a time about what looks off on mobile, or offer to just check it over yourself. If I'm not sure what's wrong, ask what feels cramped or hard to tap. Then fix the responsive layout.
You're ready to move on when: you can scroll your whole site at phone width and everything is readable, tappable, and nothing runs off the edge.
Watch out for: tiny tap targets. Buttons and links need to be big enough for a thumb. If anything feels fiddly to tap, tell Claude to make it bigger.
Lesson 14Put it online
What's happening: "Deploying" is just a fancy word for putting your file on the internet so anyone with the link can see it. Netlify makes it almost too easy: you drag your folder onto a web page and seconds later you have a live link you can text to someone.
Why this matters
A site on your laptop helps no one. The moment it's live, it's real, and you can share it. This is the step that turns a project into a thing that actually exists in the world.
Do this
  1. Go to app.netlify.com/drop.
  2. Drag your whole my-website folder onto the page.
  3. Wait a few seconds. Netlify gives you a live link. Your site is online.
Stuck? Paste it into Claude
I'm putting my site online with Netlify by dragging my folder onto app.netlify.com/drop. Ask me one question at a time about what happened or what error I saw, and use each answer to decide what to ask or try next. Let me say "I'm not sure" and help me find the answer. Walk me through it one step at a time.
Helpful general AI skillHit an error you can't get past? Get unstuck when AI goes in circles has three reliable moves for exactly this.
You're ready to move on when: you can open your live Netlify link on your phone, off your home wifi, and your site loads. That means it's truly on the internet, not just on your computer.
Watch out for: the link Netlify gives you is a random name like fluffy-cloud-1234.netlify.app. That's totally fine for now. The next lesson is how to put your own name on it, when you're ready.
Lesson 15Get your own domain
What's happening: A custom domain (yourname.com) is the difference between a project and something that feels official. You buy the name once, then point it at your Netlify site. It's optional, and there's no rush, but it's worth it once you're proud of what you built.
Why this matters
People trust yourname.com far more than a random .netlify.app link, and it's much easier to say out loud, put on a card, or drop in a bio.
Do this
  1. Buy a domain. Netlify can sell you one, or use a registrar you like (Carley uses GoDaddy, Frances uses Namecheap).
  2. In Netlify, go to Domain settings and add your custom domain.
  3. Follow Netlify's instructions to connect it. It can take a little while to go live, and that's normal.
Stuck? Paste it into Claude
I want to connect a custom domain to my Netlify site. Ask me one question at a time, starting with what my domain is and where I bought it, and use each answer to walk me through the right steps for my setup. If I'm not sure about something, help me find it. Explain each step in plain language, and tell me what to do if it's not working after an hour.
You're ready to move on when: you can type your own domain into a browser and your site comes up. (It can take anywhere from a few minutes to a day to start working, so don't worry if it's not instant.)
Watch out for: domains renew yearly, so set a reminder so yours doesn't lapse. And ignore the upsells when you buy, you only need the domain itself.
Lesson 16Share it and keep going
What's happening: You built and shipped a real website. That's the whole milestone, and most people never get here. Now you share it, mark it live in your portal, and pick one thing to do next, because the skill you just learned is the one that compounds.
Why this matters
Sharing is where the momentum comes from. Feedback from your pod, a little well-earned pride, and one clear next step are what keep you building instead of stopping at one.
Do this
  1. Share your live link in your pod so people can see what you made.
  2. Mark it live. In your portal, open "Your build," add your live URL, and set your status to Live.
  3. Pick one next improvement and ask Claude for it.
Paste this into Claude
My site is live. Ask me a question or two about my goal for the site, one at a time, then suggest 3 small, high-impact improvements I could make next, in order of effort, and tell me the prompt I'd use for each.
You're ready to move on when: your live link is shared with your pod, your build is marked Live in your portal, and you've got one specific next improvement in mind.
Watch out for: waiting for it to be perfect before you share. Putting a real, live, slightly-imperfect site in front of people is the whole goal. The polish comes from the next iteration, not from hiding it.
General AI skills

Reference skills you can dip into anytime, in any order. They pay off across everything you build, not just this website.

Working with AI

0/5

These habits work with any AI tool, not just Claude. Get these down and everything else gets easier.

SkillTalk to AI like you're briefing a sharp new assistant
What's happening: AI is brilliant but it can't read your mind. The single biggest jump in your results comes from being specific. Imagine you hired a smart assistant on day one. They're capable, but they don't know you, your taste, or what "good" looks like to you yet. So you tell them.
The three things to always include
  1. Context. Who it's for, what you're trying to do, anything it should know.
  2. An example of what you mean, when you can. "Make it sound like this" beats "make it sound good."
  3. What "done" looks like. Tell it the finish line so it knows when it's there.
Weak ask vs. strong askWeak: "Write me a welcome message."
Strong: "Write a 2-sentence welcome for the top of my site. It's for new moms who feel overwhelmed. Warm and calm, like a friend who's been there. Here's a line I like the tone of: [paste]."
You've got it when: you stop getting generic answers and start getting ones that already sound like you, on the first try.
Watch out for: dumping everything in one giant message. Give the key context, then go back and forth. A conversation beats a monologue.
SkillTalk, don't type: use your voice
What's happening: Most people type short, careful prompts and leave out the context AI needs. When you talk instead, you naturally say more, and AI loves more. You can ramble, change your mind mid-sentence, and still get a great result. This is the unlock for anyone who thinks faster than they type.
How to do it
  1. On your phone: tap the microphone on your keyboard and just talk. It types for you.
  2. On your Mac: press the dictation key (or set one up in System Settings > Keyboard > Dictation), then talk into any text box.
  3. Don't worry about being tidy. Say it the way you'd explain it to a friend. AI cleans it up.
You've got it when: a two-minute ramble out loud gets you further than ten minutes of typing and deleting.
Watch out for: waiting until your thought is perfect before you speak. The point of voice is to think out loud, so start talking before you've figured it all out.
SkillAsk for a plan before the work
What's happening: When something feels big or you're not sure how to ask, don't make AI guess and run. Ask it to lay out a plan first. You read it, fix anything that's off, then say go. This catches wrong turns before they cost you time, and it teaches you what's actually involved.
Paste this when you're not sure how to start
I'm about to ask you to do something, but I want a plan first. Ask me one question at a time about what I'm trying to do, using each answer to get clearer. Then give me a short plan: list the steps, flag anything you're unsure about, and don't start until I say go.
You've got it when: you catch yourself saying "actually, change step 2" before any work happens, instead of redoing it after.
SkillGet unstuck when AI goes in circles
What's happening: Sometimes AI gets confused, repeats itself, or keeps "fixing" something the wrong way. This is normal and it's not you. You have three reliable moves to break the loop.
Your three moves
  1. Paste the error back. If you see a red error message, copy the whole thing and paste it in with "I got this, what do I do?" AI reads errors better than people do.
  2. Narrow the ask. If it's juggling too much, ask for one small piece at a time instead of the whole thing.
  3. Start fresh. If a conversation is hopelessly tangled, open a new chat and re-explain in two clean sentences. A fresh start often beats untangling.
You've got it when: getting stuck stops feeling like failure and starts feeling like a signal to switch moves: paste the error, narrow the ask, or start fresh.
Watch out for: repeating the exact same request louder. If it didn't land twice, change how you're asking, don't just ask again.
SkillLook before you approve (and how to undo)
What's happening: AI will often ask permission before it changes or deletes something. That pause is for you. You don't need to understand every line, but a quick glance at what it's about to do keeps you in control and builds your instinct over time.
Two safety habits
  1. Skim before you say yes. Read the one-line summary of what it's about to do. If it's about to delete a lot, slow down and ask "why?"
  2. Know your undo. Changed something you didn't want? Just say "undo that, go back to how it was." When you reach the launch lessons, you'll also learn how to save versions so you can always roll back.
You've got it when: approving a change feels like a quick check, not a leap of faith.

Getting the most out of Claude

0/5

A few things that are specific to Claude. Small setup, big payoff every time you sit down to build.

FoundationFiles and folders: where your stuff lives
What's happening: Everything you build with Claude lives in a folder on your computer, just like a folder of photos. Claude works inside one folder at a time. Once you're comfortable with "this is my project folder, and my files live in it," a lot of the mystery disappears.
The basics
  1. A folder holds your project. You already made one in the setup lessons (my-website).
  2. A file is one document inside it, like index.html (your web page) or notes.md (a plain text note).
  3. The file extension (the bit after the dot) tells the computer what kind of file it is. .html is a web page, .md is markdown (plain text with simple formatting), .jpg is a photo.
Try it: ask Claude to make a markdown file
In this folder, create a markdown file called notes.md with a heading that says "My project notes." Ask me, one at a time, for a few things I want to remember, with a quick follow-up if I want to add detail. Add them as a list, then show me where the file is.
You've got it when: you can open your project folder, see the files inside, and know which one is which by its name.
FoundationMake a CLAUDE.md so it knows your project
What's happening: A file named CLAUDE.md in your project folder is like a sticky note Claude reads every single time it starts. Put the stuff you'd otherwise re-explain in there once, who you are, what the project is, how you like things, and you stop repeating yourself.
What to put in it
  1. One line on who you are and what you're building.
  2. Your preferences ("keep copy warm, no jargon," "ask before deleting").
  3. Anything you keep having to remind it of.
Have Claude make it for you
Create a CLAUDE.md file in this folder so you remember my project every time. Ask me one question at a time about who I am, what this project is, and how I like things done, using each answer to get more specific. Let me say "I'm not sure, let's add that later" on anything I don't know yet. Then write it up, short and clear.
You've got it when: you open a fresh session, give a short instruction, and Claude already knows the context you'd normally have to repeat.
FoundationHow Claude's memory works
What's happening: Within one conversation, Claude remembers everything you've said. Start a brand-new conversation, and it begins fresh, it doesn't carry your last chat over by default. Knowing this saves a lot of confusion: if Claude "forgot" something, it's usually because you're in a new session.
What carries over, and what doesn't
  1. Same conversation: it remembers the whole thread. No need to repeat yourself.
  2. New conversation: a clean slate, except for anything written into your CLAUDE.md (that's why that file is so handy).
  3. The fix: put anything you want remembered long-term into CLAUDE.md or a notes file, not just in the chat.
You've got it when: a new session starting fresh doesn't surprise you, because the important stuff already lives in a file.
Watch out for: assuming Claude remembers a decision from last week's chat. If it mattered, write it down in your project.
Foundation"Remember this" and where it actually goes
What's happening: You can just tell Claude "remember this" and it will write it down for next time, usually into your CLAUDE.md. This is how you teach Claude your preferences over time without re-explaining them. The more you do it, the more it feels like working with someone who knows you.
Try it
I want to teach you something to remember for next time. Ask me one question at a time about the preference or fact I want you to keep, with a follow-up to make it specific. Then save it where you'll see it in future sessions.
You've got it when: you've taught Claude two or three of your preferences, and you notice it applying them without being asked.
FoundationEnd every session with a clean wrap-up
What's happening: Before you close the terminal, take thirty seconds to make sure nothing you did is left hanging. Work that only lives in a chat window, or in a file you never saved, can quietly disappear. A quick wrap-up question at the end of every session is the habit that keeps your project safe and your future self sane.
Why this matters
This is the question I ask at the end of every working session, and it has saved me more times than I can count: "Are we clear? Is everything saved, updated, and live where it needs to be?" Asking it out loud, every time, turns "I think I'm done" into "I know I'm done."
Paste this at the end of any session
Before I close this, let's do a wrap-up. Walk me through it one item at a time: Is there anything that still needs to be saved or finished? Anything I should put live or deploy? Anything worth writing into CLAUDE.md or a notes file so we don't lose it next time? Then tell me plainly what's done and what's still open.
You've got it when: closing your laptop stops feeling like a gamble, because you always ask "is everything saved and live?" before you walk away.
Watch out for: assuming a change is live just because you made it. Making it, saving it, and putting it live are three different steps, and the wrap-up question catches the ones you missed.

Learn anything with Claude

0/4

Claude isn't just for building. It's the most patient tutor you'll ever have. These skills let you teach yourself almost anything, at your own pace.

SkillShow Claude your screen with a screenshot
What's happening: Claude can see images. So instead of trying to describe a confusing screen in words, you take a screenshot of it, an error message, a menu you're lost in, a design you like, and drop it straight into the Claude desktop app. Then you just ask about it.
Why this matters
Describing what's on your screen in words is slow and easy to get wrong. Showing it is instant and exact. This one habit turns "I have no idea what I'm looking at" into a two-second question.
Do this
  1. On a Mac: press Cmd + Shift + 4, then drag a box around what you want. It saves to your Desktop. (Cmd + Shift + 3 grabs the whole screen.)
  2. On Windows: press Windows + Shift + S to grab part of the screen.
  3. Drag that image into the Claude desktop app, or paste it, and type your question.
Paste this into Claude (with your screenshot)
Here's a screenshot of what I'm seeing. Ask me what I'm trying to do if it's not obvious, then tell me in plain language what this is and exactly what to click or type next.
You've got it when: you can grab a screenshot and drop it into Claude, and it tells you what you're looking at and what to do next.
Watch out for: sharing sensitive info by accident. Crop or blur out passwords and personal details before you send a screenshot.
SkillAsk Claude to walk you through anything, step by step
What's happening: Claude is a tutor that never sighs and never rushes you. For anything you don't know how to do, you can ask it to walk you through it one step at a time, waiting for you to finish each step before it gives you the next.
Why this matters
Most tutorials move too fast and quietly assume you already know things. Claude goes at your pace, and you can ask "wait, what does that mean?" as many times as you need without ever feeling dumb.
Do this
  1. Pick one thing you've been meaning to figure out. It doesn't have to be about websites, it can be anything.
  2. Open Claude and use the prompt below.
  3. Do each step as it gives it to you, and tell Claude when you're ready for the next.
Paste this into Claude
I want to learn how to do something. Ask me what it is, then walk me through it one step at a time, in plain language. Assume I'm a total beginner, give me just one step, and wait for me to tell you I've done it before giving me the next. Check I'm with you before moving on.
You've got it when: you've had Claude walk you through something one step at a time and you finished it without getting lost or overwhelmed.
Watch out for: Claude dumping all the steps at once. If it does, just say "one step at a time, and wait for me" and it'll slow down.
SkillPull the lesson out of a YouTube video
What's happening: There's a great how-to video, but you don't want to sit through 40 minutes for the two minutes you need. Every YouTube video has a transcript (the full text of what's said). You can grab it and have Claude summarize it, pull out the steps, or answer your one specific question, in seconds.
Why this matters
This turns any long video into exactly the part you need, in text you can skim and act on. It's one of the fastest ways to learn something without losing an afternoon.
Do this
  1. Open the transcript. Under the video, click the "..." (more) or expand the description, then click Show transcript.
  2. Select all the transcript text and copy it.
  3. Paste it into Claude along with your question.
Paste this into Claude (with the transcript)
Here's the transcript of a YouTube video. Pull out the key steps as a simple numbered list I can actually follow, and tell me anything I should watch out for. If I ask a specific question about it, just answer that.
You've got it when: you've turned a long video into a short, skimmable set of steps without watching the whole thing.
Watch out for: very long transcripts. If it's huge, tell Claude what you're after ("just the part about setting up the account") so it stays focused.
SkillGet anything explained in plain language
What's happening: Any time you hit a word, a concept, or an error you don't understand, Claude can explain it like you're brand new, with a simple example, and zero judgment. This is how you stop feeling behind.
Why this matters
The fastest learners aren't smarter, they just ask "what does that mean?" more often. Claude makes asking that free and instant, so there's no reason to nod along when you're lost.
Paste this into Claude
Explain something to me like I'm brand new. Ask me what I want explained, then put it in plain language with a simple everyday example. Then ask me one question to check I actually got it, and explain it a different way if I didn't.
You've got it when: you can take anything that confused you and get an explanation that actually lands, in your own terms.
Watch out for: nodding along when you still don't get it. Just say "explain it a different way" until it clicks.

You did the whole thing.

Every lesson, done. You've got the skills to keep building, so go make the next one.