Bolt Prompt Templates

Build a React dashboard with Vite and Tailwind CSS.

Components:
- Header with title and user menu
- Sidebar navigation with icons
- Main content area with:
  - 4 stat cards in a row (show numbers with trends)
  - Line chart for [METRIC] over time
  - Bar chart comparing [CATEGORIES]
  - Data table with pagination and sorting

Features:
- Dark mode toggle
- Responsive layout (collapsible sidebar on mobile)
- Loading skeletons

Use Recharts for visualizations.
Use realistic mock data that tells a coherent story.

Build a multi-step form with React and react-hook-form.

Steps:
1. Personal Info: name, email, phone (all required)
2. Address: street, city, state, zip
3. Preferences: [checkboxes for options]
4. Review: show all entered data
5. Submit: loading state, success/error handling

Features:
- Progress bar showing current step
- Next/Back navigation
- Per-field validation with inline errors
- Data preserved when going back
- Smooth transitions between steps

Style with Tailwind. Make it look like a modern signup flow.

Build a todo app with Next.js (App Router) and SQLite.

Frontend:
- List todos with checkboxes
- Add new todo (input + button)
- Edit todo inline
- Delete with confirmation
- Filter: All / Active / Completed

Backend (API Routes):
- GET /api/todos - list all
- POST /api/todos - create
- PUT /api/todos/:id - update
- DELETE /api/todos/:id - delete

Database:
- SQLite with Prisma
- Todos table: id, title, completed, createdAt

Include error handling and loading states.
Style with Tailwind CSS.

Build a notes app with Next.js, NextAuth.js, and PostgreSQL.

Auth:
- Login/signup with email + password
- Protected routes

Notes:
- Create notes with title and markdown content
- List notes in sidebar (newest first)
- Edit note in main area
- Delete notes
- Search notes by title

Features:
- Auto-save while typing (debounced)
- Markdown preview
- Organize with folders/tags

Stack:
- Next.js 14 with App Router
- NextAuth.js for auth
- Prisma with PostgreSQL
- Tailwind CSS

Design: Clean, minimal, focus on content.

Build a REST API with Express and TypeScript.

Resource: [YOUR RESOURCE, e.g., Products]

Endpoints:
- GET /api/[resources] - list with pagination and filtering
- GET /api/[resources]/:id - get single item
- POST /api/[resources] - create (validate input)
- PUT /api/[resources]/:id - update
- DELETE /api/[resources]/:id - delete

Features:
- Input validation with Zod
- Error handling middleware
- Request logging
- Rate limiting
- CORS configuration

Database: SQLite with Prisma

Include Swagger/OpenAPI documentation.

Build a webhook handler for [SERVICE, e.g., Stripe, GitHub].

Features:
- Verify webhook signature
- Parse and validate payload
- Process different event types:
  - [EVENT 1]
  - [EVENT 2]
  - [EVENT 3]
- Log all received events
- Return appropriate responses
- Handle retries gracefully (idempotency)

Include:
- Test endpoint to simulate webhooks
- Event log viewer
- Retry queue for failed processing

Use Express with TypeScript.

Create a component library with React, TypeScript, and Tailwind.

Components:
- Button (variants: primary, secondary, ghost, danger; sizes: sm, md, lg)
- Input (with label, error state, icons)
- Select dropdown
- Modal/Dialog
- Toast notifications
- Card
- Badge
- Avatar
- Tabs

For each component:
- TypeScript props interface
- Multiple variants/sizes
- Proper accessibility
- Dark mode support

Create a demo page showing all components.