Vibe-Coding Kit Module

Overview

The Vibe-Coding Kit makes KitRocket the first boilerplate designed to be built with AI. It includes:

• CLAUDE.md — project context file that Claude Code reads automatically
• .cursorrules — equivalent context file for Cursor IDE
• 12 Prompt Recipes — pre-built prompts in /prompts/ for common development tasks

When you open your KitRocket project with Claude Code, it already knows your tech stack, file structure, conventions, and how everything connects. No more explaining your project from scratch every time.

Configuration

Edit CLAUDE.md

The CLAUDE.md file at your project root is the single source of truth for AI context. Customize it for your project:

# Project: YourApp

## Tech Stack
- Next.js 15 (App Router)
- TypeScript
- Tailwind CSS + shadcn/ui
- Drizzle ORM + Supabase Postgres
- Better Auth
- DodoPayments
- Resend + React Email

## Directory Structure
[auto-generated from your actual project]

## Conventions
- Use server components by default
- Path alias: @/ maps to src/
- Immutable patterns — never mutate state
- Validate inputs at system boundaries

## Key Files
- src/lib/auth/server.ts — auth configuration
- src/lib/payments/plans.ts — pricing plans
- src/db/schema/ — database tables

Update this file as your project evolves. The more accurate it is, the better AI suggestions you get.

Edit .cursorrules

The .cursorrules file provides the same context for Cursor IDE. It follows the same format as CLAUDE.md.

Usage

Using with Claude Code

1. Open your terminal in the project directory
2. Run claude to start Claude Code
3. Claude automatically reads CLAUDE.md for context
4. Start building:

claude "Add a user profile page with avatar upload"

Or use a prompt recipe:

claude < prompts/implement.md

Using with Cursor

1. Open the project in Cursor
2. Cursor reads .cursorrules automatically
3. Use Cmd+K or the chat panel to interact

Using Prompt Recipes

Prompt recipes are markdown files in /prompts/ that give AI detailed instructions for specific tasks:

# Use a recipe directly
claude < prompts/implement.md

# Or copy-paste the recipe content into any AI chat

See Prompt Recipes for the full list and usage guide.

What's included

12 Prompt Recipes

Recipe	File	What it does
Implement	prompts/implement.md	Build a complete feature end-to-end
Review	prompts/review.md	Code review with actionable feedback
Fix Bug	prompts/fix-bug.md	Debug and fix an issue systematically
Add API	prompts/add-api.md	Create a new API endpoint with validation
Add Page	prompts/add-page.md	Add a new page with layout and metadata
Add Component	prompts/add-component.md	Create a reusable UI component
Refactor	prompts/refactor.md	Improve code quality without changing behavior
Test	prompts/test.md	Write unit and integration tests
Deploy	prompts/deploy.md	Pre-deployment checklist and fixes
Security	prompts/security.md	Security audit of your codebase
Performance	prompts/performance.md	Find and fix performance bottlenecks
Document	prompts/document.md	Generate documentation for your code

CLAUDE.md sections

The project context file includes:

• Project name and description — what you're building
• Tech stack — every framework and library used
• Directory structure — where files live and why
• Conventions — coding standards the AI should follow
• Key files — the most important files to understand
• Database schema — table structures and relationships
• API routes — all endpoints and what they do
• Environment variables — what each variable does

Customization

Create your own prompt recipe

See Create Your Own for a detailed guide. The short version:

1. Create a markdown file in /prompts/:

# Task: [What this recipe does]

## Context
You are working on a Next.js SaaS application. Read CLAUDE.md for full project context.

## Instructions
1. [Step-by-step instructions for the AI]
2. [Be specific about files, patterns, and conventions]
3. [Include constraints and quality requirements]

## Output
- [What the AI should produce]
- [File paths and structure]

2. Use it:

claude < prompts/my-recipe.md

Keep CLAUDE.md updated

After major changes to your project:

1. Update the directory structure section
2. Add new key files
3. Update the database schema section
4. Add new conventions or patterns

You can even use Claude Code to update it:

claude "Update CLAUDE.md to reflect the current project state"

Removing this module

This module is just files — no code dependencies:

1. Delete CLAUDE.md from project root
2. Delete .cursorrules from project root
3. Delete the prompts/ directory
4. That's it. No packages to remove.

You probably don't want to remove this module. It makes everything else faster to build and maintain.