Notre avis
Fournit des modèles et bonnes pratiques pour développer des applications React fullstack avec Next.js, couvrant le routage, SSR/SSG, les routes API, le middleware et le déploiement.
Points forts
- Guide structuré pour le routage basé sur les fichiers et les routes dynamiques.
- Préconise l'utilisation des Server Components pour optimiser les performances.
- Intègre des stratégies de rendu (SSR, SSG, ISR) et de déploiement.
- Couverture des cas limites comme l'ISR et les limites du middleware.
Limites
- Spécifique à Next.js 13-14 ; les versions antérieures ou ultérieures peuvent différer.
- Ne couvre pas les intégrations avancées avec des bibliothèques tierces.
- Suppose une connaissance préalable de React et TypeScript.
Utilisez cette compétence lors du développement ou du déploiement d'applications Next.js, pour configurer le routage, le SSR/SSG ou le middleware.
Évitez-la si vous utilisez un framework React différent (Gatsby, Remix) ou une version de Next.js en dehors de la plage 13-14.
Analyse de sécurité
SûrThe skill provides only instructional content about Next.js best practices. It does not execute any code or contain dangerous commands, and the allowed tools (documentation-reader, web-search) are read-only and low-risk.
Aucun point d'attention détecté
Exemples
I need to create a blog with dynamic post pages using Next.js 13 App Router. Show me how to implement SSR with `getServerSideProps` equivalent in the App Router, including loading state and error handling.In my Next.js 14 app, I want to protect certain routes using middleware. Provide a complete example of middleware that checks for an authentication cookie and redirects unauthenticated users to a login page.I have a Next.js page that displays product data from an external API. I want to use ISR to revalidate every hour. Show me how to implement this with `revalidate` and handle fallback states.name: next description: "Next.js framework patterns and best practices for fullstack React applications. Routing, SSR/SSG, API routes, middleware, deployment. Trigger: When building with Next.js, configuring SSR/SSG, or deploying Next.js apps." skills:
- conventions
- react
- typescript
- architecture-patterns
- humanizer dependencies: next: ">=13.0.0 <15.0.0" react: ">=18.0.0 <19.0.0" allowed-tools:
- documentation-reader
- web-search
Next.js Skill
When to Use
- Building React apps with SSR/SSG
- Implementing API routes or middleware
- Deploying fullstack React projects
Critical Patterns
- Use file-based routing and dynamic routes
- Prefer server components for data fetching
- Leverage middleware for auth and rewrites
Decision Tree
- SSR/SSG needed? → Use getServerSideProps/getStaticProps
- API needed? → Use /pages/api or app/api
- Custom routing? → Use dynamic routes
Edge Cases
- Incremental static regeneration
- Middleware edge limitations
- API route cold starts
Expert Next.js App Router
Developpement
Un skill qui transforme Claude en expert Next.js App Router.
Générateur de README
Developpement
Crée des README.md professionnels et complets pour vos projets.
Rédacteur de Documentation API
Developpement
Génère de la documentation API complète au format OpenAPI/Swagger.