Frontend spec-driven development for Flutter, Next.js, and React Native.

SpecDrive is an open-source, AI-agnostic framework that generates Kiro-style specifications — requirements.md → gap-analysis.md → design.md → tasks.md — focused on UI/UX implementation, not backend APIs.

Backend SDD already has OpenAPI, GitHub Spec Kit, and similar tools. Frontend developers lack an equivalent — a structured way to go from feature idea → UI design spec → implementation tasks, with AI assistance and persistent project knowledge.

Feature idea  →  requirements.md  →  gap-analysis.md  →  design.md  →  tasks.md  →  Implement  →  Review
                    (EARS)           (codebase gaps)      (UI/UX)        (frontend tasks)
                 approve ✓         approve ✓            approve ✓        approve ✓

design.md drives UI/UX — screens, components, navigation, state, accessibility, platform behavior.

Works with Cursor, Claude Code, Codex CLI, Gemini, Windsurf, Cline, Roo, Continue — via MCP or CLI.

.specdrive/
├── product.md              # Product steering
├── tech-stack.md           # Stack steering
├── structure.md            # Architecture steering
├── coding-style.md         # Conventions steering
└── specs/
    └── product-review/
        ├── requirements.md # User stories + EARS acceptance criteria
        ├── gap-analysis.md # Requirements vs existing codebase gaps
        ├── design.md       # UI/UX blueprint (screens, components, flows)
        └── tasks.md        # Sequenced implementation tasks

# In your frontend app (recommended: MCP-first)
npm install -g @specdrive/cli
cd your-flutter-app
spec setup mcp --stack flutter
# Reload MCP in Cursor/Claude → call tool: search_specs

# Optional: CLI with free LLM
export GEMINI_API_KEY=your-key
spec create "Product Review Screen"
spec gap-analysis --spec product-review-screen

See packages/mcp/README.md for universal MCP setup (Cursor, Claude, Windsurf, Cline, …).

CLI free LLM priority: Gemini → Groq → Ollama → template fallback.

export GEMINI_API_KEY=your-key   # free tier at https://aistudio.google.com
spec create "Checkout flow"
spec gap-analysis --spec checkout-flow

# MCP server (for Cursor / Claude) — uses host AI, not SpecDrive LLM
node packages/mcp/bin/mcp.js

# Review against design.md
spec review --spec product-review-screen --ci

See packages/mcp/README.md for Cursor MCP setup.

Docs site: https://anu-code07.github.io/spec-copilot/

404? Enable Pages once: docs/GITHUB-PAGES-SETUP.md → Settings → Pages → branch main, folder /docs

SpecDrive is ready for real project use when built from source. npm publish is the remaining step for npx install.

# Verify before release
pnpm install && pnpm build
pnpm test
pnpm smoke
pnpm release-check

See CHANGELOG.md for version history.

MIT