Vibe Coding Cheat Sheet — WhatIsVibeCode

🎯 Prompt Templates That Work

🟢 Scaffold a New Feature

Create a [feature] component with: - TypeScript types for all props - Error boundary with fallback UI - Loading skeleton state - Unit tests with >80% coverage - Storybook story with controls Follow the existing patterns in /src/components/.

🟡 Debug a Production Issue

I'm seeing [error message] in production. Stack trace: [paste trace] This started after [recent change]. Walk me through debugging this step-by-step. Don't fix it yet — help me understand the root cause first.

🔵 Refactor Legacy Code

Refactor this function to: 1. Extract pure functions (no side effects) 2. Add TypeScript types 3. Replace callbacks with async/await 4. Add JSDoc comments 5. Keep the same external API — this is consumed by [X] Show me the diff, don't rewrite the whole file.

🟣 Write Tests

Write tests for [module] covering: - Happy path with valid inputs - Edge cases: empty, null, undefined, boundary values - Error handling: network failures, invalid data - Integration: how it interacts with [dependency] Use [testing framework]. Mock external dependencies.

🟠 API Design

Design a REST API for [resource] with: - CRUD endpoints following RESTful conventions - Request/response schemas (OpenAPI 3.0) - Auth: Bearer token with role-based access - Pagination, filtering, sorting - Error responses with proper HTTP status codes - Rate limiting strategy

📐 10 Golden Rules of Vibe Coding

1. Context is King

Always provide file paths, stack traces, and existing patterns. AI can't read your mind.

2. Think → Prompt → Verify

Never accept the first output. Read every line. AI is your copilot, not your captain.

3. Small Diffs Win

Ask for incremental changes, not full rewrites. Reviewable PRs ship faster.

4. Test Before Trust

Generated code without tests is technical debt in disguise. Always ask for tests.

5. Show, Don't Tell

Paste the actual code. Share the actual error. Screenshots > descriptions.

6. Name Your Constraints

Say no external deps, vanilla CSS only, must work in Node 18. Constraints improve output.

7. Version Your Prompts

Save prompts that work. Build a library. Good prompts are reusable engineering assets.

8. Separate Concerns

One prompt per task. Don't ask for UI + API + tests in a single prompt.

9. Review Like a Senior

Check for: security holes, missing error handling, hardcoded values, missing edge cases.

10. Ship Daily

Vibe coding removes friction. Use the speed to ship small improvements every day.

🛠️ Quick Tool Reference

Tool	Best For	Context Window	Price
Cursor	Full-stack development, codebase-wide edits	Whole repo	$20/mo
GitHub Copilot	Inline completions, IDE integration	Current file	$10/mo
Claude (Anthropic)	Complex reasoning, long docs, architecture	200K tokens	$20/mo
Windsurf	Agentic workflows, multi-file edits	Whole repo	$15/mo
Bolt.new	Prototyping, instant full-stack apps	Per session	Free tier
v0 (Vercel)	UI component generation, React/Next.js	Per prompt	Free tier
Replit Agent	Full app builds from description	Per session	$25/mo

🔄 7 Workflows for Daily Shipping

Morning Kickoff

Review yesterday's diff
Write today's top 3 tasks
Open AI tool with project context loaded

Feature Build

Describe the feature in plain English
Ask AI for architecture first
Implement in small, testable chunks
Write tests alongside implementation

Bug Squash

Reproduce with minimal steps
Share error + stack trace with AI
Ask for root cause before fix
Write regression test

Code Review

Paste diff into AI
Ask: "security issues, bugs, improvements?"
Check for missing error handling
Verify test coverage

Refactoring

Run existing tests first
Refactor one module at a time
Keep external API unchanged
Measure before/after complexity

Documentation

Ask AI to generate README from code
Add JSDoc/docstrings to public APIs
Create architecture diagram (Mermaid)
Write onboarding guide

End of Day

Commit with descriptive message
Push to remote
Update task board
Save any useful prompts

🚫 Anti-Patterns to Avoid

❌ Don't	✅ Do Instead
Blindly copy-paste AI output	Read every line, understand the logic
Ask "build me an app"	Break into specific, testable tasks
Skip error handling	Always ask: "what if this fails?"
Ignore security	Ask AI to review for OWASP Top 10
Use AI without context	Provide codebase, constraints, patterns
Prompt once and accept	Iterate: refine, constrain, improve