Ch 9 — Vibe Coding Workflows

From Karpathy’s tweet to a disciplined practice — when to vibe and when not to
High Level
music_note
Define
arrow_forward
architecture
Scaffold
arrow_forward
bolt
Build
arrow_forward
bug_report
Debug
arrow_forward
verified
Review
arrow_forward
rocket_launch
Ship
-
Click play or press Space to begin...
Step- / 8
music_note
What Is Vibe Coding?
The origin, the hype, and the reality behind the buzzword
The Origin
In February 2025, Andrej Karpathy described a new way of coding: “You fully give in to the vibes, embrace exponentials, and forget that the code even exists.” He described accepting AI-generated code without fully reviewing it, relying on observable results instead. The term “vibe coding” went viral and became Collins Dictionary’s Word of the Year for 2025.
The Core Idea
Vibe coding is building software by describing what you want in natural language and letting AI generate the implementation. You iterate through conversation: describe a feature, see the result, give feedback, repeat. The developer acts as architect and reviewer, not as the person typing code line by line.
What It Is — and What It Isn’t
Vibe coding IS: Describing intent in natural language Letting AI generate entire features Iterating through conversation Testing by running and observing Committing what works Vibe coding is NOT: No-code / low-code platforms Accepting code without any review A replacement for engineering judgment Appropriate for all situations A license to skip testing
Key distinction: Karpathy’s original description was about personal weekend projects. The industry has since evolved vibe coding into a more disciplined practice with structured workflows, review gates, and clear boundaries for when it’s appropriate.
architecture
The Structured Vibe Coding Workflow
Define → Scaffold → Build → Debug → Review → Ship
Phase 1: Define
Write a natural-language specification before touching any code. What are you building? Who is it for? What are the key features? What are the constraints? Create a context document that captures rules, styling preferences, state management conventions, and API standards. This is your “vibe document.”
Phase 2: Scaffold
Use the AI to generate the project structure: folder layout, configuration files, database schema, route definitions. Review the architecture before any feature code is written. This is where you make technology decisions (Next.js, Supabase, Tailwind) and establish patterns the AI will follow.
Phase 3: Build
Generate features one at a time through conversational iteration. Describe the feature, let the AI implement it across frontend, backend, and database in one coherent cycle. Test each feature before moving to the next. The AI works with the full project context.
Phase 4: Debug
Run the application and report what’s broken back to the AI. Paste error messages, describe unexpected behavior, share screenshots. The AI fixes issues through the same conversational loop. This is where most time is spent — expect multiple debug cycles per feature.
Phase 5: Review
Before shipping, review the generated code for security issues, performance problems, and architectural coherence. This is the gate that separates responsible vibe coding from reckless vibe coding. Skip this step at your peril.
Phase 6: Ship
Commit working features to version control. Deploy. Iterate on feedback. The cycle continues: each new feature goes through the same Define → Ship pipeline.
The discipline: Structured vibe coding isn’t “just vibing.” It’s a formalized workflow with specification, architecture review, feature-by-feature building, debugging, code review, and version control. The “vibe” is in the conversational interaction, not in the lack of rigor.
check_circle
When Vibe Coding Excels
The sweet spots where conversational development shines
Prototyping & MVPs
Vibe coding’s greatest strength: turning an idea into a working prototype in hours instead of days. When you need to validate a concept, test a market, or demo to stakeholders, speed matters more than code quality. Prototypes ship 67% faster with vibe coding workflows.
Internal Tools & Scripts
One-off scripts, admin dashboards, data migration tools, internal utilities. These have low blast radius if they fail, limited users, and short lifespans. Perfect for vibe coding because the cost of technical debt is low.
Creative Exploration
Trying out a new API, experimenting with a UI concept, building a proof-of-concept for a design review. When you’re exploring possibilities rather than building for production, vibe coding lets you iterate on ideas at the speed of thought.
Learning & Onboarding
Building small projects to learn a new framework or language. The AI explains what it generates, answers questions about patterns, and helps you understand unfamiliar APIs. Vibe coding becomes a conversational tutorial.
The Speed Advantage
// Vibe coding speed benchmarks: Landing page 30 min vs 4 hours CRUD API 1 hour vs 6 hours Dashboard MVP 4 hours vs 2 days Full prototype 1-2 days vs 1-2 weeks Hackathon project 1 day vs 3 days // These assume experienced vibe coders // with good context engineering skills. // Beginners see smaller gains initially.
The pattern: Vibe coding excels when speed matters more than durability, when the audience is small, and when the cost of failure is low. The common thread: disposable or short-lived code.
warning
When Vibe Coding Fails
The danger zones where “just vibing” creates real damage
The Numbers Are Stark
40–62% of AI-generated code contains security vulnerabilities
• Only 10.5% of working AI code was found to be secure (Carnegie Mellon)
• Vibe-coded projects accumulate technical debt 3x faster
• Developers spend 63% more time debugging AI code than writing it themselves
• AI-generated code is now the cause of 1 in 5 security breaches
Hallucinated Debt
Code that appears correct but contains hidden flaws: missing edge cases, insecure defaults, exposed secrets, fragile authentication. It passes basic testing because the happy path works. The problems emerge in production, under load, or when an attacker probes the system. This is the unique risk of vibe coding — debt you don’t know you have.
Don’t Vibe Code These
HIGH RISK — Use disciplined development: × Payment processing & financial logic × Authentication & authorization systems × Regulated workflows (healthcare, finance) × Systems with high blast radius if they fail × Long-lived codebases maintained by teams × Customer-facing production applications × Code handling PII or sensitive data LOWER RISK — Vibe coding appropriate: Prototypes and MVPs Internal tools and scripts Creative exploration and learning Hackathon projects Personal automation
The vibe coding hangover: Companies that shipped vibe-coded MVPs to production without refactoring are now facing audit failures, security breaches, and maintenance nightmares. An estimated 25–40% of new startup code is AI-generated. The technical debt bill is coming due.
swap_horiz
The Hybrid Approach: Vibe to Production
How to use vibe coding responsibly in a professional workflow
The Two-Phase Model
The most effective teams use a hybrid approach:

Phase 1 — Vibe: Use conversational AI to rapidly prototype, explore approaches, and generate a working draft. Speed is the priority. Technical debt is acceptable.

Phase 2 — Harden: Switch to disciplined AI-assisted development. Add tests, review security, refactor architecture, integrate CI/CD. Quality is the priority. This is where the prototype becomes production code.
The Transition Checklist
Before a vibe-coded project goes to production:
• Add comprehensive test coverage
• Security audit all authentication and authorization
• Review all database queries for injection risks
• Check for exposed secrets and hardcoded credentials
• Refactor “accidental architecture” into intentional design
• Add error handling and logging
• Set up CI/CD pipeline
Governance: Mapping Task to Approach
// Decision framework: Is it throwaway or long-lived? Throwaway → vibe freely Long-lived → harden before shipping Who sees it? Just me / team → vibe is fine Customers → harden first What’s the blast radius? Low (internal tool) → vibe is fine High (payments, auth) → disciplined only Is there sensitive data? No → vibe is fine Yes (PII, financial) → disciplined only Will others maintain it? No → vibe is fine Yes → harden + document
The professional stance: Vibe coding is a tool, not an identity. Professional developers know when to vibe and when to be disciplined. The skill is in the judgment call, not in picking one approach for everything.
tips_and_updates
Vibe Coding Techniques That Work
Practical patterns from experienced vibe coders
Start with the UI
Describe the interface first: “Create a dashboard with a sidebar, a data table showing users, and a chart showing signups over time.” Seeing the UI immediately tells you if the AI understood your intent. It’s much easier to spot a wrong UI than wrong backend logic.
One Feature at a Time
Never describe the entire application in one prompt. Build feature by feature: authentication, then user management, then the dashboard, then notifications. Test each feature before starting the next. This prevents the cascading failures that happen when multiple broken features interact.
Screenshot Debugging
When something looks wrong, describe what you see vs. what you expected. “The sidebar overlaps the main content on mobile. Expected: sidebar should collapse to a hamburger menu below 768px.” Visual descriptions are often more effective than code-level debugging for UI issues.
The Context Document
// Create a .vibe or context file: Project: SaaS dashboard for analytics Stack: Next.js 15, Supabase, Tailwind, shadcn/ui Auth: Supabase Auth with Google OAuth DB: PostgreSQL via Supabase Style: Minimal, dark mode default, Inter font State: React Query for server state, Zustand for UI API: Next.js API routes, REST, Zod validation Rules: - All pages use the AppLayout component - All forms use react-hook-form + Zod - All API responses: { data, error, meta } - No inline styles, use Tailwind only - Mobile-first responsive design
Git After Every Feature
Commit after each working feature. If the next feature breaks something, you can revert to the last good state instantly. Without git discipline, a broken feature can destroy hours of working code with no way back.
Pro tip: Keep a running log of what you asked the AI to build and what decisions were made. This becomes invaluable when debugging later or when handing the project to someone else.
compare
Vibe Coding vs. AI-Assisted Coding
Two approaches on a spectrum — not a binary choice
The Spectrum
// From most autonomous to most controlled: Pure Vibe Accept all AI output. Don’t read the code. “If it works, ship it.” Risk: Maximum. Only for throwaway code. Structured Vibe Conversational development with review gates. Test each feature. Review before shipping. Risk: Moderate. Good for prototypes. AI-Assisted Developer writes specs, AI generates code. Full code review, tests, CI/CD integration. Risk: Low. Good for production. AI-Enhanced Traditional Developer writes code with AI completions. AI assists, human drives every decision. Risk: Minimal. Good for critical systems.
Key Differences
Code understanding: In vibe coding, you may not understand every line. In AI-assisted coding, you understand and can explain all generated code.

Review depth: Vibe coding reviews observable behavior (“does it work?”). AI-assisted reviews code quality (“is it correct, secure, maintainable?”).

Testing: Vibe coding tests manually by running the app. AI-assisted coding writes automated tests as part of the workflow.

Ownership: Vibe-coded projects are hard to hand off. AI-assisted projects follow team standards and are maintainable by others.
The professional reality: Most experienced developers operate in the “Structured Vibe” to “AI-Assisted” range, sliding up and down based on the task. Pure vibe is for weekends. AI-enhanced traditional is for critical systems. Know where you are on the spectrum.
school
The Vibe Coder’s Maturity Model
How your relationship with vibe coding evolves over time
Level 1: The Enthusiast
“AI can build anything!” You accept everything the AI generates. Speed is intoxicating. You ship fast but don’t understand the code. Risk: High. Hallucinated debt accumulates silently.
Level 2: The Burned
“AI code is unreliable.” You hit a production bug caused by AI-generated code. You swing to distrust. You start reviewing everything obsessively. Risk: Low, but you’re losing the speed advantage.
Level 3: The Calibrated
“AI is a tool with known strengths and weaknesses.” You know when to vibe and when to be disciplined. You write good context, review strategically, and test the right things. This is the goal.
Calibrated Vibe Coding Habits
Write context documents before building Build one feature at a time Test after every feature Git commit after every working state Review security-sensitive code carefully Know when to switch to disciplined mode Harden before shipping to production Keep a decision log Never ship code you can’t explain
Key insight: Vibe coding is a legitimate development methodology when practiced with discipline. The problem was never the approach — it was the lack of structure. A structured vibe coder with good context engineering skills can build in hours what used to take days, without sacrificing quality where it matters.