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:

```bash
npx devall
```

### Global Installation (Optional) - not a great idea

```bash
npm install -g devall
```

## Quick Start

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

```jsonc
{
  // 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
    }
  ]
}
```

2. Start the dashboard:

```bash
npx devall
```

Or if installed globally:

```bash
devall
```

3. 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)

```jsonc
{
  "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:

```jsonc
{
  "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)**

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

**Option 2: Using absolute path (if installed locally)**

```json
{
  "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`:

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

Or for Roo-Cline:

```json
{
  "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:**

```bash
# Get the config for Claude Desktop
npx devall mcp info
```

**VS Code:**

```bash
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:

1. Call `startService` with your api service
2. Call `getServiceLogs` to fetch recent logs
3. 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

```bash
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:

```bash
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](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
