The Problem
You install OpenClaw, configure it, and let it run in the background. But how do you actually know it's working?
There's no built-in status page. No heartbeat alerts. No way to see if it's processing tasks or just sitting idle.
The Solution
I built a simple, self-hostable monitoring dashboard for OpenClaw agents:
Tech Stack:
- Frontend: Vue 3 (Composition API) + Element Plus + Vite
- Backend: Express + SQLite (sql.js)
- Auth: JWT
- i18n: Chinese + English
Features
- 💓 Heartbeat Detection — Knows immediately when your agent goes down
- 🌐 Gateway Management — Manage multiple gateway configs from one UI
- 📊 Real-time Status — Live view of agent operations
- 🔐 JWT Authentication — Secure access for your monitoring layer
- 🌍 i18n — Switch between EN/CN
- 📱 Responsive — Works on desktop and mobile
Quick Start
git clone https://github.com/flik2002/openclaw-monitor-frontend.git
cd openclaw-monitor-frontend
npm install
npm run dev
Why "AI Monitoring AI"?
OpenClaw is fantastic at automating tasks. But in production, you need observability — the same as any other service. This is a small step toward treating AI agents like real infrastructure.
Contributing
Still early stage. Issues, stars, and PRs all welcome.