next-dev-loop

Official

Agent skill from vercel/next.js.

vercel ↓ 3.5k
Claude Code
View source ↗

What it does

  • /next/mcp — an HTTP endpoint Next.js exposes about itself.
  • agent-browser — a CLI that drives a real Chrome. Knows
  • Next.js 16.3+ with Turbopack — /next/mcp plus the
  • agent-browser >= 0.31.1 — React introspection, worktree-scoped
  • Upgrade Next.js: pnpm next upgrade (or npx next upgrade).
  • Install or upgrade agent-browser: npm i -g agent-browser@latest.
  • Unreachable → either next dev isn't running, or Next.js is

Requirements & configuration

  • geterrors and getpagemetadata need at least one navigation
  • geterrors runtime + build; needs a browser session;
  • getpagemetadata segment trie + routerType; needs a browser

Configuration: PATHSESSIONAGENT_BROWSER_SESSIONAGENT_BROWSER_RESTORENEXT_MCP_URL

Derived from the skill's own SKILL.md documentation · extracted 2026-07-23

next-dev-loop FAQ

What does the next-dev-loop skill do?

> Verify Next.js runtime behavior after editing app code. Use this skill to confirm a change actually works in a running app — not just that it compiles or type-checks. Combines /_next/mcp (Next.js's view) with agent-browser (the browser's view). Requires a running `next dev`. /next/mcp — an HTTP endpoint Next.js exposes about itself. agent-browser — a CLI that drives a real Chrome. Knows

What does next-dev-loop require?

geterrors and getpagemetadata need at least one navigation geterrors runtime + build; needs a browser session; getpagemetadata segment trie + routerType; needs a browser Configuration keys: PATH, SESSION, AGENT_BROWSER_SESSION, AGENT_BROWSER_RESTORE, NEXT_MCP_URL.

How do I install next-dev-loop?

Run: npx -y skills add https://github.com/vercel/next.js --skill next-dev-loop --agent claude-code — the source lives at github.com/vercel/next.js.

Maintain next-dev-loop?

Let people know it's listed here — add the badge (live metrics, light/dark aware) or a plain link to your README or docs.

next-dev-loop on getagentictools
[![next-dev-loop on getagentictools](https://getagentictools.com/badge/skills/vercel-next-js-next-dev-loop.svg)](https://getagentictools.com/skills/vercel-next-js-next-dev-loop?ref=badge)
npx agentictools info skills/vercel-next-js-next-dev-loop

The second line is the CLI lookup for this page — handy in READMEs and docs.