After setting up a dozen Next.js projects with Cursor, I've settled on a .cursorrules file that handles the most common issues without over-specifying.
Here it is, with notes on what each section is doing.
The full file
# Next.js project rules
## Stack
Next.js 14+ App Router, TypeScript (strict), Tailwind CSS, React 18
## File structure
- Pages/layouts: app/ directory (App Router)
- Components: components/ (shared), app/_components/ (route-local)
- API routes: app/api/
- Server actions: actions/ or colocated in app/
- Types: types/index.ts for shared types
- Utilities: lib/ — check here before creating new utilities
## Imports
- Use path alias @/* (maps to ./src/* or ./*)
- No relative imports beyond one level: use @/components not ../../components
- No require(). ES modules only.
## Components
- Server components by default. Add 'use client' only when needed.
- 'use client' is needed for: useState, useEffect, event handlers, browser APIs
- Do not add 'use client' to layout files
- Component files: PascalCase. Utility files: camelCase.
## Data fetching
- Server components fetch directly (no useEffect + fetch)
- Client components: use SWR or React Query, not raw fetch in useEffect
- Server actions for mutations (not API routes for simple CRUD)
## Styling
- Tailwind classes only. No inline styles.
- No CSS modules unless the file already uses them
- Class names: use cn() from @/lib/utils for conditional classes
## TypeScript
- No 'any'. Use 'unknown' with type guards if needed.
- No non-null assertion (!). Handle null/undefined explicitly.
- Generate types from Prisma/tRPC if they exist — don't duplicate them.
## Rules
- Minimal footprint. Only modify files required for the stated task.
- Do not refactor adjacent code while working on a task.
- If you notice other issues, add a TODO comment but don't fix them.
- Never claim work is done without showing it works.
What each section prevents
Stack — Prevents suggesting features or patterns from older Next.js (Pages Router, getServerSideProps, etc.).
File structure — Prevents creating components in the wrong place and creating utilities that already exist.
Server vs. client components — The most common mistake in App Router. Prevents adding 'use client' everywhere "to be safe."
Data fetching — Next.js has several valid patterns. This picks one and sticks with it.
TypeScript rules — Prevents the any shortcuts that silently break type checking.
Minimal footprint — The most important rule. Prevents improvements you didn't ask for.
Adjusting for your project
Add your specific libraries (Prisma, tRPC, NextAuth, Stripe, etc.) and where they're configured. The more specific the context, the better the suggestions.
Generator tool for your stack: builtbyzac.com/tools/cursorrules-generator.html. Full templates: builtbyzac.com/cursor-rules.html.
Top comments (0)