nextjs-app-router-crud-scaffold-review

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-31T00:00:00.000Z","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.