Claude Skills for Next.js
Claude skills for Next.js developers on the App Router.
Download the free pack
Get 3 Claude skills in a zip file. Upload each folder as its own skill in Claude.
Download pack (.zip)Free. No email required. Install instructions
Next.js is fast-moving and opinionated. This pack helps Claude use the App Router correctly, pick the right rendering strategy, and avoid the hydration and caching pitfalls that break production.
What you can do with this pack
- Build a new Next.js route correctly
- Pick server vs client component for a feature
- Debug hydration errors
- Configure caching and revalidation
- Add server actions without security issues
Skills in this pack
Next.js App Router Route Builder
Build a new App Router route with correct server/client split, data fetching, and metadata. Trigger on 'new Next.js route', 'add a page in Next', 'App Router page', 'create a route', or when the user wants to add a Next.js page.
Next.js Caching Strategist
Pick and implement the right caching and revalidation strategy for a Next.js route or fetch. Trigger on 'cache this', 'revalidate', 'ISR', 'static vs dynamic', 'stale data', or when the user is deciding between static, dynamic, or revalidated rendering.
Next.js Hydration Debugger
Diagnose and fix hydration mismatches and 'Text content did not match' errors. Trigger on 'hydration error', 'text content did not match', 'hydration mismatch', 'server-client mismatch', or when the user sees hydration warnings in console.
How to install the skills
- In Claude, turn on code execution under Settings → Capabilities.
- Download and unzip the pack above — you'll see one folder per skill.
- Go to Customize → Skills, click + Create skill, then Upload a skill.
- Zip each individual skill folder and upload it.
- Toggle the skill on. Claude will use it automatically when your request matches.
Full instructions: /download/claude-skills
FAQ
What is a Claude skill?
A Claude skill is a folder containing a SKILL.md file. It tells Claude when to trigger the skill and how to execute the task. Skills live inside your Claude account once uploaded.
Do these work on Free, Pro and Max plans?
Yes, as long as code execution is enabled. On Team and Enterprise plans, an admin needs to enable skills at the organisation level first.
Can I edit the skills?
Yes — the skills are plain markdown files. Open SKILL.md in any editor and change the description, steps, templates, or output format to match how you work.
Do I need all the skills in the pack?
No. Upload only the ones you'll use. Too many active skills makes Claude less precise about which one to pick.