The Vibe Loop: Iterative AI Development

This is the most important page on the site. Master this loop and you can build anything.

2-5 iterations per feature is normal. That’s not failure—that’s the process.

The Core Loop

┌─────────────────────────────────────────┐
│                                         │
│    1. PROMPT                            │
│    ↓                                    │
│    2. GENERATE                          │
│    ↓                                    │
│    3. REVIEW                            │
│    ↓                                    │
│    4. REFINE ──→ (back to PROMPT)       │
│    ↓                                    │
│    5. SHIP                              │
│                                         │
└─────────────────────────────────────────┘

Phase 1: PROMPT

What to include

Element	Example
Context	”In this Next.js app…”
Goal	”Create a user settings page”
Constraints	”Use existing Button component”
Style	”Match the dashboard layout”

Starting prompts by task

Task	Starter Prompt
New feature	”Add a [feature] that [behavior]. Use [tech stack].”
Bug fix	”This [thing] fails when [condition]. Error: [message]“
Refactor	”Refactor [file] to [improvement] while keeping [constraint]“
Test	”Write tests for [function] covering [scenarios]”

Need more prompts? See Prompt Templates

Phase 2: GENERATE

While AI is working

• ✅ Read the output as it streams
• ✅ Start spotting issues early
• ✅ Think about what you’ll refine
• ❌ Don’t interrupt unless it’s way off
• ❌ Don’t switch context

Red flags to watch for

Warning Sign	What it means
Long pauses	Might be stuck or hitting limits
Repetitive output	Context confusion
Wrong language/framework	Misunderstood context
Ignoring constraints	Need to re-emphasize

Phase 3: REVIEW

The 30-Second Scan

1. Structure — Does the shape look right?
2. Imports — Using the right dependencies?
3. Names — Do functions/variables make sense?
4. Types — TypeScript looking good?
5. Logic — Does the flow make sense?

Deeper Review Checklist

□ Meets original requirements
□ Handles edge cases
□ Error handling present
□ No security red flags
□ Consistent with codebase style
□ Reasonable performance
□ Tests included (if needed)

Full review process: AI Code Review Checklist

Trust but verify

AI Output	Your Job
Logic	Trace the happy path
Error handling	Check the sad paths
Types	Verify they’re not any
External calls	Check URLs, endpoints
File operations	Verify paths are safe

Phase 4: REFINE

The Refinement Prompt Template

Good start! A few changes:

Keep:
- [What's working well]

Change:
- [Specific thing] → [What you want instead]

Add:
- [Missing piece]

Remove:
- [What shouldn't be there]

Common refinements

Issue	Refinement Prompt
Too verbose	”Make this more concise, remove comments”
Missing types	”Add proper TypeScript types, no any”
Wrong pattern	”Use [pattern] instead of [current]“
Missing edge case	”Handle the case where [condition]“
Style mismatch	”Match the style of [reference file]“

Refinement anti-patterns

❌ Don’t	✅ Do
”Make it better"	"Extract the validation into a helper"
"This is wrong"	"Line 15 should return early if empty”
Starting over	Iterate on what’s there
Accepting “good enough”	Push for “actually good”

Phase 5: SHIP

Pre-ship checklist

□ Code compiles/runs
□ Manual smoke test passes
□ No TypeScript errors
□ No console warnings
□ Committed with clear message
□ PR ready (if applicable)

Commit message formula

<type>: <what changed>

- <detail 1>
- <detail 2>

🤖 Vibecoded with Claude

Types: feat, fix, refactor, test, docs, style

Loop Timing

Project Phase	Loop Speed
Exploration	30-60 min loops
Building	15-30 min loops
Polishing	5-15 min loops
Bug fixing	2-10 min loops

When to Break the Loop

Restart fresh when:

• Context is confused beyond repair
• Fundamental approach is wrong
• You’ve refined 5+ times with no progress

Take a break when:

• Frustration is building
• AI keeps making same mistake
• You’re not sure what you want anymore

The Meta-Loop

Daily:    Multiple vibe loops
Weekly:   Review what you shipped
Monthly:  Refine your prompting style
Always:   Update your CLAUDE.md with learnings

Quick Reference Card

PROMPT  →  Be specific, give context
GENERATE →  Watch, don't interrupt
REVIEW  →  30-sec scan, then deep check
REFINE  →  Keep/Change/Add/Remove
SHIP    →  Test, commit, deploy

---

🎯 Start Using the Loop Now

1. Pick a small task (15-30 min of work)
2. Open your AI tool (see options)
3. Run one complete loop using this cheatsheet
4. Ship something today

The loop gets faster with practice. Your first few loops might take an hour. Soon you’ll do them in 10 minutes.

---

Related Resources

Deep Dives:

• Iterative Development Guide — Full guide on the loop
• Prompting Fundamentals — Better prompts, better output
• Intro to Vibecoding — Philosophy and mindset

Quick References:

• Prompt Templates — Copy-paste prompts
• AI Code Review — Review checklist
• Quick Wins — Fast productivity tips

Practice:

• 10 First Project Ideas — Things to loop on
• Build an AI App in 30 Minutes — See the loop in action