Vibe Coding a Full Website in 2026 (Claude Code + Supabase MCP + Vercel + More!) - Part One

In this first episode of a two-parter of Not Replaced Yet, I go off-the-cuff with a live vibe code session for the NRY website. We start from zero in Claude Code and let the agent cook.

Along the way, I show the exact workflow I’m using in 2026:
• Plan Mode for specs and clarifying questions
• Design inspiration loops (Dribbble + Landing Love)
• Copy-paste UI acceleration with 21st.dev prompts
• Supabase + MCP for database setup and migrations
• Sub-agents running in parallel with fresh context windows
• A simple Claude Code hook that plays an ElevenLabs voice when a task finishes
• Real debugging when things inevitably break (React 19 + hydration issues + styling fixes)

This is low-stakes build mode — don’t do this for serious client work. But for personal projects and fast iteration, it’s insane.

Part 2 is coming next, where we finish the remaining UI polish, fix the last issues, and ship the site.

Chapters
0:00 Intro and what we’re building
0:20 What “vibe coding” actually means (and when it’s OK)
1:24 Why your own website always gets neglected
2:56 Plan Mode setup and the initial prompt
5:10 Finding design inspiration on Dribbble + Landing Love
10:19 Using 21st.dev prompts to speed up UI
14:08 Supabase setup and adding MCP
20:39 Context windows and why quality degrades near the limit
22:36 How the Claude Code creator runs multiple agents in parallel
29:12 Spinning up sub-agents to do research without burning context
32:18 Hooks that run when an agent finishes
34:32 Adding an ElevenLabs audio cue for “task complete”
45:26 Clerk auth setup (admin-only access)
54:48 Build completes and what got generated
55:42 /compact and starting the next phase cleanly
58:45 Applying the Supabase schema/migration via MCP
1:00:29 Running the app locally and wiring env vars
1:04:17 React 19 issue and a full shader rewrite in vanilla Three.js
1:07:44 First look at the site and quick UI checks
1:10:57 Fixing the invisible headline (opacity issue) and remaining hydration error
1:12:16 Wrap-up and Part 2 teaser

Watch the video: https://youtu.be/jOop4g8_ZZM