Dash - Monitoring Dashboard

A Grafana-like monitoring dashboard built with Vue.js, Go, and Prometheus.

Versioning and Releases

• Versioning: Semantic Versioning (vMAJOR.MINOR.PATCH) with Conventional Commits
• Release planning: release-please opens and updates release PRs from changes on master
• Release output: merge of the release PR creates a GitHub Release with generated notes and updates CHANGELOG.md
• Auto-published assets: backend binaries, frontend artifact tarball, image SBOMs, and checksums
• Release guide: see RELEASE.md for the maintainer workflow and versioning rules

Container Images

Public multi-arch images are published to GHCR on every release:

• ghcr.io/janhoon/dash-backend
• ghcr.io/janhoon/dash-frontend

Example pulls:

docker pull ghcr.io/janhoon/dash-backend:v0.1.0
docker pull ghcr.io/janhoon/dash-frontend:v0.1.0

When building the frontend image yourself, set VITE_API_URL at build time:

docker build -f frontend/Dockerfile --build-arg VITE_API_URL=https://api.example.com -t dash-frontend:local .

Tag strategy:

• Release tags: vX.Y.Z, X.Y.Z
• Moving tags: X.Y, X, latest, sha-<commit>

Tech Stack

• Frontend: Vue.js 3 (Composition API + TypeScript)
• Backend: Go API
• Database: PostgreSQL (metadata storage)
• Data Source: Prometheus

Features (Planned)

• Dashboard CRUD operations
• Panel system with 12-column grid layout
• Time range picker with presets and custom ranges
• Prometheus data source integration
• PromQL query editor
• Line chart visualizations (ECharts)
• Auto-refresh at configurable intervals
• Drag-and-drop dashboard layout

Development

Prerequisites

• Node.js 18+
• Go 1.25+
• Docker and Docker Compose

Setup

1. Start the infrastructure services:

   docker-compose up -d

   This starts the OpenTelemetry Collector, which tails Docker container logs and ships them to both Loki and Victoria Logs.

   Optional: start continuous synthetic trace traffic for Tempo testing:

   # enable load generator
   docker compose --profile otel-load up -d otel-loadgen
   
   # watch load generator logs
   docker compose logs -f otel-loadgen
   
   # disable load generator
   docker compose stop otel-loadgen

   The load generator emits both single-service traces and inter-service traces (edge -> checkout -> payments/inventory -> worker) so service graph and cross-service debugging flows have realistic traffic.

2. Start the backend API:

   make backend

   The API will be available at http://localhost:8080 and auto-reloads on Go file changes.

   If you want to run without hot reload:

   cd backend
   go run ./cmd/api

3. Start the frontend dev server:

   cd frontend
   npm install
   cd ..
   make frontend

   The frontend will be available at http://localhost:5173

   You can also still run backend/frontend commands directly from their folders.

Seed First Admin

Create the first admin user and organization:

make seed-admin
# defaults: EMAIL=admin@admin.com PASSWORD=Admin1234 ORG=default

# or override values
make seed-admin EMAIL=admin@example.com PASSWORD='AdminPass123' ORG='My Company' NAME='First Admin'

This also seeds five default datasources for the new organization: Prometheus (http://localhost:9090), VictoriaMetrics (http://localhost:8428), Loki (http://localhost:3100), Victoria Logs (http://localhost:9428), and Tempo (http://localhost:3200).

If the admin user/org already exists, seed only the default datasources:

make seed-datasources
# default ORG=default

# or for another organization slug
make seed-datasources ORG=my-company

Running Tests

Frontend:

cd frontend
npm run type-check
npm run test

Backend:

cd backend
go test ./...

Code Coverage

Refresh locally:

# Backend
cd backend
go test ./... -coverprofile=coverage.out
go tool cover -func=coverage.out

# Frontend
cd ../frontend
npm run test:coverage

Running Linting

From repo root:

make lint

Run backend lint only:

make backend-lint

Run frontend lint only:

make frontend-lint

Or run commands directly:

Backend:

cd backend
golangci-lint run ./...

Frontend:

cd frontend
npm run lint
npm run lint:dead-code

Running Security Scans Locally

From repo root:

make security-local

This runs:

• govulncheck against backend/ in a Go 1.25.7 Docker container
• gitleaks against the full repository via Docker

API Endpoints

• GET /api/health - Health check endpoint

Project Structure

dash/
├── frontend/           # Vue.js 3 application
│   ├── src/
│   └── package.json
├── backend/            # Go API
│   ├── cmd/api/        # Application entrypoint
│   ├── internal/       # Private application code
│   │   ├── handlers/   # HTTP handlers
│   │   ├── models/     # Data models
│   │   └── db/         # Database connection and migrations
│   └── pkg/            # Public packages
├── agent/              # Ralph agent for automated development
├── docker-compose.yml  # Local infra services (DB, metrics, logs)
├── otel-collector.yml  # Docker log shipping to Loki + Victoria Logs
└── README.md