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.

58

Quality

67%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./.agents/skills/nextjs-app-router-patterns/SKILL.md

The canonical home for this skill is nextjs-app-router-patterns in wshobson/agents

SKILL.md
Quality
Evals
Security

Quality

Content

42%Scale 1-3

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

The skill provides high-quality, executable Next.js App Router code examples covering a comprehensive range of patterns, which is its primary strength. However, it is far too verbose for a skill file—it reads more like a tutorial or documentation page than a concise skill reference. It explains many concepts Claude already knows, lacks workflow sequencing and validation steps, and dumps all content into a single file rather than using progressive disclosure.

Suggestions

Reduce the file to a concise overview (~100 lines) with quick-reference patterns, and move detailed pattern implementations (parallel routes, intercepting routes, route handlers, metadata) into separate bundle files referenced from SKILL.md.

Remove the 'Core Concepts' rendering modes table, file conventions listing, and basic do's/don'ts—Claude already knows these fundamentals of Next.js App Router.

Add workflow guidance with validation steps for common multi-step processes like migration from Pages Router or setting up intercepting routes (e.g., 'verify the modal renders on soft navigation, then test hard refresh falls back to full page').

Cut the 'When to Use This Skill' section entirely—this is metadata that belongs in frontmatter, not body content.

DimensionReasoningScore

Conciseness

The skill is extremely verbose at ~400+ lines. It explains concepts Claude already knows well (rendering modes table, file conventions, basic do's/don'ts like 'don't use hooks in Server Components'). The 'When to Use This Skill' section is unnecessary padding. Many patterns could be condensed significantly - e.g., the route handler pattern is standard CRUD that Claude knows. The 'Core Concepts' section rehashes Next.js documentation basics.

1 / 3

Actionability

The code examples are fully executable, complete TypeScript with proper imports, type annotations, and realistic patterns. Every pattern includes copy-paste ready code covering real-world scenarios like cart actions, parallel routes, intercepting routes, and caching strategies.

3 / 3

Workflow Clarity

The patterns are presented as isolated examples rather than a sequenced workflow. There are no validation checkpoints, no error recovery loops, and no guidance on verifying that implementations work correctly. For a skill covering migration and complex routing setups, the lack of verification steps (e.g., 'test that parallel routes fall back correctly') is a gap.

2 / 3

Progressive Disclosure

Everything is crammed into a single monolithic file with no bundle files to offload detailed patterns. The 8 full patterns, caching strategies, best practices, and core concepts all live inline. Content like the intercepting routes pattern, route handlers, and metadata/SEO could easily be separate reference files, with SKILL.md serving as a concise overview pointing to them.

1 / 3

Total

7

/

12

Passed

Description

92%Scale 1-3

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 strong skill description that clearly identifies specific Next.js 14+ capabilities and provides explicit trigger guidance. It uses appropriate third-person voice ('Master' as imperative is acceptable) and includes rich, natural trigger terms. The only minor weakness is potential overlap with broader React or general Next.js skills, though the version and feature specificity mitigate this somewhat.

DimensionReasoningScore

Specificity

Lists multiple specific concrete capabilities: App Router, Server Components, streaming, parallel routes, and advanced data fetching. These are distinct, actionable technical features rather than vague abstractions.

3 / 3

Completeness

Clearly answers both 'what' (Next.js 14+ App Router with Server Components, streaming, parallel routes, advanced data fetching) and 'when' (explicit 'Use when building Next.js applications, implementing SSR/SSG, or optimizing React Server Components').

3 / 3

Trigger Term Quality

Includes strong natural keywords users would say: 'Next.js', 'App Router', 'Server Components', 'streaming', 'parallel routes', 'SSR/SSG', 'React Server Components'. These cover common variations and terms developers naturally use.

3 / 3

Distinctiveness Conflict Risk

While it's specific to Next.js 14+ App Router, it could overlap with a general React skill or a broader Next.js skill. The 'React Server Components' trigger could also conflict with a general React skill. However, the version specificity (14+) and App Router focus help narrow it somewhat.

2 / 3

Total

11

/

12

Passed

Validation

90%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation10 / 11 Passed

Validation for skill structure

CriteriaDescriptionResult

skill_md_line_count

SKILL.md is long (544 lines); consider splitting into references/ and linking

Warning

Total

10

/

11

Passed

Repository
alpacapurpura/ap_sales_agent
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.