Tools

Builds multi-component web pages that need state or routing with React, Tailwind CSS and shadcn/ui, using bundled init and build scripts, then packs them into a single HTML file for a claude.ai Artifact. Official Anthropic skill.

Drives a Next.js route to instant navigation under Cache Components: writes a failing @next/playwright instant() e2e test, pushes Suspense boundaries down to grow the static shell until it passes, and keeps the test as a regression guard. Requires Next.js 16.3+ with cacheComponents.

Official Next.js plugin shipped in the vercel/next.js repo: guides enabling and tuning Cache Components and Partial Prefetching, and verifies changes on a running dev server with the Next.js MCP and agent-browser.

Official shadcn/ui skill: uses the shadcn CLI to read project config and component docs, then adds, searches, composes and fixes components following styling, form and accessibility rules. Can also start new projects from presets.

Official shadcn/ui CLI: initializes projects and adds component source to your codebase on demand, with switchable presets. Since v4 it offers --dry-run and --diff so agents can preview changes, and it comes with an agent skill.

MCP server built into the official shadcn CLI: lets agents browse and search components, blocks and templates in any configured registry, including private ones, and install them into your project in plain language. The project needs a components.json.

Vercel's guide to React composition patterns: replaces boolean prop sprawl with compound components, lifted state and clean Context interfaces, including React 19 API changes. Useful for refactoring component libraries and reviewing component architecture.

React and Next.js performance rules from Vercel's engineering team: 70 rules ranked by impact covering request waterfalls, bundle size, server performance and re-renders, for writing, reviewing and refactoring. Maintained by Vercel.

Runs React Doctor via npx to scan React code for security, performance, correctness, accessibility and architecture issues with a 0-100 health score; checks changed code for regressions, and on /doctor fetches the official triage playbook to fix issues.

Audits a whole React codebase read-only: runs a React Doctor scan as evidence, vets findings across bugs, performance, accessibility, security and maintainability, ranks them by leverage, then writes self-contained plans other agents can execute. Never edits source.

Bundles 60+ full-stack specialist skills into one plugin: experts for 12 languages including Python, TypeScript, Go, Rust and Java, and frameworks like React, Django and Spring Boot, activated automatically by request. Also includes Jira and Confluence workflow commands (needs Atlassian MCP).

General Translation's gt CLI: a wizard sets up i18n for React, Next.js and similar apps, then sends UI strings and JSON, YAML or Markdown files for AI translation and writes them back, with CI support. Needs a Node.js project and a General Translation API key (free sign-up, usage-based pricing).