Next.js 15 App Router & Server Actions .cursorrules (.mdc)
Production-tested .cursorrules and .cursor/rules/*.mdc configuration for Next.js 15. Enforce React Server Components (RSC), Zod-validated Server Actions, and prevent AI context pollution.
---
description: Next.js 15 App Router, Server Components, and Server Actions standards
globs: app/**/*.{ts,tsx}, components/**/*.{ts,tsx}
alwaysApply: false
---
# Next.js 15 Production Standards
## Architecture & Rendering
- Treat all components as React Server Components (RSC) by default.
- Never add `'use client'` at the page or layout level. Only attach `'use client'` at the lowest leaf nodes requiring interactivity (e.g. interactive buttons, forms with local state, event listeners).
- Fetch data directly in React Server Components using async/await and native `fetch` with Next.js cache configurations (`next: { revalidate: 3600 }` or `{ cache: 'no-store' }`).
## Server Actions & Data Mutation
- Place data mutation actions in dedicated `actions/*.ts` files marked with `'use server'` at the top.
- Every Server Action argument MUST be validated using a strict Zod schema before processing.
- Never trust client-provided IDs or user roles without server-side session verification.
- Return structured result objects: `{ success: boolean, data?: T, error?: string }`.
## Performance & Assets
- Always use `next/image` with explicit `width`, `height`, and accessible `alt` text.
- Use `next/font/google` or `next/font/local` for zero-layout-shift font optimization.
- Route handlers belong in `app/api/**/route.ts` and must return typed `NextResponse.json()`.https://cursor.pacebowl.com/rules/nextjs-15.html
Frequently Asked Questions & Implementation Notes
Why use modular .mdc rules instead of a single .cursorrules for Next.js 15?
Next.js 15 separates client components from server components and server actions. A single .cursorrules file forces the AI to load backend, styling, and database instructions into every single prompt. .mdc rules with glob pattern app/**/*.{ts,tsx} load only when you edit Next.js files, saving tokens and eliminating AI hallucination.
How do these rules prevent AI from overusing 'use client'?
The rules explicitly mandate that all components default to React Server Components (RSC), and 'use client' is strictly forbidden except at leaf-node interactive boundaries where useState or browser events are required.
Are Next.js 15 Server Actions protected by these rules?
Yes, the guidelines mandate that all mutations must use Server Actions and validate every single input payload using Zod before touching the database or external APIs.