---
name: nextjs-app-router-crud-scaffold-review
description: Audit mechanical Next.js App Router CRUD scaffolds for correctness, security, UX, and maintainability.
trigger: Use when reviewing mechanically generated Next.js App Router CRUD route handlers, pages, forms, and tests.
auto_generated:
  by: skill-opt
  date: 2026-05-31
  source_goal: Generate a reviewer workflow for auditing Next.js App Router CRUD route and page scaffolds created by mechanical executors.
  planner_model: codex-cli/default
  review_required: true
---

# nextjs-app-router-crud-scaffold-review

## When to use

Use this skill to review Next.js App Router CRUD scaffolds generated by mechanical executors before accepting, merging, or extending them.

Apply it to generated:

- `app/**/page.tsx`, `layout.tsx`, `loading.tsx`, `error.tsx`, and `not-found.tsx`
- `app/api/**/route.ts`
- Server Actions and form handlers
- CRUD list/detail/create/edit/delete pages
- Generated validation, auth, database, and test code

## Steps

1. Identify the generated CRUD surface: model/entity, routes, pages, API handlers, actions, schemas, tests, and linked navigation.
2. Verify App Router conventions: correct file names, route segments, dynamic params, `generateMetadata`, `notFound()`, redirects, loading/error boundaries, and server/client component boundaries.
3. Audit route handlers and server actions for HTTP correctness: status codes, method coverage, request parsing, response shape, idempotency, cache behavior, and invalid method handling.
4. Check data access correctness: query filters, tenant/user scoping, pagination, sorting, unique constraints, relation loading, transactions, and delete semantics.
5. Review validation: shared schemas where appropriate, server-side validation always present, useful field errors, safe coercion, and no trust in client-only checks.
6. Review auth and authorization: every read/write path enforces the intended permission model, object-level access, ownership checks, and unauthenticated behavior.
7. Inspect security risks: injection, mass assignment, leaked internal fields, unsafe redirects, CSRF-sensitive mutations, over-broad error messages, and accidental secret exposure.
8. Review UI behavior: empty states, loading states, error states, success feedback, destructive confirmation, disabled pending buttons, accessible labels, and keyboard flow.
9. Confirm data freshness: appropriate `revalidatePath`, `revalidateTag`, `router.refresh`, cache options, optimistic updates, and redirect-after-mutation behavior.
10. Check generated code quality: no duplicated boilerplate that should be factored locally, no placeholder names, no unused imports, no `console.log`, no TODOs without owner, and no broad refactors.
11. Validate tests: unit/integration/E2E coverage for list, create, read, update, delete, validation failure, auth failure, not-found, and one edge case.
12. Produce review findings grouped by severity, each with file path, issue, impact, and recommended fix.

## DoD

- [ ] All generated route handlers and pages were mapped to the intended CRUD lifecycle.
- [ ] App Router conventions are correct for server components, client components, route handlers, params, redirects, and not-found behavior.
- [ ] Every mutation path has server-side validation, authorization, and safe error handling.
- [ ] Every data query is scoped correctly for tenant/user/ownership rules.
- [ ] UI states cover loading, empty, success, validation error, server error, and destructive action confirmation where relevant.
- [ ] Cache invalidation or refresh behavior is explicitly verified after create, update, and delete.
- [ ] Tests cover happy paths, validation failures, auth failures, not-found cases, and at least one edge case.
- [ ] Findings are actionable, path-specific, severity-ranked, and avoid rewriting unrelated architecture.

## Anti-patterns

- Approving scaffolds because they compile without checking authorization and object-level access.
- Treating generated client validation as sufficient without server-side validation.
- Ignoring cache invalidation after mutations.
- Accepting CRUD pages with no empty, loading, error, or destructive-confirmation states.
- Reviewing only API routes while skipping pages, forms, navigation, and tests.
- Suggesting broad refactors instead of scoped fixes to generated scaffold defects.
- Duplicating the FastAPI CRUD scaffold review workflow instead of focusing on Next.js App Router behavior.