DevOps Dashboard

Real-time infrastructure monitoring dashboard built with Next.js and Prometheus.

Features

• Live metrics — CPU, memory, request rate from Prometheus
• Service health — Up/down status for all monitored endpoints
• Deployment tracker — Recent deploys with rollback history
• Alert feed — Active alerts from Alertmanager
• Dark mode — DevOps-friendly UI

Stack

Layer	Technology
Frontend	Next.js 15, TypeScript, Tailwind CSS
Metrics API	Prometheus HTTP API
Auth	NextAuth.js (optional)
Deployment	Docker + Kubernetes
CI/CD	GitHub Actions

Quick Start

# Start Prometheus (for demo data)
docker compose up -d prometheus

# Run dashboard
cd app && npm install && npm run dev

Open http://localhost:3000

Screenshots

The dashboard shows:

• Cluster overview (nodes, pods, namespaces)
• Per-service golden signals (latency, traffic, errors, saturation)
• Alert timeline with severity badges

Configuration

Env Variable	Default	Description
PROMETHEUS_URL	http://localhost:9090	Prometheus server URL
REFRESH_INTERVAL	30000	Auto-refresh ms

Prometheus Queries Used

# Request rate
rate(http_requests_total[5m])

# Error rate
rate(http_requests_total{status=~"5.."}[5m]) / rate(http_requests_total[5m])

# Memory usage
container_memory_usage_bytes / container_spec_memory_limit_bytes

License

MIT © almightymoon