Vibe Code Your First Website This Week

For years I paid a website designer overseas. I felt like I was getting ripped off — the time estimates he gave me kept coming back inflated — but I was too busy to check, so I let it ride. Then one day I finally called him on it. He admitted it. He apologized. I never worked with him again.

That left me stuck. I knew how websites worked. I just didn't have the coding skills to build one myself — at least not at the quality I wanted.

So I started telling Claude what I wanted built and let it write the code. The cool kids call it vibe coding. I already understood the architecture; I just couldn't write the code. And then I fell in love with Claude. Not Claude Code, not yet — just plain Claude, with my GitHub connection turned on.

Decide for yourself. I vibe coded theaie.net and allthingsai.org the same way. The results: better SEO out of the gate than my previous agency-built sites, faster page loads than ever before, and more organic traffic on the same publishing cadence I'd always used. Better outcomes — without the inflated invoice.

For our All Things AI conference, I wanted to get the talks and slides posted in a single place, not just on YouTube and Slideshare. So I asked Claude Cowork to code a directory. The results were exceptional. We had some great talks and if you are interested you can check them out whether you are in deep tech or just getting started.

Why now? Vibe coding stopped being a curiosity in 2025. Andrej Karpathy coined the term in February of that year; by December, Collins Dictionary named it Word of the Year and GitHub reported that 46% of all new code is AI-generated. 92% of US small businesses now use AI in day-to-day operations — up from one in five in 2023 — and 63% of vibe coders are non-developers. The tools finally caught up to the people who needed them most.

The cost gap is the opportunity. The average small business website still runs $10,000–$35,000 with an agency or $2,000–$8,000 with a freelancer. After all that, 70% of small business homepages still lack a clear call-to-action. You can spend $25,000 on a site that looks beautiful and converts terribly. The pipeline below isn't just cheaper — it's continuously editable. When the data tells you the hero isn't working, you fix it that afternoon. No retainer, no scope-of-work, no two-week turnaround for a button color change.

Today's lesson is the pipeline that got me there — an open source course I just published called Vibe Coding-a-Website. Six skills, six steps, one shipping site by the time you finish lunch.

The 90-minute pipeline that replaces an inflated agency invoice

Vibe Coding-a-Website is a free, open source project with the skills and code that I made available on GitHub. The full version uses 11 specialized AI skills — a brand strategist, a copywriter, a security auditor, a QA tester, the works. The lean version uses six. Six kills are enough to take you from "what do I want to say" to "the site is live." Here's the pipeline.

Assumed skill level: comfortable opening a terminal, copying commands, and following instructions. No coding required. If you've ever installed a CLI tool, you can do this.

Three accounts and one CLI:

Time: 90 minutes for a clean run. Add 30 if you want to fuss with copy.

Then clone the repo. Here’s the command but once you have your AI hooked up it will do this for you:

Run this first.

What it does: The customizer interviews you about your business, your audience, your tone, your colors, and your fonts. It produces two files — brand-config.json and brand-voice.md — that every downstream skill reads. That's how the site, the copy, and the images all sound like one company instead of five.

Pro tip: when it asks for your tone, give it three adjectives plus one anti-pattern. "Direct, knowledgeable, occasionally funny — never corporate." That single sentence saves you 40 minutes of rewrites later.

Time: ~20 minutes.

What it does: Digs into the site itself — which pages you need, what each page should accomplish, what forms you want, what keywords matter, where the site should be deployed. Output is a site-brief.json and a human-readable interview-summary.md.

The interviewer is the single most important step. It's also the easiest to rush. Don't. Every minute you spend here saves you ten minutes of rework downstream.

Time: ~30 minutes.

What it does: Reads your brand config and site brief, then writes the actual HTML, CSS, and JavaScript. Mobile-responsive, semantically clean, brand-aligned. Six to ten minutes later you have a working site you can open in a browser.

It won't be perfect on the first pass. That's fine. Read it, mark what you don't like, re-run with feedback. The skill is built to iterate.

Time: ~10 minutes.

What it does: Static HTML doesn't capture leads. The form-wiring skill connects your contact form to Resend for transactional email and your newsletter form to Beehiiv for subscriptions. You bring the API keys; the skill handles the integration.

Both services have free tiers that cover most small-business volume.

Time: ~10 minutes.

What it does: Pushes your site to GitHub, connects the repo to Vercel, and ships a live URL. Automatic HTTPS, global CDN, preview URLs for every change. Your site is on the public internet inside of five minutes.

If you want a custom domain, point it at Vercel's nameservers. The skill walks you through it.

Time: ~10 minutes.

What it does: The site is live. Your business will change. The site-updater is what you run every time you want to add a page, change copy, or replace a hero image. You describe the change in plain English. The skill makes the edit, opens a Vercel preview, and pushes when you approve.

This is the part that breaks the old website model. There's no annual rebuild. The site changes when you change.

Time: as needed.

The full course ships with five more specialist skills — brand-strategist, copywriter, QA-tester, accessibility-checker, the works — but the one worth pulling forward into your first build is security-auditor. Run it between site-generator and deploy-to-vercel.

What it catches: exposed API keys hiding in client-side code, missing security headers (CSP, HSTS, X-Frame-Options), unvalidated form inputs that invite spam or injection, third-party scripts pulling in trackers you didn't authorize, and environment variables that leaked into the production build. The skill produces a security-report.md with each finding ranked critical/high/medium/low and a one-line fix attached.

Most fixes are a single config change. Most beginners skip this step entirely. Don't — this is the skill that turns a hobby project into something you'd actually send a customer.

Time: ~5 minutes to run, 10–20 minutes to apply the fixes.

I'll cover the other five advanced skills in a future edition.

Honest limits, because the alternative is a sales pitch.

Who should not use this approach: If you're building a regulated product (healthcare, financial services, anything with PCI or HIPAA scope), if your site needs custom backend logic beyond simple form handling, or if you have an established brand system that requires pixel-perfect adherence — vibe coding is the wrong starting point. Use it for the marketing layer; bring in engineering for everything that has to survive an audit or scale past a few thousand users a day.

For most business sites — the kind that ten million small companies need but can't justify a $25,000 agency project for — these limits don't matter.

If you ship something this week, reply to this email with the URL. I read every response.

I appreciate your support.