DevServer MCP

Gerencia servidores de desenvolvimento para fluxos de trabalho assistidos por LLM, oferecendo controle programático através de

GitHub

Experimente este MCPPatrocinado

Documentação

DevServer MCP

Um servidor Model Context Protocol (MCP) que gerencia servidores de desenvolvimento para fluxos de trabalho assistidos por LLM. Fornece controle programático sobre múltiplos servidores de desenvolvimento através de uma interface unificada com um TUI simples, além de automação de navegador experimental via Playwright.

Você também pode ligar e desligar os servidores clicando através do TUI.

Screenshot

Status do Projeto

Este é tanto um software ALPHA quanto um exercício de vibe coding; a maior parte deste código foi escrita com a ajuda de ferramentas de LLM.

Os testes validam parte da funcionalidade e o servidor já é útil se você precisar da funcionalidade, mas YMMV.

Recursos

🚀 Gerenciamento de Processos: Inicie, pare e monitore múltiplos servidores de desenvolvimento
📊 TUI Rico: Interface de terminal interativa com streaming de logs em tempo real
🌐 Automação de Navegador: Integração experimental com Playwright para testes e automação web
🔧 Integração com LLM: Suporte completo ao protocolo MCP para fluxos de trabalho de desenvolvimento assistidos por IA

Instalação

uv add --dev git+https://github.com/Uninen/devserver-mcp.git --tag v0.6.0

Playwright (Opcional)

Se você quiser usar os recursos experimentais de automação de navegador do Playwright, você deve instalar o Playwright manualmente:

# Install Playwright
uv add playwright

# Install browser drivers
playwright install

Início Rápido

Crie um arquivo devservers.yml na raiz do seu projeto:

servers:
  backend:
    command: 'python manage.py runserver'
    working_dir: '.'
    port: 8000

  frontend:
    command: 'npm run dev'
    working_dir: './frontend'
    port: 3000
    autostart: true

  worker:
    command: 'celery -A myproject worker -l info'
    working_dir: '.'
    port: 5555
    prefix_logs: false

# Optional: Enable experimental Playwright browser automation
experimental:
  playwright: true

Configuração

VS Code

Adicione a .vscode/mcp.json:

{
  "servers": {
    "devserver": {
      "url": "http://localhost:3001/mcp/",
      "type": "http"
    }
  }
}

Em seguida, execute o TUI em um terminal separado: devservers

Claude Code

Instale o servidor localmente:

claude mcp add --transport http devservers http://localhost:3001/mcp/

..ou para um projeto (o que o salva em um .mcp.json no projeto):

claude mcp add -s project --transport http devservers http://localhost:3001/mcp/

Em seguida, execute o TUI em um terminal separado: devservers

Gemini CLI

Adicione a configuração do servidor em settings.json (~/.gemini/settings.json globalmente ou .gemini/settings.json por projeto, veja a documentação):

...
  "mcpServers": {
    "devservers": {
      "httpUrl": "http://localhost:3001/mcp",
      "timeout": 5000,
      "trust": true
    }
  },
...

Em seguida, execute o TUI em um terminal separado: devservers

Zed

O Zed ainda não suporta servidores MCP remotos nativamente, então você precisa usar um proxy como mcp-proxy.

Você pode usar a interface em Assistant Setting -> Context Server -> Add Custom Server, e adicionar o nome "Devservers" e o comando uvx mcp-proxy --transport streamablehttp http://localhost:3001/mcp/, ou, você pode adicionar isso manualmente à configuração do Zed:

  "context_servers": {
    "devservers": {
      "command": {
        "path": "uvx",
        "args": ["mcp-proxy", "--transport", "streamablehttp", "http://localhost:3001/mcp/"]
      }
    }
  },

Em seguida, execute o TUI em um terminal separado: devservers

Uso

Executando o TUI do Servidor MCP

Inicie o TUI no terminal:

devservers

Agora você pode observar e controlar os devservers e ver os logs enquanto também dá aos LLMs acesso total aos servidores e seus logs.

Ferramentas MCP Disponíveis

O servidor expõe as seguintes ferramentas para interação com LLM:

Gerenciamento de Servidores

start_server(name) - Inicia um servidor configurado
stop_server(name) - Para um servidor (gerenciado ou externo)
get_devserver_statuses() - Obtém todos os status dos servidores
get_devserver_logs(name, offset, limit, reverse) - Obtém logs com suporte a paginação
- offset: Posição inicial (padrão: 0, valores negativos contam a partir do final)
- limit: Máximo de logs a retornar (padrão: 100)
- reverse: True para mais recentes primeiro, False para mais antigos primeiro (padrão: True)

Automação de Navegador (Experimental)

Quando experimental.playwright está definido na configuração:

browser_navigate(url, wait_until) - Navega o navegador para uma URL com condições de espera
browser_snapshot() - Captura um snapshot de acessibilidade da página atual
browser_console_messages(clear, offset, limit, reverse) - Obtém mensagens do console com paginação
- clear: Limpa mensagens após a recuperação (padrão: False)
- offset: Posição inicial (padrão: 0, valores negativos contam a partir do final)
- limit: Máximo de mensagens a retornar (padrão: 100)
- reverse: True para mais recentes primeiro, False para mais antigos primeiro (padrão: True)
browser_click(ref) - Clica em um elemento na página usando um seletor CSS ou referência de elemento
browser_type(ref, text, submit, slowly) - Digita texto em um elemento com envio opcional (tecla Enter) e modo de digitação lenta
browser_resize(width, height) - Redimensiona a janela de visualização do navegador para as dimensões especificadas
browser_screenshot(full_page, name) - Tira uma captura de tela da página atual
- full_page: Captura a página inteira em vez da janela de visualização (padrão: False)
- name: Nome de arquivo opcional para a captura de tela (padrão: nome com timestamp)

Desenvolvimento

Usando o MCP Inspector

Inicie o servidor: devservers
Inicie o MCP Inspector: npx @modelcontextprotocol/inspector http://localhost:3001

Scripting do MCP Inspector

Inicie o servidor: devservers
Use o MCP Inspector no modo CLI, por exemplo: npx @modelcontextprotocol/inspector --cli http://localhost:3001 --method tools/call --tool-name start_server --tool-arg name=frontend

Em Outros Lugares

Siga unessa.net on Bluesky ou @uninen on Twitter
Leia meus aprendizados em constante atualização sobre Vite / Vue / TypeScript e outros tópicos de desenvolvimento web no meu site Today I Learned

Contribuindo

Contribuições são bem-vindas! Por favor, siga o código de conduta ao interagir com outras pessoas.