CtrlK
BlogDocsLog inGet started
Tessl Logo

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.

76

Quality

Does it follow best practices?

Impact

No eval scenarios have been run

SecuritybySnyk

Passed

No known issues

SKILL.md
Quality
Evals
Security

Quality

Content

87%

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

The body is an efficient, actionable overview with executable code and a clean one-level reference structure. Its only weakness is workflow clarity: as a multi-topic patterns catalog it lacks an explicit sequenced workflow with validation checkpoints.

Suggestions

Add a short sequenced "Build a feature" workflow (e.g., 1. pick rendering mode, 2. lay out route files, 3. add loading/error boundaries, 4. verify with a build/run check) with an explicit validation step to lift workflow_clarity.

For mutation/Server Action patterns, include a validate-then-retry feedback loop (e.g., revalidate and confirm on success, surface error on failure) since these touch state-changing operations.

DimensionReasoningScore

Conciseness

The body is lean and signal-dense — a rendering-modes table, file-convention tree, executable code, and tight do's/don'ts — without explaining basics Claude already knows; nearly every token earns its place.

3 / 3

Actionability

Quick Start provides complete, copy-paste-ready TypeScript (layout.tsx with metadata, page.tsx with ISR revalidation) plus concrete file conventions and directives, satisfying the 3-anchor for fully executable examples.

3 / 3

Workflow Clarity

This is a patterns catalog rather than a sequenced procedure; Quick Start implies an order (layout then page) but there are no explicit multi-step workflows with validation checkpoints, so it sits at the 2-anchor rather than 3.

2 / 3

Progressive Disclosure

SKILL.md is a concise overview with a clearly signaled, one-level-deep pointer to the real references/details.md (verified to exist), matching the 3-anchor for well-organized navigation.

3 / 3

Total

11

/

12

Passed

Description

100%

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

A well-crafted description that names a specific niche, enumerates concrete capabilities, and includes an explicit "Use when..." trigger clause with natural keywords. It closely matches the rubric's good examples and avoids vague fluff or over-claims.

DimensionReasoningScore

Specificity

"Master Next.js 14+ App Router with Server Components, streaming, parallel routes, and advanced data fetching" lists multiple concrete technical capabilities, matching the 3-anchor's pattern of enumerating specific actions rather than vague abstractions.

3 / 3

Completeness

It answers both what (master App Router with Server Components, streaming, parallel routes, data fetching) and when via an explicit "Use when building Next.js applications, implementing SSR/SSG, or optimizing React Server Components" clause.

3 / 3

Trigger Term Quality

Natural user-facing terms appear throughout: "Next.js applications", "SSR/SSG", "React Server Components", and "App Router", giving good coverage of phrases a user would actually say.

3 / 3

Distinctiveness Conflict Risk

The Next.js 14+ App Router niche is specific and paired with distinct triggers, making it unlikely to fire for unrelated React or general web skills.

3 / 3

Total

12

/

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.

Validation16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository
wshobson/agents
Reviewed

Table of Contents

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.