Back to Articles

Kubernetes Monitoring Dashboards: Prometheus Metrics and Real-Time Log Streaming

How to build a Kubernetes monitoring dashboard with Prometheus metrics collection, real-time container log streaming, and pod health visualization using Next.js.

Kubernetes Monitoring Dashboards: Prometheus Metrics and Real-Time Log Streaming

Managing Kubernetes clusters requires real-time visibility into pod states, resource usage, and container logs. KubeDash provides all three.


1. Prometheus Metrics Integration

We query Prometheus for CPU and memory metrics using PromQL:

typescript
async function getClusterMetrics() { const cpuQuery = 'sum(rate(container_cpu_usage_seconds_total[5m])) by (pod)'; const memQuery = 'sum(container_memory_working_set_bytes) by (pod)'; const [cpu, memory] = await Promise.all([ prometheus.query(cpuQuery), prometheus.query(memQuery) ]); return { cpu: cpu.data.result, memory: memory.data.result }; }

2. Real-Time Log Streaming

Container logs stream to the browser via WebSocket connections. Users can filter by pod, namespace, or severity level in real-time.


3. Pod Health Grid

A visual grid shows all pods color-coded by status (green=running, yellow=pending, red=crashed), with click-to-inspect details.


Summary

Prometheus metrics + WebSocket log streaming + visual pod grids give DevOps teams complete cluster visibility from a single browser tab.