Application de centre de commandement personnalisée pour OpenClaw : PWA React avec proxy WebSocket et Tailscale

Un utilisateur de Reddit (Weird_Night_2176) a partagé son application de centre de commandement personnalisée construite sur sa passerelle OpenClaw. L'application remplace leur précédente méthode de contrôle basée sur WhatsApp, limitée par le plafond de 50 messages/jour du bac à sable Twilio. La configuration tourne sur un appareil Jetson, servant une React PWA accessible partout via Tailscale.
Architecture et composants clés
- Proxy WebSocket : OpenClaw se lie uniquement à la boucle locale, donc le développeur a créé un serveur proxy Express léger qui fait le pont pour la connexion WebSocket. Cela permet au frontend React de communiquer avec la passerelle OpenClaw depuis n'importe quel appareil sur le maillage Tailscale.
- Frontend : Une application web progressive (PWA) React servie directement depuis le Jetson.
- Réseau : Maillage Tailscale pour un accès distant sécurisé ; l'application fonctionne sur iPhone via Tailscale.
Fonctionnalités du centre de commandement
- Interface de chat en direct : Chat direct avec l'agent IA "Bosefus".
- Tableau de bord des agents : Affiche 14 agents avec leur dernière tâche et leur statut.
- Poste de trading : Positions Alpaca en direct et P&L crypto.
- Historique des exécutions d'équipe : Chaque tâche automatisée est enregistrée par nom.
- Statut du modèle Ollama : Statut en direct depuis le serveur de modèles Orange Pi.
- Suivi du fonds de construction : Suivi des économies pour la prochaine mise à niveau matérielle.
- Notifications push : Remplace WhatsApp pour les alertes.
À qui cela s'adresse
Les développeurs qui utilisent OpenClaw comme passerelle d'agents IA et ont besoin d'une interface utilisateur dédiée au-delà de la ligne de commande ou des applications de messagerie tierces, surtout ceux avec plusieurs agents et des intégrations de trading.
Ressources
L'utilisateur a mentionné qu'un tutoriel complet de construction sera bientôt disponible sur YouTube. Pour l'instant, le post Reddit contient des détails sur l'architecture et la motivation.
📖 Lire la source complète : r/openclaw
👀 See Also

Structure de Code Claude Qui a Survécu à Plusieurs Projets Réels
Un développeur partage une configuration Claude Code qui a tenu le coup sur 2-3 projets réels avec plusieurs compétences, serveurs MCP et agents. Les principales conclusions incluent l'utilisation de CLAUDE MD pour la cohérence, la séparation des compétences par intention, la mise en œuvre de hooks, et le maintien de l'utilisation du contexte sous 60%.

Traiter les Sous-agents OpenClaw comme des Fonctions sans État plutôt que comme des Membres d'Équipe Persistants
Un développeur partage son expérience de passage d'une approche où les sous-agents OpenClaw étaient traités comme des membres d'équipe persistants avec des personnalités, à une vision où ils sont considérés comme des appels de fonction sans état avec des objectifs spécialisés.

Réduisez les coûts de tokens de 95 % avec les sept techniques d'optimisation d'OpenClaw
Un guide complet détaillant sept techniques pour réduire la consommation de tokens des agents IA de plus de 95%, notamment des fichiers de démarrage à structure arborescente, l'auto-compression par IA, le déchargement local de modèles et des tâches CPU planifiées via cron.

Comment importer votre historique ChatGPT dans Claude en utilisant les Projets
Exportez vos conversations ChatGPT sous forme de fichiers Markdown et chargez les plus pertinentes dans un projet Claude pour conserver des années de contexte, de projets en cours et de préférences stylistiques.