nextjs-expert

What's Inside:

• 11 Specialized Agents — Consolidated: architect, ui-expert, mobile-expert, game-developer, qa, security, devops
• 6 Bundled Commands — /workflow, /test, /project, /quality, /bugfix, /seo (each with submenus)
• 13 Auto-Invoking Skills — Agent detection, model routing, workflow, testing, SEO bundles
• 32 Reference Skills — Framework experts, SEO experts, loaded on-demand by bundles
• 6 MCP Servers — Context7, Playwright, Vitest, Firebase, Figma, Slack
• 50 Quality Rules — System, code quality, architecture, workflow, UI, SEO
• 9-Phase Workflow — From requirements to deployment with only 2 approval gates
• Model Routing — Auto-select Haiku/Sonnet/Opus for 30-50% cost savings
• Learning System — Self-improvement via local storage or Supabase

---

Prerequisites

• [Claude Code](https://docs.anthropic.com/en/docs/claude-code) — Install Anthropic's CLI first
• Git — Version control
• Node.js 18+ or your project's runtime

Installation

In Claude Code terminal:

```bash

# Step 1: Add Aura Frog Marketplace (one-time)

/plugin marketplace add nguyenthienthanh/aura-frog

# Step 2: Install Aura Frog Plugin

/plugin install aura-frog@aurafrog

# Step 3: Create local settings (required)

cd ~/.claude/plugins/marketplaces/aurafrog/aura-frog/

cp settings.example.json settings.local.json

```

Updating

```bash

# Update to latest version

/plugin marketplace update aurafrog

```

First Workflow

```bash

# Initialize your project (recommended)

project:init

# Start your first workflow

workflow:start "Implement user authentication"

```

Follow the Flow

At each phase, review and respond:

• approve or yes — Continue to next phase
• reject: — Restart current phase
• modify: — Adjust deliverables

See: [aura-frog/QUICKSTART.md](aura-frog/QUICKSTART.md) for quickstart | [aura-frog/GET_STARTED.md](aura-frog/GET_STARTED.md) for full guide

---

Aura Frog is a plugin for [Claude Code](https://docs.anthropic.com/en/docs/claude-code) (Anthropic's official CLI for Claude) that transforms it into a structured development platform with specialized agents, enforced TDD, and quality gates at every step.

> What is Claude Code? Claude Code is Anthropic's agentic coding tool that operates in your terminal, understands your codebase, and helps you code faster through natural conversation. Aura Frog extends Claude Code with structured workflows and specialized agents.

Why Aura Frog?

| Traditional Development | With Aura Frog |

|------------------------|----------------|

| Manual task management | AI-powered 9-phase workflow |

| Generic AI responses | 15 specialized agents auto-selected |

| Testing as afterthought | TDD enforced (RED → GREEN → REFACTOR) |

| Ad-hoc code review | Multi-agent cross-review built-in |

| Context switching | CLI-first with 82 commands |

| Manual documentation | Auto-generated docs |

| Manual integrations | Bundled MCP servers (Figma, Slack, etc.) |

Result: 60-70% reduction in PM overhead while improving code quality.

---

11 Specialized Agents (Consolidated in v1.17.0)

Agents auto-activate based on your prompt context. v1.17.0 consolidated 15 agents into 11 for better routing:

---

6 MCP Servers

MCP (Model Context Protocol) servers auto-invoke based on context:

| MCP Server | Purpose | Auto-Triggers | Setup |

|------------|---------|---------------|-------|

| context7 | Library documentation | "Build with MUI", library names | None |

| playwright | Browser automation, E2E | "Test the login page" | None |

| vitest | Test execution, coverage | "Run tests", "Check coverage" | None |

| firebase | Firebase services | "Set up Firestore", "Firebase Auth" | firebase login |

| figma | Design file fetching | Figma URLs | FIGMA_API_TOKEN |

| slack | Notifications | Phase 9 completion | SLACK_BOT_TOKEN |

MCPs requiring tokens will silently skip if not configured.

```bash

# Context7 auto-fetches React docs

"Build a form with Material UI"

# Firebase manages your project

"Set up Firestore for my app"

```

See: [aura-frog/docs/MCP_GUIDE.md](aura-frog/docs/MCP_GUIDE.md) for setup

---

Skills System (Optimized in v1.17.0)

Skills activate automatically based on your message context. v1.17.0 introduced skill bundles that lazy-load patterns on-demand:

```

User: "Implement user profile screen"

↓

Auto-invokes:

1. agent-detector → Selects mobile-expert + model

2. model-router → Picks Sonnet (standard task)

3. project-context-loader → Loads your conventions

4. workflow-orchestrator → Executes 9-phase workflow

```

13 Auto-Invoking Skills:

| Skill | Triggers | Purpose |

|-------|----------|---------|

| agent-detector | Every message | Select agent + complexity |

| model-router | After agent detection | Select Haiku/Sonnet/Opus |

| workflow-orchestrator | "implement", "build", "create" | 9-phase workflow |

| project-context-loader | Before code generation | Load conventions |

| framework-expert | Framework tasks | Lazy-load React/Vue/etc patterns |

| seo-bundle | SEO/GEO tasks | Lazy-load SEO patterns |

| testing-patterns | Test tasks | Universal testing patterns |

| bugfix-quick | "fix", "error", "broken" | Fast TDD bug fixes |

| test-writer | "add tests", "coverage" | Generate tests |

| code-reviewer