Spec Workflow MCP

A Model Context Protocol (MCP) server for structured spec-driven development with real-time dashboard and VSCode extension.

☕ Support This Project

Related MCP server: Magic Component Platform

📺 Showcase

🔄 Approval System in Action

See how the approval system works: create documents, request approval through the dashboard, provide feedback, and track revisions.

📊 Dashboard & Spec Management

Explore the real-time dashboard: view specs, track progress, navigate documents, and monitor your development workflow.

✨ Key Features

• Structured Development Workflow - Sequential spec creation (Requirements → Design → Tasks)

• Real-Time Web Dashboard - Monitor specs, tasks, and progress with live updates

• VSCode Extension - Integrated sidebar dashboard for VSCode users

• Approval Workflow - Complete approval process with revisions

• Task Progress Tracking - Visual progress bars and detailed status

• Implementation Logs - Searchable logs of all task implementations with code statistics

• Multi-Language Support - Available in 11 languages

🌍 Supported Languages

🇺🇸 English • 🇯🇵 日本語 • 🇨🇳 中文 • 🇪🇸 Español • 🇧🇷 Português • 🇩🇪 Deutsch • 🇫🇷 Français • 🇷🇺 Русский • 🇮🇹 Italiano • 🇰🇷 한국어 • 🇸🇦 العربية

📖 Documentation in your language:

English | 日本語 | 中文 | Español | Português | Deutsch | Français | Русский | Italiano | 한국어 | العربية

🚀 Quick Start

Step 1: Add to your AI tool

Add to your MCP configuration (see client-specific setup below):

Step 2: Choose your interface

Option A: Web Dashboard (Required for CLI users) Start the dashboard (runs on port 5000 by default):

The dashboard will be accessible at: http://localhost:5000

Note: Only one dashboard instance is needed. All your projects will connect to the same dashboard.

Option B: VSCode Extension (Recommended for VSCode users)

Install Spec Workflow MCP Extension from the VSCode marketplace.

📝 How to Use

Simply mention spec-workflow in your conversation:

• "Create a spec for user authentication" - Creates complete spec workflow

• "List my specs" - Shows all specs and their status

• "Execute task 1.2 in spec user-auth" - Runs a specific task

See more examples →

🔧 MCP Client Setup

Configure in your Augment settings:

Add to your MCP configuration:

Important Notes:

• The -y flag bypasses npm prompts for smoother installation

• The -- separator ensures the path is passed to the spec-workflow script, not to npx

• Replace /path/to/your/project with your actual project directory path

Alternative for Windows (if the above doesn't work):

Add to claude_desktop_config.json:

Important: Run the dashboard separately with --dashboard before starting the MCP server.

Add to your MCP server configuration:

Add to your Continue configuration:

Add to your Cursor settings (settings.json):

Add to your opencode.json configuration file:

Add to your ~/.codeium/windsurf/mcp_config.json configuration file:

Add to your ~/.codex/config.toml configuration file:

🐳 Docker Deployment

Run the dashboard in a Docker container for isolated deployment:

The dashboard will be available at: http://localhost:5000

See Docker setup guide →

🔒 Sandboxed Environments

For sandboxed environments (e.g., Codex CLI with sandbox_mode=workspace-write) where $HOME is read-only, use the SPEC_WORKFLOW_HOME environment variable to redirect global state files to a writable location:

See Configuration Guide →

📚 Documentation

• Configuration Guide - Command-line options, config files

• User Guide - Comprehensive usage examples

• Workflow Process - Development workflow and best practices

• Interfaces Guide - Dashboard and VSCode extension details

• Prompting Guide - Advanced prompting examples

• Tools Reference - Complete tools documentation

• Development - Contributing and development setup

• Troubleshooting - Common issues and solutions

📁 Project Structure

🛠️ Development

See development guide →

📄 License

GPL-3.0

⭐ Star History