How I built this website with AI. Zero coding.

Set up your tools

Gets the four free or low-cost pieces in place before you start.

Claude Code: the builder. I used the Code tab in the Claude desktop app.

GitHub: saves and backs up your website, and lets you roll back if something breaks.

Vercel: puts your site on the internet. The free plan is plenty to start.

A domain: your web address. I bought mine at Namecheap and kept it separate from my hosting, so I'm never locked in.

I've never set up GitHub before. Walk me through it step by step, and tell me exactly what to click.

Tip: You don't need to understand any of this ahead of time. Claude walks you through each step as you go.

Install the skills that give Claude taste

Out of the box, AI websites tend to look the same. A few free skills teach Claude what good design and good copy look like.

The ones I used: Taste, UI/UX Pro Max, Playwright (so Claude can study websites) and a copywriting skill.

Install the Playwright skill, the taste skill and the UI/UX Pro Max skill. Tell me when each one is installed.

Tip: Start with just these. Too many skills can make Claude less focused.

Find a website to model

Instead of inventing a design, you show Claude a site that already works. Model the layout, not the words.

Use the Playwright skill to study [website link]. Take screenshots, break down the layout section by section, and explain what makes it work. I want to build my own version for my niche. Original, not a copy.

Tip: I modeled my layout on a mentor's site, then changed the colors, words and photos to make it mine.

Plan before you build

Agree on the sections and the one main action you want visitors to take, before any building starts.

I want to build this website for my niche, which is [your niche]. Walk me through the steps to make it happen. Start with the planning phase, and ask me any questions you need.

Tip: Answer Claude's questions in plain, natural language. Voice-to-text works great here.

Give it your story, photos and proof

Hands Claude the raw material that makes the site yours.

Here's my story, my numbers and my photos: [paste or attach]. Write the copy for each section in my voice, and show me before you add it to the site.

Tip: Real numbers and real photos build trust. Only use results you can stand behind.

Let Claude build the first version

Claude builds the whole site on your computer first, so you can look at it before anything goes online.

Build the first full version of my homepage on my computer and show me screenshots on desktop and phone.

React, don't write code

This is where the site becomes yours. Say what you like and what you don't, just like giving feedback to a designer.

I don't like [this part]. Make it [what you want instead]. I want it to feel [elevated, warm, high-end, simple].

Tip: Some of my real messages: "I want black, gold, tan and cream." "Make it more about the people I help." "I don't like that headline." Each fix took minutes.

Test it on every device

Makes sure it looks right on desktop, iPad and phone before anyone else sees it.

Test my website on desktop, iPad and iPhone sizes. Fix anything that's cut off, overlapping or hard to read, then show me screenshots.

Save it to GitHub

Backs up every version, so you can always go back.

Save this version to my GitHub.

Put it online and connect your domain

Takes your site live at your own web address.

Join free: https://www.skool.com/theaicreatoracademy

Walk me through connecting my GitHub project to Vercel, then connecting my Namecheap domain, step by step.

Tip: If something doesn't work, take a screenshot and show Claude. It will tell you exactly what to fix.