next-best-practices
Next.js best practices and recommended patterns
Developer Setup
Setup & Installation
npx skills add https://github.com/vercel-labs/next-skills --skill next-best-practicesnpx skills add https://github.com/vercel-labs/next-skills --skill next-best-practicesOverview
What This Skill Does
A skill for writing and reviewing Next.js code across the full surface area of the framework. Covers file conventions, RSC boundaries, async API changes in Next.js 15+, metadata, image and font optimization, error handling, route handlers, and bundling.
Application
When to use this Skill
- Configuring integration settings for custom agent workflows.
- Optimizing query execution and response latency in production.
- Developing clean, standard-compliant implementations for enterprise services.
- Troubleshooting connection timeouts and authentication handshakes.
- Monitoring API rate limits and execution pipelines programmatically.
Documentation
Show Skills.md file
Next.js Best Practices
Apply these rules when writing or reviewing Next.js code.
File Conventions
See file-conventions.md for:
- Project structure and special files
- Route segments (dynamic, catch-all, groups)
- Parallel and intercepting routes
- Middleware rename in v16 (middleware → proxy)
RSC Boundaries
Detect invalid React Server Component patterns.
See rsc-boundaries.md for:
- Async client component detection (invalid)
- Non-serializable props detection
- Server Action exceptions
Async Patterns
Next.js 15+ async API changes.
Recommendations
Explore other random skills
web-artifacts-builder
Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.
webapp-testing
Toolkit for interacting with and testing local web applications using Playwright. Supports verifying frontend functionality, debugging UI behavior, capturing browser screenshots, and viewing browser logs.
xlsx
Use this skill any time a spreadsheet file is the primary input or output. This means any task where the user wants to: open, read, edit, or fix an existing .xlsx, .xlsm, .csv, or .tsv file (e.g., adding columns, computing formulas, formatting, charting, cleaning messy data); create a new spreadsheet from scratch or from other data sources; or convert between tabular file formats. Trigger especially when the user references a spreadsheet file by name or path — even casually (like \"the xlsx in my downloads\") — and wants something done to it or produced from it. Also trigger for cleaning or restructuring messy tabular data files (malformed rows, misplaced headers, junk data) into proper spreadsheets. The deliverable must be a spreadsheet file. Do NOT trigger when the primary deliverable is a Word document, HTML report, standalone Python script, database pipeline, or Google Sheets API integration, even if tabular data is involved.