nextjs▌

Add Auth0 authentication to Next.js apps with session management, protected routes, and middleware. \n \n Supports both App Router and Pages Router with automatic OAuth callback handling via /auth/login , /auth/logout , and /auth/callback endpoints \n Provides server-side session access through auth0.getSession() for Server Components and API routes, plus client-side useUser() hook for client components \n Requires middleware configuration ( middleware.ts for Next.js 15+, or proxy.ts for Next.js

Apply these rules when writing or reviewing Next.js code.

Provide comprehensive guidance for choosing between Server Components and Client Components in Next.js App Router, including cookie/header access, searchParams handling, pathname routing, and React's 'use' API for promise unwrapping.

Build Next.js 16 apps with async route params, Server Components, Cache Components, and Partial Prerendering. \n \n Covers 25+ documented errors and solutions, including async params migration, parallel routes with required default.js , and \"use cache\" directive patterns \n Supports Cache Components with revalidateTag() , updateTag() , and refresh() APIs for opt-in caching and stale-while-revalidate strategies \n Includes proxy.ts migration (replaces deprecated middleware.ts), Turbopack produc

Next.js 14+ App Router specialist for server components, server actions, and full-stack deployment. \n \n Covers App Router architecture, layouts, route groups, loading/error boundaries, and streaming SSR with Suspense \n Implements server components by default with 'use client' only at leaf boundaries; handles data fetching with explicit cache and revalidation strategies \n Provides server actions for form handling, mutations, and on-demand cache revalidation via revalidatePath \n Includes gene

Expert guidance for building Next.js applications with TypeScript, React Server Components, and modern UI libraries. \n \n Covers TypeScript best practices, functional component patterns, and Next.js App Router architecture with emphasis on Server Components over client-side rendering \n Recommends Shadcn UI, Radix UI, and Tailwind CSS for component building and responsive design using mobile-first approach \n Includes performance optimization strategies: dynamic loading, image optimization with

Comprehensive guide for migrating to and building with Next.js App Router (13+). \n \n Covers migration from Pages Router including file structure mapping, layout creation, metadata handling, and cleanup steps \n Explains App Router file conventions (page.tsx, layout.tsx, loading.tsx, error.tsx, route.ts) and routing patterns (dynamic routes, catch-all, route groups) \n Details Server Components as the default with async/await support, Client Components with 'use client' directive, and data fetc

Use this skill when:

Server Components use DIFFERENT navigation methods than Client Components!

Load with: base.md + supabase.md + typescript.md