Vibe Coding Tips

Start with Prompt Recipes

Don't write prompts from scratch. The 12 recipes in /prompts/ are tested and optimized for KitRocket. They save time and produce better results.

# Instead of: "Add an API endpoint for..."
# Do this:
claude "Read prompts/add-api.md. Add a POST /api/feedback endpoint."

The recipe gives Claude structure: validate input, check auth, handle errors, return proper status codes.

Be specific about what you want

Vague requests produce vague code. Specific requests produce production-ready code.

# Too vague
"Add a settings page."

# Good
"Add a /dashboard/settings page where users can update their name,
email, and notification preferences. Include a form with validation.
Show a success toast after saving. The page should be protected —
redirect to /login if not authenticated."

Break large features into steps

Don't ask for an entire feature at once. Break it into pieces:

# Step 1: Schema
claude "Add a teams table with id, name, ownerId, createdAt. Add a
team_members table with teamId, userId, role (admin/member)."

# Step 2: API
claude "Read prompts/add-api.md. Add CRUD endpoints for teams at /api/teams."

# Step 3: UI
claude "Read prompts/add-page.md. Add a /dashboard/teams page that lists
the user's teams and lets them create a new one."

# Step 4: Invite flow
claude "Read prompts/implement.md. Add a team invite system — generate
invite links, accept invites, send invite emails."

Each step is small enough for Claude to get right on the first try.

Review after implementing

Always run the review recipe after building something:

claude "Read prompts/review.md. Review the teams feature I just added."

Claude catches things you might miss:

• Missing auth checks on API routes
• Unvalidated inputs
• SQL injection opportunities
• Missing error handling
• Inconsistencies with existing patterns

Use Claude to understand the codebase

Before modifying existing code, ask Claude to explain it:

"Explain how the payment webhook flow works, from receiving the POST
to updating the subscription in the database. Trace through every file."

This is faster than reading through files yourself and helps you understand what to modify.

Keep CLAUDE.md updated

After every significant change, update CLAUDE.md:

claude "Update CLAUDE.md to reflect the changes I made today.
I added a teams system and migrated from DodoPayments to Stripe."

An accurate CLAUDE.md means Claude generates code that fits. An outdated one leads to corrections and wasted time.

Use extended thinking for complex tasks

For architectural decisions or complex features, tell Claude to think it through:

"Think step by step about how to add multi-tenancy to this project.
Consider the database schema changes, auth implications, data isolation,
and API route modifications needed. Don't write code yet — just plan."

Review the plan, then execute:

"That plan looks good. Implement step 1: the database schema changes."

Iterate, don't restart

If Claude's output isn't right, give specific feedback:

# Instead of starting over:
"No, redo the whole thing."

# Give targeted feedback:
"The component looks good but three changes needed:
1. Use the existing Button component from @/components/ui/button
2. Add loading state while the form submits
3. Show validation errors inline, not as a toast"

Use Claude for debugging

When something breaks, give Claude the full picture:

"When I click 'Upgrade' on the billing page, I get a 500 error.
The browser console shows 'Failed to fetch'. The server logs show
'TypeError: Cannot read properties of undefined (reading priceId)'.
I recently changed the plan definitions. Find and fix the bug."

The more context you provide, the faster Claude finds the root cause.

Run the security check before deploying

claude "Read prompts/security.md. I'm about to deploy to production.
Audit the entire codebase."

This catches hardcoded secrets, missing auth checks, and other issues before they reach production.

Commit frequently

After each successful change, commit:

git add .
git commit -m "feat: add team management system"

Small, frequent commits make it easy to roll back if something goes wrong.

Let Claude write tests

Tests are tedious to write by hand. Let Claude do it:

claude "Read prompts/test.md. Write tests for:
1. The checkout API route
2. The webhook handler
3. The subscription status helper"

Then review the tests to make sure they cover the right scenarios.

Use parallel workflows

For independent tasks, run multiple Claude sessions:

# Terminal 1: Build the API
claude "Read prompts/add-api.md. Add team endpoints."

# Terminal 2: Build the UI
claude "Read prompts/add-page.md. Add the teams dashboard page."

Merge the results and connect them.

Know when to write code yourself

AI is great for:

• Boilerplate and CRUD
• Following existing patterns
• Generating tests
• Debugging
• Code review

You're better at:

• Product decisions
• Architecture choices
• Complex business logic
• Edge case handling
• Final quality review

The best results come from combining both.