vercel-react-best-practices

Essential rules for building fast React 19 apps in Next.js App Router, keeping bundles lean and eliminating hydration mismatches.

Publisher: Vercel Labs•Audited: 2026-11-02•Agents: Claude Code, Cursor, Codex, Windsurf

Install Command

npx skills add vercel-labs/agent-skills --skill vercel-react-best-practices

Source Repository•View on skills.sh

When to use this skill

•Structuring Server and Client Component hierarchies in Next.js App Router
•Resolving async page params and searchParams per Next.js 16 standards
•Preventing hydration mismatches from client-only browser state

Package Files

SKILL.mdSource File

references/rsc.mdSource File

references/async-params.mdSource File

Related nextjs Skills

vercel-cli

Automate project linking, environment variable synchronization, preview deployments, and production releases directly from agent terminal commands.

trigger-tasks

Author and trigger reliable background tasks, batch workflows, and long-running operations in Next.js without serverless function timeout limits.

vercel-composition-patterns

Techniques for composing flexible, reusable UI components using compound patterns and context providers rather than deeply nested prop drilling.

Production grade starter repo

Pre built starter repo with auth, databases, backend, and AI integrations already configured based on your tech stack of choice (worth $200+ and saves you 30+ hours of configuration).

6 Core Languages Supported18+ Frontend • 45+ Backend

TypeScript

React Native

Rust

Python

Java

Custom PRD & business logicTasks streamed via MCPAgent skills pre-installed

Build with your agent