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)