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.

Quality

71%

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

Securityby

Passed

No known issues

Optimize this skill with Tessl

npx tessl skill review --optimize ./tests/ext_conformance/artifacts/agents-wshobson/frontend-mobile-development/skills/nextjs-app-router-patterns/SKILL.md

Evaluation results

100%

30%

Reading List Bookmarks Feature

Server Actions and cache invalidation

Criteria

Without context

With context

use server directive

100%

revalidateTag after mutation

100%

revalidatePath after mutation

100%

cookies import from next/headers

100%

cookies call awaited

100%

redirect from next/navigation

100%

use client on interactive component

100%

useTransition for pending state

100%

Error returned as object

100%

90%

10%

Developer Profile Page

Streaming with Suspense and colocated data fetching

Criteria

Without context

With context

Suspense wraps slow sections

100%

Skeleton fallbacks provided

100%

Critical data fetched blocking

100%

Data colocated in async components

100%

loading.tsx created

use client only for interactivity

100%

No fetch in client components

100%

searchParams awaited

100%

Suspense key for param changes

100%

30%

Recipe Blog API and Page

Dynamic route handlers and SEO metadata

Criteria

Without context

With context

NextRequest in handler

100%

NextResponse.json for responses

100%

params typed as Promise

100%

params awaited in handler

100%

404 with status 404

100%

POST returns 201

100%

generateMetadata async

100%

openGraph metadata

100%

twitter metadata

100%

generateStaticParams

100%

notFound from next/navigation

100%

Repository: Dicklesworthstone/pi_agent_rust
Commit: 47823e3

Evaluated: about 1 month ago
Agent: Claude Code
Model: Claude Sonnet 4.6

Table of Contents

Reading List Bookmarks Feature Developer Profile Page Recipe Blog API and Page

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.