jbvc/nextjs-app-router-patterns
Master Next.js 14+ App Router with Server Components, streaming, parallel routes, and advanced data fetching. Use when building Next.js applications, implementing SSR/SSG, or optimizing React Server Components.
65
65%
Does it follow best practices?
Impact
Pending
No eval scenarios have been run
Passed
No known issues
Quality
Discovery
89%Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.
This is a solid skill description with excellent trigger term coverage and a clear 'Use when' clause that makes it easy for Claude to select appropriately. Its main weakness is the use of 'Master' as the leading verb, which is aspirational rather than describing concrete actions the skill performs (e.g., 'configure', 'implement', 'optimize'). The specificity of capabilities could be improved by listing more concrete actions rather than just feature names.
Suggestions
Replace 'Master' with concrete action verbs describing what the skill does, e.g., 'Configures routing, implements streaming, sets up parallel routes, and optimizes data fetching in Next.js 14+ App Router applications.'
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | Names the domain (Next.js 14+ App Router) and mentions several features (Server Components, streaming, parallel routes, data fetching), but uses 'Master' which is vague and aspirational rather than describing concrete actions the skill performs. It doesn't list specific actionable capabilities like 'configure routes', 'set up streaming SSR', or 'implement caching strategies'. | 2 / 3 |
Completeness | Clearly answers both 'what' (Next.js 14+ App Router with Server Components, streaming, parallel routes, advanced data fetching) and 'when' with an explicit 'Use when' clause specifying building Next.js applications, implementing SSR/SSG, or optimizing React Server Components. | 3 / 3 |
Trigger Term Quality | Includes strong natural trigger terms users would say: 'Next.js', 'App Router', 'Server Components', 'SSR', 'SSG', 'React Server Components', 'streaming', 'parallel routes', 'data fetching'. These cover common variations of how users would describe Next.js development needs. | 3 / 3 |
Distinctiveness Conflict Risk | Highly specific to Next.js 14+ App Router, which is a clear niche. The mention of specific features like parallel routes, streaming, and the version qualifier (14+) make it unlikely to conflict with general React skills or older Next.js Pages Router skills. | 3 / 3 |
Total | 11 / 12 Passed |
Implementation
22%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This skill is essentially a hollow shell that defers all substantive content to an external playbook while providing no actionable guidance, code examples, or Next.js-specific patterns in the main file. The instructions are generic boilerplate that could apply to any domain. For a topic as rich as Next.js App Router patterns, the skill needs concrete examples, specific commands, and at minimum a quick-start section with executable code.
Suggestions
Add a Quick Start section with at least one executable Next.js App Router code example (e.g., a basic Server Component, a route handler, or a Server Action) so the skill provides immediate value without needing to open the playbook.
Replace the generic instruction bullets ('Clarify goals, constraints, and required inputs', 'Apply relevant best practices') with Next.js-specific guidance such as when to use 'use client' vs server components, caching strategies, or specific file conventions (layout.tsx, loading.tsx, error.tsx).
Add a brief summary of what's in the implementation playbook (e.g., 'Covers: streaming with Suspense, parallel routes, intercepting routes, Server Actions patterns') so Claude knows when to consult it.
Include at least a minimal workflow for common tasks like setting up a new route or implementing data fetching with validation steps (e.g., checking build output, verifying SSR behavior).
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The 'Use this skill when' and 'Do not use this skill when' sections add some bulk without much value—Claude can infer applicability. The instructions section is generic filler ('Clarify goals, constraints, and required inputs') rather than Next.js-specific guidance. However, it's not excessively verbose. | 2 / 3 |
Actionability | There is zero concrete, executable guidance—no code examples, no specific commands, no Next.js-specific patterns or configurations. The instructions are entirely vague platitudes like 'Apply relevant best practices and validate outcomes' that could apply to any skill. | 1 / 3 |
Workflow Clarity | There is no meaningful workflow described. The four bullet points in Instructions are generic meta-instructions with no sequencing, no validation checkpoints, and no Next.js-specific steps. For a skill covering SSR/SSG, streaming, and Server Actions, this is woefully insufficient. | 1 / 3 |
Progressive Disclosure | The skill does reference a single external resource (resources/implementation-playbook.md) which is one level deep, but the SKILL.md itself provides essentially no overview content—it's just a pointer. There's no quick-start content or summary of what the playbook contains to help with navigation. | 2 / 3 |
Total | 6 / 12 Passed |
Validation
100%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 11 / 11 Passed
Validation for skill structure
No warnings or errors.
Reviewed
Table of Contents