{"slug": "how-i-built-this-website-with-claude-code", "title": "How I Built This Website With Claude Code", "summary": "Anthropic's AI coding agent Claude Code was used to build an entire website, from design and illustrations to CMS and deployment, without the developer writing any code. The developer described the desired aesthetic, shared reference sites, and steered the AI through iterative refinements, resulting in a fully functional site deployed via Vercel and Sanity in two days.", "body_md": "This entire website — the pages you're clicking through, the illustrations, the CMS this post was published from, even the favicon in your browser tab — was built through a conversation with Claude Code, Anthropic's AI coding agent. I didn't write the code. I described what I wanted, reviewed what came back, and steered. Here's how it went.\n\nMy first message was one line: \"keep a clean white look, take inspiration from Apple and how Claude designs.\" No wireframes, no tickets. Claude scaffolded a Next.js and Tailwind project, pulled my details from my resume PDF, and had a working site — hero, experience, resume download, analytics hooks — running in a live browser preview within minutes.\n\nI shared a portfolio site I liked and said \"go creative.\" Claude drew an entire illustration language from scratch — hand-written SVGs of payment cards, tap-to-pay phones, currency coins, and funnels, each with flat color blocks offset behind ink outlines. That language now runs through everything: the hero, the section tiles, the case-study artwork, the S-coin favicon in the browser tab, and even my LinkedIn banner.\n\nThe first draft was one long page, and honestly, it was boring. So we split it: a minimal home, then About, Experience, Blog, and Case Studies as their own pages. Copy got trimmed, gradients came in, my photo got a cleaner background and an animated frame. Big refactors are cheap when your pair programmer holds the whole codebase in its head — and checks every change in a real browser, on desktop and mobile widths, before calling it done.\n\nFor publishing, Claude created a Sanity project on my account through its management API, defined schemas for blog posts and case studies, and embedded the editing studio directly into the site. Content goes live within a minute of hitting Publish — no redeploys, no code changes.\n\nEvery change was committed to GitHub and auto-deployed by Vercel. When I pointed my domain at the project, Claude attached it, told me exactly which DNS records to add, watched the records propagate, and set up the www redirect and SSL. Analytics counts visits, project clicks, and resume downloads; speed monitoring watches how fast the site feels for real visitors.\n\nTotal build: a few conversations spread across two days. Lines of code I wrote myself: zero. If you've been putting off building your personal site, the excuse pool just got a lot shallower.", "url": "https://wpnews.pro/news/how-i-built-this-website-with-claude-code", "canonical_source": "https://dev.to/saadsalman1/how-i-built-this-website-with-claude-code-dd9", "published_at": "2026-08-04 09:14:04+00:00", "updated_at": "2026-08-04 09:41:23.134188+00:00", "lang": "en", "topics": ["artificial-intelligence", "ai-agents", "developer-tools", "generative-ai"], "entities": ["Claude Code", "Anthropic", "Next.js", "Tailwind", "Sanity", "Vercel", "GitHub"], "alternates": {"html": "https://wpnews.pro/news/how-i-built-this-website-with-claude-code", "markdown": "https://wpnews.pro/news/how-i-built-this-website-with-claude-code.md", "text": "https://wpnews.pro/news/how-i-built-this-website-with-claude-code.txt", "jsonld": "https://wpnews.pro/news/how-i-built-this-website-with-claude-code.jsonld"}}