nextjs▌

Server Components by default, client interactivity on demand, with structured data fetching and caching strategies. \n \n Server Components handle data fetching and static content; Client Components ('use client') manage forms, state, and event handlers. Split responsibilities when both are needed. \n Data fetching uses static caching by default, with ISR (time-based revalidation) and dynamic (no-store) options for different freshness requirements. \n Routing relies on file conventions (page.tsx

Complete development guidelines for building maintainable, scalable applications with Next.js, React, Redux Toolkit, and TypeScript.

Comprehensive patterns for Next.js 14+ App Router, Server Components, and modern full-stack React development. \n \n Covers rendering modes (Server Components, Client Components, static, dynamic, streaming), file conventions, and core architectural patterns with practical TypeScript examples \n Includes eight key patterns: Server Components with data fetching, Client Components, Server Actions, parallel routes, intercepting routes for modals, streaming with Suspense, Route Handlers, and metadata

Discover and extract structured recipes from recipebee.app — by direct URL, natural-language query mapped to tag/category enums, or bulk sitemap mirror. Returns full schema.org/Recipe JSON-LD: ingredients, numbered steps, prep/cook times, yield, cuisine, keywords, nutrition. Read-only; AI meal-plan and shopping-list features require login and are out of scope.

Provides patterns for data fetching in Next.js App Router: server-side fetching, SWR/React Query integration, ISR, revalidation, error boundaries, and loading states.

You are an expert full-stack web developer focused on producing clear, readable Next.js code. You always use the latest stable versions of Next.js 14, Supabase, TailwindCSS, and TypeScript, and you are familiar with the latest features and best practices. You carefully provide accurate, factual, thoughtful answers, and are a genius at reasoning.

Next.js 16+ uses Turbopack by default for local development: an incremental bundler written in Rust that significantly speeds up dev startup and hot updates.

Supabase Auth integration for Next.js App Router with middleware-based session management. \n \n Handles server/client authentication boundaries using @supabase/ssr, protecting routes via middleware and managing cookie-based sessions \n Provides patterns for OAuth callbacks, Server Actions for auth operations, and proper token handling across Server and Client Components \n Includes anti-patterns to avoid: getSession in Server Components, unlistened client auth state, and manual token storage \n

Advanced Next.js patterns for authentication, middleware, Server Actions, and user-scoped caching with Clerk. \n \n Distinguishes server-side await auth() from client-side useAuth() hook; mixing them is a common breaking mistake \n Covers middleware strategies (public-first vs protected-first), API route protection, and proper HTTP status codes (401 vs 403) \n Includes user-scoped caching patterns with unstable_cache and protecting Server Actions from unauthorized mutations \n Provides Core 2 co

Use this pattern whenever a page needs to load data based on whatever identifier appears in the URL. Common scenarios include: