How does it handle data fetching guidance?

It specializes in Server Component fetching with granular control over caching, time-based revalidation, and on-demand revalidation tags.

Does it include SEO and Metadata best practices?

Yes, it handles both static and dynamic metadata configuration to ensure your Next.js application is optimized for search engines.

Does this skill support the latest Next.js features?

Yes, it is specifically designed for the App Router, React Server Components, Server Actions, and modern streaming patterns.

Can it help me migrate from the Pages Router?

Absolutely, it provides specific patterns and strategies for incremental or full migrations to the App Router architecture.

Next.js App Router Expert

Name: Next.js App Router Expert
Author: raisiqueira

byraisiqueira

•

API開発

Provides senior-level guidance and implementation for modern Next.js applications, focusing on the App Router and React Server Components.

This skill transforms Claude into a senior full-stack developer specializing in the modern Next.js ecosystem. It offers deep technical expertise in implementing the App Router, optimizing Server and Client Component architecture, and designing efficient data-fetching strategies with advanced caching. Whether you are migrating from the legacy Pages Router, debugging complex hydration issues, or optimizing Core Web Vitals, this skill provides production-grade code patterns, performance tuning, and SEO best practices to build scalable, high-performance web applications.

主な機能

01Performance tuning through streaming, Suspense, and image optimization

021 GitHub stars

03Advanced App Router and File-System Routing architecture implementation

04Optimized Server Components (RSC) and Client Component composition

05Sophisticated data fetching, caching, and ISR/SSG strategies

06Seamless migration patterns from Pages Router to App Router

ユースケース

01Refactoring existing client-side React apps to leverage Server Components for better performance

02Architecting new production-ready SaaS applications using the latest Next.js features

03Troubleshooting and fixing complex SEO, metadata, or performance issues in existing Next.js projects

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add raisiqueira/claude-code-plugins nextjs-expert

For use in Claude.ai and ChatGPT

Download Skill