DEV Community

Alexey Kurilov
Alexey Kurilov

Posted on

I Built a Self-Hosted Web UI for 11 Databases — Here's Why You Might Want One Too

#devops #database #qa #developer

👋 The Problem

If you work with microservices in Kubernetes, you know the pain:

  • Your app uses PostgreSQL for transactions, Redis for cache, Kafka for events, and MongoDB for documents.
  • To debug a production issue, you open: psql, redis-cli, kcat, mongosh, maybe curl for Elasticsearch...
  • You copy-paste IDs between terminals. You forget which environment you're in. You accidentally run DROP on staging.

I've been there. So I built Panopticum — a lightweight, self-hosted web UI that lets you browse, query, and edit data across 11+ database types from a single interface. No Electron, no heavy desktop app, no CDN dependencies.

🛠ī¸ Why Another Database Tool?

Existing tools are great, but they didn't fit my workflow:

Tool Gap I Felt
DBeaver / DataGrip Desktop-only, heavy, per-connection setup
Adminer / phpMyAdmin Web-based, but single-DB-type, PHP stack
pgAdmin / Mongo Express Excellent for one DB, but I needed many
Custom internal tools Took weeks to build; not reusable

I wanted something that could be:
✅ Deployed in one command to any K8s cluster

✅ Secure by default (HTTP Basic + env vars)

✅ Fully offline / air-gapped (no external CDNs)

✅ Extendable via REST API

✅ Simple enough for QA engineers, powerful enough for devs

So I built it with Micronaut 4, HTMX, and Thymeleaf — and open-sourced it.

🚀 Quick Start 

# Run locally
./gradlew run

# Or with Docker
docker run -d --name panopticum \
  -p 8080:8080 \
  -v panopticum-data:/data \
  -e PANOPTICUM_USER=admin \
  -e PANOPTICUM_PASSWORD=changeme \
  ghcr.io/thesharque/panopticum:latest
Enter fullscreen mode Exit fullscreen mode

Open http://localhost:8080 — and you're in.

🔌 Supported Databases (All in One Place)

Type Browse Query Edit Rows
PostgreSQL / CockroachDB / YugabyteDB ✅ ✅ SQL ✅ (by ctid)
MySQL / MariaDB ✅ ✅ SQL ✅ (with PK/unique)
MS SQL Server ✅ ✅ SQL ✅ (with PK/unique)
Oracle ✅ ✅ SQL ✅ (by ROWID)
MongoDB ✅ ✅ Query JSON ✅
Redis / Dragonfly / Valkey ✅ — ✅ (key/value)
ClickHouse ✅ ✅ SQL —
Cassandra / ScyllaDB ✅ ✅ CQL ✅ (with PK)
RabbitMQ ✅ queues — ❌ read-only
Kafka ✅ topics — ❌ read-only
Elasticsearch / OpenSearch ✅ indices ✅ Query DSL ✅ (by _id)

💡 All connections are stored in an embedded H2 database. Add/remove them via UI or bootstrap via PANOPTICUM_CONNECTIONS_JSON env var.

✨ Features That Made My Life Easier

🔐 Zero-Config Auth & Offline-First

  • HTTP Basic Auth (credentials from env vars — easy with K8s Secrets)
  • All frontend assets (HTMX, CodeMirror, Prism) bundled locally — no CDN, works in air-gapped clusters
  • Light/dark theme, EN/RU localization

⚡ HTMX for Snappy UX

No React, no build step for the frontend. Partial page updates via HTMX keep the UI responsive while keeping the codebase simple and maintainable.

<!-- Example: Load table rows without full reload -->
<div hx-get="/api/postgresql/connection-1/schema/public/table/users"
     hx-trigger="load"
     hx-target="#rows-container">
  <div id="rows-container">Loading...</div>
</div>
Enter fullscreen mode Exit fullscreen mode

🔄 Data Diff: Compare Records Across Environments

This is my favorite feature. Found a suspicious record in Prod?

  1. Click "Add to Compare" on any row detail page
  2. Switch to Stage or Dev connection
  3. Open the same logical record
  4. Click "Compare" — see side-by-side JSON/field diff

All stored in your browser's localStorage — no server roundtrip. Perfect for debugging environment drift.

🌐 Full REST API + Swagger

Every UI action has a corresponding API endpoint. Documented interactively at /swagger-ui:

# Execute SQL via API
curl -u admin:changeme http://localhost:8080/api/postgresql/conn-1/query \
  -H "Content-Type: application/json" \
  -d '{"sql": "SELECT id, email FROM users WHERE status = $1", "params": ["active"]}'
Enter fullscreen mode Exit fullscreen mode

Great for automation, CI checks, or building custom dashboards.

🧭 Who Is This For?

  • DevOps/SREs: Debug data issues in staging/prod without installing 5 CLI tools
  • QA Engineers: Validate test data across services with a simple UI
  • Backend Developers: Quick ad-hoc queries without leaving the browser
  • Security Teams: Audit access via basic auth + logs; no external dependencies

👉 Check it out, star, or open an issue:

https://github.com/theSharque/panopticum

đŸ’Ŧ Let's Chat

  • What's your biggest pain point when debugging across multiple data stores?
  • Would you use a tool like this in your workflow?
  • Any databases you'd like to see added?

Drop a comment below — I read every one. 🙏

Top comments (0)