Aplicativo Personalizado de Centro de Comando para OpenClaw: PWA React com Proxy WebSocket e Tailscale

✍️ OpenClawRadar📅 Publicado: May 12, 2026🔗 Source
Aplicativo Personalizado de Centro de Comando para OpenClaw: PWA React com Proxy WebSocket e Tailscale
Ad

Um usuário do Reddit (Weird_Night_2176) compartilhou seu aplicativo personalizado de centro de comando construído sobre seu gateway OpenClaw. O aplicativo substitui seu método de controle anterior baseado no WhatsApp, que era limitado pelo limite de 50 mensagens/dia do sandbox do Twilio. A configuração roda em um dispositivo Jetson, servindo um React PWA acessível de qualquer lugar via Tailscale.

Arquitetura e Componentes Principais

  • Proxy WebSocket: O OpenClaw vincula apenas ao loopback, então o desenvolvedor criou um servidor proxy Express leve que faz a ponte da conexão WebSocket. Isso permite que o frontend React se comunique com o gateway OpenClaw de qualquer dispositivo na malha Tailscale.
  • Frontend: Um Progressive Web App (PWA) React servido diretamente do Jetson.
  • Rede: Malha Tailscale para acesso remoto seguro; o aplicativo funciona no iPhone via Tailscale.
Ad

Funcionalidades do Centro de Comando

  • Interface de Chat ao Vivo: Chat direto com o agente de IA "Bosefus".
  • Painel de Agentes: Mostra 14 agentes com sua última tarefa e status.
  • Mesa de Negociações: Posições Alpaca ao vivo e P&L de criptomoedas.
  • Histórico de Execuções da Equipe: Cada trabalho automatizado registrado por nome.
  • Status do Modelo Ollama: Status ao vivo do servidor de modelos Orange Pi.
  • Rastreador de Fundos de Construção: Acompanha as economias para a próxima atualização de hardware.
  • Notificações Push: Substitui o WhatsApp para alertas.

Para Quem é Isso

Desenvolvedores que executam o OpenClaw como um gateway de agente de IA e precisam de uma UI dedicada, além da linha de comando ou aplicativos de mensagens de terceiros, especialmente aqueles com múltiplos agentes e integrações de negociação.

Recursos

O usuário mencionou que um tutorial completo de construção será lançado no YouTube. Por enquanto, o post no Reddit tem detalhes sobre a arquitetura e motivação.

📖 Read the full source: r/openclaw

Ad

👀 See Also

Lista de Verificação de Triagem de Desempenho do OpenClaw CLI
Guides

Lista de Verificação de Triagem de Desempenho do OpenClaw CLI

Um usuário do Reddit compartilha uma lista de verificação de seis etapas para diagnosticar comandos lentos do CLI do OpenClaw, incluindo comandos para medir latência, monitorar recursos do sistema, verificar logs do gateway e isolar problemas de configuração.

OpenClawRadar
Padrões de Falhas do OpenClaw: 42 Incidentes Reais em 28 Dias
Guides

Padrões de Falhas do OpenClaw: 42 Incidentes Reais em 28 Dias

Um desenvolvedor que executou o OpenClaw diariamente documentou 42 falhas específicas em oito categorias, incluindo alucinações de IA, falhas de autenticação e automações que custam mais tempo do que economizam. A fonte fornece exemplos concretos como a expiração de tokens OAuth do Google em 7 dias e o Opus 4.6 adicionando metadados indesejados aos arquivos.

OpenClawRadar
De 88 a 100 PSI: Claude Code para Optimização Front-End
Guides

De 88 a 100 PSI: Claude Code para Optimização Front-End

Um desenvolvedor usou o Claude Code para aumentar o PageSpeed Insights de 88 para 100 no mobile. Táticas-chave: imagens responsivas com srcset, IntersectionObserver, remoção de pré-carregamento de fontes. O Claude atuou como um parceiro de depuração, não como uma correção de um prompt.

OpenClawRadar
Claude Code Cheat Sheet com 140 Dicas e Arquivo LLMs.txt
Guides

Claude Code Cheat Sheet com 140 Dicas e Arquivo LLMs.txt

Um repositório do GitHub contém uma folha de dicas do Claude Code com 140 dicas organizadas em 14 seções, marcadas por dificuldade. O repositório inclui um arquivo llms.txt que pode ser alimentado diretamente ao Claude para aprender ou aplicar as dicas.

OpenClawRadar