Codebase scan → implementation plan (uses codebase-analyzer agent)
OWASP security scan (uses security-auditor agent)
Turn .memory/ai/context.md → step-by-step implementation plan (uses implementation-planner agent)
Interactive requirements Q&A (uses requirements-analyst agent)
Library/tech research via context7 MCP (uses tech-research-planner agent)
Repo-wide scan and implementation plan without editing files. Walks codebase with Read/Grep/Glob and saves actionable plan.
Turns .memory/ai/context.md into concrete, stepwise implementation plan. No code reading or research, just structures the work.
Interactive Q&A to turn fuzzy ideas into clear, testable requirements. Asks questions, refines, saves structured requirements doc.
Proactively scans for security vulnerabilities. Reviews code and infrastructure configurations against common security risks like the OWASP Top 10.
Research best practices for a library/technology and create architectural plan without implementing code. Uses context7 MCP for research.
Write clean, efficient TypeScript code that follows common best practices
Write clean, modern, and highly accessible HTML & JSX code, using semantically correct elements and attributes
Build modern Next.js apps with App Router and best practices
Build clean, modern React components that apply common best practices and avoid common pitfalls like unnecessary state management or useEffect usage
Utilize built-in browser APIs (like Popover API, View Transitions etc) instead of building features manually via JavaScript
Uses power tools
Uses Bash, Write, or Edit tools
Runs pre-commands
Contains inline bash commands via ! syntax
Bash prerequisite issue
Uses bash pre-commands but Bash not in allowed tools
Own this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimBased on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
TS/React/Next.js dev agents, skills & commands for Claude Code.
claude plugin install github:mrpitch/mrp-nextjs
| Agent | Model | Purpose |
|---|---|---|
requirements-analyst | sonnet | Interactive Q&A → requirements spec |
implementation-planner | sonnet | context.md → step-by-step plan |
codebase-analyzer | haiku | Repo scan → implementation plan |
tech-research-planner | opus | Library/tech research via context7 |
security-auditor | — | OWASP Top 10 security scan |
| Command | Purpose |
|---|---|
/mrp-nextjs:analyze | Codebase scan → implementation plan |
/mrp-nextjs:requirements | Interactive requirements Q&A |
/mrp-nextjs:plan | Turn context.md → step-by-step plan |
/mrp-nextjs:research | Library/tech research via context7 |
/mrp-nextjs:audit | OWASP security scan |
/mrp-nextjs:research command.memory/ai/context.md for shared contextAgents share state through .memory/ai/context.md. Each agent appends a 3-line summary after completing its work, enabling chained workflows (e.g., requirements → plan → implement).
npx claudepluginhub mrpitch/mrp-claude-plugin --plugin mrp-nextjsUse this agent for expert assistance with web development tasks using React, Next.js, NestJS, and other modern web frameworks with TypeScript and Tailwind CSS. This includes code analysis, component creation, debugging, performance optimization, and architectural decisions. Examples: <example>Context: User is building a Next.js app and encounters a routing issue. user: 'My dynamic routes in Next.js are not rendering correctly' assistant: 'Let me use the web-dev agent to analyze your Next.js routing setup and provide a solution' <commentary>This is a Next.js-specific routing issue, so the web-dev agent will provide targeted guidance.</commentary></example> <example>Context: User needs a reusable React component with Tailwind CSS. user: 'I need a card component that matches my app's Tailwind-based design system' assistant: 'I'll use the web-dev agent to create a TypeScript-based React card component styled with Tailwind CSS, following your app's design patterns' <commentary>The user requires a component that aligns with their Tailwind CSS design system, so the web-dev agent ensures compatibility.</commentary></example>
Next.js development expertise with skills for App Router, Server Components, Route Handlers, Server Actions, and authentication patterns
Premium design patterns, UX research skills, and user journey mapping for modern web applications.
Advanced Next.js skills for App Router, Server Components, and data fetching.
Modern React and UI development expertise. Master React 19, Next.js 15, component architecture, state management, performance optimization, and design systems.
Access thousands of AI prompts and skills directly in your AI coding assistant. Search prompts, discover skills, save your own, and improve prompts with AI.