devall

Early preview version

One dashboard. All your services.

npx devall

A lightweight, real-time development dashboard for managing and monitoring multiple development services from a single interface.

Features

• Service Management: Start, stop, and restart all your development services from one interface
• Real-time Monitoring: Live status updates and log streaming via WebSocket
• Project Switching: Quickly jump between projects and spin up all their services instantly
• Quick Commands: Access commonly used commands for each repository right from the dashboard
• Direct IDE/Git Integration: Open projects in VS Code or your Git client with one click
• MCP Integration: Control DevAll via AI assistants (Claude, Cline) through Model Context Protocol
• Ngrok Tunneling: Expose local services to the internet with built-in ngrok support
• Configuration-based: Simple JSONC configuration (JSON with comments!)
• Cross-platform: Works on macOS, Linux, and Windows

Use Cases

Multi-Service Development

Working on a full-stack app with frontend, backend, database, and workers? Start them all with one command and monitor everything in real-time. No more juggling terminal tabs.

Monorepo Management

Managing multiple packages in a monorepo? DevAll is a monorepo's best friend. Commit your devall.jsonc to the repository so the entire team has everything ready to go, or keep personal configs in devall.local.jsonc for your specific setup.

Context Switching

Jump between client projects throughout the day? Save a DevAll config for each project and switch contexts instantly—all services start with one command.

Team Onboarding

New developer joining the team? Share your DevAll config and they'll have the entire development environment running in seconds, no documentation hunting required.

Quick Access to Tools

Need to run migrations, clear cache, or execute common commands? Add them to your config and access them directly from the dashboard instead of searching through terminal history.

Installation

Using npx (Recommended)

Always use the latest version without global installation:

npx devall

Global Installation (Optional) - not a great idea

npm install -g devall

Quick Start

• Create a devall.jsonc configuration file in your project root (supports JSONC with comments!):

{
  // DevAll uses JSONC format, allowing helpful comments in your configuration
  "servers": [
    {
      "id": "api",
      "name": "Backend API",
      "command": "npm",
      "args": ["run", "dev:api"],
      "port": 3000,
      "autostart": true
    },
    {
      "id": "frontend",
      "name": "Frontend",
      "command": "npm",
      "args": ["run", "dev:frontend"],
      "port": 5173, // Vite default port
      "autoOpen": true // Open in browser when ready
    },
    {
      "id": "db",
      "name": "Database",
      "command": "docker-compose",
      "args": ["up", "db"],
      "port": 5432
    },

    // Monorepo packages
    {
      "id": "admin",
      "name": "Admin Dashboard",
      "command": "npm",
      "args": ["run", "dev"],
      "cwd": "./packages/admin", // Run from subfolder
      "port": 3001,
      "color": "#c586c0"
    },

    // External dependencies
    {
      "id": "shared",
      "name": "Shared Components",
      "command": "npm",
      "args": ["run", "build:watch"],
      "cwd": "../shared-ui", // Parent directory
      "watchFiles": false // Don't auto-restart build tasks
    },

    // Microservices
    {
      "id": "gateway",
      "name": "API Gateway",
      "command": "yarn",
      "args": ["start:dev"],
      "cwd": "./services/gateway",
      "port": 8080,
      "secondary": true // Optional service
    }
  ]
}

• Start the dashboard:

npx devall

Or if installed globally:

devall

• Open your browser at http://localhost:7777 to view the dashboard

Configuration

Why JSONC?

DevAll uses JSONC (JSON with Comments) format for configuration files, which provides:

• Inline comments to document service purposes and configurations
• Better team collaboration with explanatory notes
• Easier maintenance by commenting out services temporarily
• Configuration documentation right where you need it

Configuration Structure

The configuration file supports two main sections:

Dashboard Configuration (Optional)

{
  "dashboard": {
    "port": 7777, // Dashboard UI port (default: 7777)
    "openBrowser": true // Auto-open dashboard on start
  }
}

Service Configuration Properties

The servers array contains service definitions with these properties:

Property	Type	Required	Description	Example
id	string	✅	Unique identifier for the service	"api"
name	string	✅	Display name in the dashboard	"Backend API"
command	string	✅	Command to execute	"npm"
args	array	❌	Command arguments	["run", "dev"]
cwd	string	❌	Working directory (relative or absolute)	"./packages/api"
port	number	❌	Port to monitor and set as PORT env var	3000
color	string	❌	Hex color for dashboard UI	"#569cd6"
icon	string	❌	Icon name for dashboard (if icons configured)	"Server"
autostart	boolean	❌	Start automatically when dashboard launches	true
autoOpen	boolean	❌	Open in browser when service starts	false
watchFiles	boolean	❌	Auto-restart on file changes (default: true)	true
secondary	boolean	❌	Mark as secondary/optional service	false

Icons Configuration (Optional)

Map service types to icon names:

{
  "icons": {
    "web": "Globe",
    "api": "Server",
    "worker": "Cog",
    "frontend": "Layout",
    "database": "Database"
  }
}

MCP Server (AI Integration)

DevAll includes an MCP (Model Context Protocol) server that lets you control your services through AI assistants like Claude Desktop, VS Code with Cline/Roo-Cline, and other MCP-compatible tools.

The MCP server comes pre-built with DevAll - no additional setup needed! Just configure your AI assistant to use it.

Available Tools

All 16 DevAll commands are automatically available as MCP tools:

• Service control: startService, stopService, restartService
• Status & info: getStatus, listServices, getServiceInfo
• Logs: getServiceLogs, getServiceErrors
• Health monitoring: getServiceHealth, getPorts, getProcesses
• Configuration: getConfig, validateConfig
• Tunneling: exposeService, unexposeService, getTunnelStatus

Installation for Claude Desktop

Open your Claude Desktop config file:

• macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
• Windows: %APPDATA%\Claude\claude_desktop_config.json

Add the DevAll MCP server:

Option 1: Using npx (recommended - works from any directory)

{
  "mcpServers": {
    "devall": {
      "command": "npx",
      "args": ["devall", "mcp", "start"]
    }
  }
}

Option 2: Using absolute path (if installed locally)

{
  "mcpServers": {
    "devall": {
      "command": "node",
      "args": ["/absolute/path/to/node_modules/devall/mcp/bin/index.js"]
    }
  }
}

Then restart Claude Desktop. The DevAll tools will now appear in Claude's MCP tools list.

Installation for VS Code (Cline/Roo-Cline)

Open VS Code settings and search for "MCP" or edit your settings.json:

{
  "cline.mcpServers": {
    "devall": {
      "command": "npx",
      "args": ["devall", "mcp", "start"]
    }
  }
}

Or for Roo-Cline:

{
  "roo-cline.mcpServers": {
    "devall": {
      "command": "npx",
      "args": ["devall", "mcp", "start"]
    }
  }
}

Then reload VS Code: Press Cmd+Shift+P (Mac) or Ctrl+Shift+P (Windows/Linux) and run "Developer: Reload Window"

Alternative: Add via CLI

Claude Desktop:

# Get the config for Claude Desktop
npx devall mcp info

VS Code:

code --add-mcp '{"name":"devall","command":"npx","args":["devall","mcp","start"]}'

Usage Example

Once configured, you can ask your AI assistant:

"Start my api service and show me its logs"

The AI will:

• Call startService with your api service
• Call getServiceLogs to fetch recent logs
• Present the information in a readable format

More examples:

• "What services are currently running?"
• "Show me the last 50 error logs from the frontend service"
• "Restart all services"
• "Check the health status of all my services"
• "Expose my api service via ngrok"

MCP Management Commands

npx devall mcp info     # Show status and setup instructions
npx devall mcp setup    # Install dependencies and build (one-time)
npx devall mcp install  # Install dependencies only
npx devall mcp build    # Build the server only
npx devall mcp start    # Start server (stdio mode)
npx devall mcp start --sse --port 3001  # Start SSE server for web clients

For Development / Local Repository

If you're working with a cloned repository (not the published npm package), you need to build the MCP server first:

npx devall mcp setup

This is only needed once during development.

Troubleshooting

Server not appearing in AI tools:

• Verify config file location and syntax
• Restart your AI application completely
• Check server status: npx devall mcp info

Connection errors:

• Ensure DevAll dashboard is running: npx devall
• Check server URL (default: http://localhost:7777)

See mcp/README.md for full documentation and advanced configuration.

Contributing

Want to add features, report bugs, or request new functionality? Feel free to reach out or open an issue on the repository!

License

MIT