skills.rest
masanao-ohba
masanao-ohbaCOMMUNITY
Explore all skills by this author →
GitHub

nextjs-code-reviewer

Automate code-review quality assurance for Next.js App Router projects.

2|Updated Oct 19, 2025
Search Tags:#code review#routing#Next.js#quality gates#App Router#server components#client components
One-click install
npx skills add https://github.com/masanao-ohba/claude-manifests --skill nextjs-code-reviewer
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: nextjs-code-reviewer
Source: https://github.com/masanao-ohba/claude-manifests/tree/main/skills/typescript-nextjs/code-reviewer
Command: npx skills add https://github.com/masanao-ohba/claude-manifests --skill nextjs-code-reviewer

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill automates the code-review process for Next.js App Router projects, ensuring consistent architecture and quality gates across teams.

Core Features & Use Cases

  • App Router structure checks: verify presence of page.tsx, layout.tsx, app/api structure, and proper placement of loading, error, and not-found components.
  • Server vs Client guidance: enforce server components as default, with client components scoped to minimal usage and prop-driven data fetching.
  • Data fetching, routing, and metadata quality: provide guidelines for async data loading, routing params, and metadata generation.
  • CI-ready outputs: generate actionable feedback suitable for automated pipelines and pull request reviews.

Quick Start

Run the nextjs-code-reviewer against your Next.js project directory to receive a structured report of issues and remediation steps.

Frequently Asked Questions about nextjs-code-reviewer

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I automate Next.js App Router code reviews for server and client components?▼

Automate Next.js App Router code reviews by running a skill that checks server and client component architecture, routing conventions, and data fetching to enforce best practices and output structured remediation guidance.

What's the best way to enforce server components as default in a Next.js project?▼

Enforce server components as default by applying automated code review rules that scope client components to minimal usage and validate prop-driven data fetching across your Next.js application architecture.

How do I check if my Next.js App Router has the correct file structure for loading and error boundaries?▼

Check Next.js App Router structure by verifying the presence and placement of page.tsx, layout.tsx, app/api directories, and proper loading, error, and not-found components to ensure routing convention compliance.

Can I integrate Next.js code review feedback into automated CI pipelines?▼

Yes, you can integrate Next.js code review feedback into CI pipelines because the skill generates structured, actionable outputs suitable for automated pipelines and pull request reviews.

Does automated Next.js code review cover async data loading and metadata generation?▼

Yes, automated Next.js code review covers async data loading, routing params, and metadata generation by providing quality guidelines for data fetching and metadata generation across complex applications.

Related Skills

Explore More Software Engineering Skills→
AgentientAgentient
2

nextjs-app-router-file-conventions

Enforce Next.js App Router file conventions for pages, layouts, and API routes.

Official
Intermediate
mhyllemhylle
17

code-review

Review code changes for architectural conformance and quality gates.

Community
Advanced
jackspacejackspace
16

nextjs

Provide migration patterns for Next.js 16 App Router features including Server Components and async route params.

Community
Advanced
litegrallitegral

nextjs-best-practices

Guide Next.js App Router architecture with Server and Client component boundaries.

Community
Advanced