Next.js skills plugin
Official Claude Code plugin from the Next.js repo: adopting Cache Components and Partial Prefetching, and verifying changes on a running dev server
- 143,196 ★ on the repository
- Last commit
- MIT
Extended access
Why this level
- Edits project code and runs codemods
- Starts a dev server and drives a browser
Install
- Works in
In your terminal, with SkillFoxx CLI
npx skillfoxx add plugins/next-js-skillsDetects the agents on your machine, shows the access level and pins the version.
Other ways to install
Access and checks
How we reviewExtended accessThe tool runs code or makes network calls and only reads external data.
- Edits project code and runs codemods
- Starts a dev server and drives a browser
This is third-party code. Review the repository files before installing.
What it does
The nextjs plugin packages the skills from the skills folder of the Next.js repo. next-cache-components-adoption and next-cache-components-optimizer walk the agent through enabling Cache Components and fixing blocking routes, including the cache-components-instant-false codemod. next-partial-prefetching-adoption and next-partial-prefetching-optimizer do the same for Partial Prefetching. next-dev-loop verifies an edit in the running app by cross-checking the /_next/mcp endpoint against a browser driven by agent-browser.
Who it is for. For frontend developers moving a Next.js app to the new caching and prefetching model.
Good fit when
- You need to enable cacheComponents and get the build passing
- You want to adopt Partial Prefetching in the App Router
- You need to confirm an edit works in next dev, not just compiles
Not a fit when
- The project uses the Pages Router without an app folder
- Next.js is below 16.3 and cannot be upgraded yet
Example request
Enable Cache Components in this project and fix the routes that block the buildLimitations
The skills need Next.js 16.3+ with Turbopack and the App Router; next-dev-loop also needs agent-browser 0.31.1+. The app must run locally with a working environment. The repo README does not mention the plugin; install commands follow from the .claude-plugin/marketplace.json manifest.
How to disable. Uninstall the nextjs plugin via /plugin.
FAQ
Are these the skills in .agents/skills?
No. .agents/skills holds instructions for Next.js contributors; the plugin ships only the user-facing skills from the skills folder.
Will the skill change my code?
Yes, migration skills edit files and run codemods, so work on a separate branch.
Discussion
No questions or reviews yet.
Related
PluginsSkill and MCP server for Shaders: the agent builds backgrounds, glass, gradients and cursor effects on WebGPU for React, Vue, Svelte, Solid and JS
A Claude Code plugin and skill marketplace for 3D, animation and modern web: Three.js, GSAP, React Three Fiber, Babylon.js
Vercel skills for agents
Agent Skills
Vercel skills: React and Next.js performance, UI checks by guidelines, React Native, component composition, and deployment
A skill methodology for reproducing websites, from a static page to heavy WebGL, built on real source code rather than agent-hallucinated code
Connects an agent to a running Next.js 16+ dev server: errors, routes, logs and docs for your installed version
Four official Material UI skills: styling, theming, Next.js integration and working alongside Tailwind CSS
README in short
The main README covers the framework and docs and does not mention skills. The nextjs marketplace is declared in .claude-plugin/marketplace.json and points to the skills folder with a plugin.json holding the description, MIT license and keywords. Each SKILL.md starts with version and project requirements and then lays out the workflow.