Setup & Installation
openclaw skills install @tuanvidev/next-best-practices
Or with the ClawHub CLI, for registry-managed skill folders outside a full OpenClaw workspace:
npx clawhub install next-best-practices
What This Skill Does
A coding assistant skill that enforces Next.js conventions during code writing and review. Covers RSC boundaries, async API migration for Next.js 15+, metadata, image and font optimization, error handling, and bundling.
Consolidates Next.js-specific rules that are otherwise spread across multiple official docs pages, covering patterns that generic linters miss.
When to use it
- Catching async client component errors before they reach production
- Migrating to Next.js 15 async params, cookies, and headers APIs
- Generating OG images with next/og for social sharing
- Debugging hydration errors caused by browser API misuse
- Configuring next/image for remote sources and LCP priority loading
Example Workflow
Here's how your AI assistant might use this skill in practice.
INPUT
User asks: review my Next.js page component that uses params and cookies
AGENT
- 1Check if params and cookies are awaited per Next.js 15 async API rules
- 2Detect any async client components, which are invalid in RSC boundaries
- 3Verify error boundaries (error.tsx, not-found.tsx) exist for the route
- 4Check that images use next/image instead of bare img tags
- 5Flag any non-serializable props passed across RSC boundaries
OUTPUT
A list of violations with specific fixes referencing Next.js 15 patterns