Dashboard - Real-Time Service Monitoring

The Dashboard is your central command center for monitoring all services in real-time. It provides instant visibility into your entire infrastructure's health with live updates and intuitive visual indicators.

Overview

The Dashboard displays all monitored endpoints with their current health status, response times, and availability metrics. Built with WebSocket technology, it updates automatically without requiring page refreshes, ensuring you always see the latest state of your infrastructure.

Instant Visibility

See all service statuses at a glance

Real-Time Updates

WebSocket-powered live data streaming

Quick Actions

Add endpoints and refresh data with one click

Smart Organization

Filter and group by projects, status, or tags

Dashboard Components

1. Header Section

Page Title: "Service Dashboard" with subtitle "Monitor all your services in real-time"

Action Buttons:

  • Refresh Button - Manually triggers data refresh, useful after configuration changes
  • Add Endpoint Button - Primary action button that opens endpoint creation dialog

2. Stats Overview Cards

Four summary cards displaying aggregate metrics:

Total Endpoints

Total number of monitored services

Healthy (UP)

Services currently passing health checks

Down

Services currently failing health checks

Partial Outage

Services with degraded performance

3. Service Cards

Each monitored endpoint is displayed as a card showing:

Service NameFriendly name of the endpoint
URLThe monitored endpoint address
Status BadgeUP (green), DOWN (red), CHECKING (blue)
Response TimeCurrent response time in milliseconds
Check IntervalHow often the service is checked
Last CheckedTimestamp of last health check
Uptime %24-hour availability percentage

4. Real-Time Updates

The dashboard leverages WebSocket technology for live updates:

  • ⚡ Instant feedback when endpoints change status
  • 🔄 Live countdown showing time until next check
  • 📊 Real-time metrics without page refresh
  • 🔔 Visual notifications when services go down/up

Status Indicators

Color Coding

UP

Service is healthy and responding correctly

DOWN

Service is failing health checks

CHECKING

Health check currently in progress

Quick Actions

Adding a New Endpoint

  1. Click the "Add Endpoint" button (top-right)
  2. Fill in endpoint details (name, URL, type)
  3. Configure health check settings
  4. Set alert policies
  5. Click "Create" to start monitoring

Managing Endpoints

  • Edit: Click the pencil icon on any service card
  • Delete: Click the trash icon (requires confirmation)
  • Pause: Temporarily disable monitoring
  • View Details: Click the card for full metrics

Best Practices

💡 Organize by Projects

Group related endpoints into projects for easier management and team organization

⚡ Set Appropriate Check Intervals

Use 10-second intervals for critical services, 30-60 seconds for less critical ones

🎯 Use Tags for Filtering

Add tags like "production", "critical", "database" to quickly filter and find services

Next Steps

Explore related features: