TypeScript · React · Next.js
Next.js App Router rules for Cursor
Server Components by default, data fetching on the server, and the App Router conventions agents most often get wrong.
The rule
Save as .cursor/rules/nextjs.mdc. Cursor picks it up on the next request.
.cursor/rules/nextjs.mdc
---
description: Next.js App Router conventions for this repo
globs: app/**/*.ts, app/**/*.tsx, src/app/**/*.ts, src/app/**/*.tsx
alwaysApply: false
---
- Components are Server Components by default. Add "use client" only to the smallest component that needs state, effects or browser APIs.
- Fetch data in Server Components or route handlers, never in useEffect for initial render.
- Use the file conventions: page.tsx, layout.tsx, loading.tsx, error.tsx, not-found.tsx, route.ts.
- params and searchParams are Promises in page and layout props: await them.
- Use next/link for internal links and next/image for images.
- Put mutations in Server Actions ("use server") and revalidate with revalidatePath or revalidateTag.
- Export metadata or generateMetadata from pages; do not set <title> manually.
- Never import server-only modules (database clients, secrets) into client components.
Using another agent too?
The same instructions work as plain Markdown in AGENTS.md, which Codex, Gemini CLI, GitHub Copilot and most other coding agents read.
AGENTS.md (section)
## Next.js App Router
- Components are Server Components by default. Add "use client" only to the smallest component that needs state, effects or browser APIs.
- Fetch data in Server Components or route handlers, never in useEffect for initial render.
- Use the file conventions: page.tsx, layout.tsx, loading.tsx, error.tsx, not-found.tsx, route.ts.
- params and searchParams are Promises in page and layout props: await them.
- Use next/link for internal links and next/image for images.
- Put mutations in Server Actions ("use server") and revalidate with revalidatePath or revalidateTag.
- Export metadata or generateMetadata from pages; do not set <title> manually.
- Never import server-only modules (database clients, secrets) into client components.
More templates
Reviewed Oct 6, 2026. Written by AgentAtlas. Adapt it to your codebase before relying on it.