Frontend · Claude Code (via permissions.deny)
Next.js 16 App Router .claudeignore
A .claudeignore for Next.js 16 App Router: the paths Claude Code should stay out of, with matching permissions.deny rules.
- Path
- .claudeignore
- Loads
- Pattern list
- Format
- gitignore syntax
- Used by
- Claude Code (via permissions.deny)
What this file tells the agent
Claude Code reads files while it works. This .claudeignore keeps the list of Next.js 16 App Router paths it should stay out of (build output, large binaries, logs and secrets). Copy the sensitive ones into permissions.deny in .claude/settings.json, which Claude Code enforces.
- Enforce React Server Components (RSC) by default; restrict 'use client' strictly to interactive leaf components.
- Mutate state exclusively via Server Actions with Zod safeParse validation.
- Await the async request APIs (cookies(), headers(), params, searchParams); Next.js 16 removed the sync forms.
- Avoid pages/ directory conventions or legacy getServerSideProps.
- Colocate loading.tsx and error.tsx for dynamic route segments.
Code to avoid, and what to write instead
The rule steers the agent away from the left and toward the right.
"use client";
export function SaveItem() {
const submit = async (e: any) => {
e.preventDefault();
await fetch("/api/items", { method: "POST", body: JSON.stringify({ title: "Test" }) });
};
return <button onClick={submit}>Save</button>;
}"use server";
import { z } from "zod";
import { db } from "@/lib/db";
const Schema = z.object({ title: z.string().min(3) });
export async function createItem(formData: FormData) {
const parsed = Schema.safeParse(Object.fromEntries(formData));
if (!parsed.success) return { ok: false, errors: parsed.error.flatten().fieldErrors };
await db.item.create({ data: parsed.data });
return { ok: true };
}Install it in one command
- 01
Go to your project root
The file goes at .claudeignore, relative to the root.
- 02
Download the file
Run the command on the right. It downloads this preset and writes the file.
- 03
Make sure it gets used
Claude Code does not enforce .claudeignore by itself. Copy the sensitive paths into permissions.deny in .claude/settings.json, which it does enforce.
$ curl -fsSL "https://www.devscratchpad.tech/api/raw/claudeignore/nextjs-16" -o ".claudeignore"
writes .claudeignore
.claudeignore
To write the file from your own code instead, use Read your code or Convert Legacy Rules in the editor above.
More for Next.js 16 App Router
Questions
- Does Claude Code honor .claudeignore?
- Not by itself. Claude Code enforces permission rules, so copy the sensitive paths into permissions.deny in .claude/settings.json, for example Read(./.env). Keep .claudeignore in the repository root as the reviewable list.
- What should I put in .claudeignore?
- Exclude large build caches, minified bundles, lockfiles, and environment files containing sensitive credentials.