Next.js 15 Pro

Boundary

This skill is strictly limited to Next.js 15 App Router (app/ directory) and React 19 features. It does NOT cover the legacy Pages Router (pages/) or older React versions.

When to use

• Building fullstack web applications using Next.js 15.
• Implementing React 19 Server Actions for data mutations.
• Configuring Partial Prerendering (PPR) or streaming UI.
• Upgrading a Next.js 14 project to Next.js 15.

Workflow

1. Analyze Requirements: Determine if the feature requires Server Components (default), Client Components ("use client"), or a mix.
2. Data Fetching: Use standard fetch with caching configurations (force-cache, no-store) or the new use cache directive.
3. Data Mutation: Create Server Actions for form submissions.
4. Optimistic UI: Use useOptimistic hook for immediate feedback during Server Actions.
5. Streaming: Wrap slow components in React <Suspense> boundaries to enable streaming and PPR.