Deploying Management Dashboard with Docker

With so many services deployed on the server, it’s easy to forget ports and hard to find the right service. A proper management dashboard is helpful. Ideally, it should display quick links to all services, show Docker container status, monitor hardware information (though running in Docker containers, this is difficult; command-line top works fine), and ideally provide file services (though Samba can replace this).

Such Dashboard services can run on port 80, allowing direct browser access via IP. I tried several options below.

Homer

I tried Homer, but it’s too lightweight. It’s just a static panel with no direct service management, containers, or files—just links and display. Here’s the deployment process:

Create a local folder homer and enter it

Create docker-compose.yml:

services:
  homer:
    image: b4bz/homer:latest
    container_name: homer
    volumes:
      - ./assets:/www/assets
    ports:
      - 80:8080
    restart: unless-stopped

Create an assets folder and inside it, create config.yml to manage all services:

---
# Homepage configuration

title: "Kyxie Web Services"
subtitle: "Dashboard"
logo: "logo.png"
icon: "fas fa-skull-crossbones"

header: true
footer: false 
columns: "4"

# Optional theme customization
theme: default
colors:
  light:
    highlight-primary: "#3367d6"
    highlight-secondary: "#4285f4"
    highlight-hover: "#5a95f5"
    background: "#f5f5f5"
    card-background: "#ffffff"
    text: "#363636"
    text-header: "#ffffff"
    text-title: "#303030"
    text-subtitle: "#424242"
    card-shadow: rgba(0, 0, 0, 0.1)
    link-hover: "#363636"
  dark:
    highlight-primary: "#3367d6"
    highlight-secondary: "#4285f4"
    highlight-hover: "#5a95f5"
    background: "#131313"
    card-background: "#2b2b2b"
    text: "#eaeaea"
    text-header: "#ffffff"
    text-title: "#fafafa"
    text-subtitle: "#f5f5f5"
    card-shadow: rgba(0, 0, 0, 0.4)
    link-hover: "#ffdd57"

# Optional navbar
links:
  - name: "Github"
    icon: "fab fa-github"
    url: "https://github.com/Kyxie"
    target: "_blank"
  - name: "Blog"
    icon: "fas fa-file-alt"
    url: "https://kyxie.me" 

# Services
services:
  - name: "Services"
    icon: "fas fa-server"
    items:
      - name: "aria2"
        icon: "fas fa-download"
        subtitle: "aria2 RPC Web UI"
        url: "http://192.168.2.218:6880"
        target: "_blank"
      - name: "OpenWRT"
        icon: "fas fa-wifi"
        subtitle: "OpenWRT Router"
        url: "http://192.168.2.66"
        target: "_blank"
      - name: "File Browser"
        icon: "fas fa-folder-open"
        subtitle: "File Browser"
        url: "https://file.kyxie.me"
        target: "_blank"
      - name: "Vaultwarden"
        icon: "fas fa-key"
        subtitle: "Vaultwarden Password Manager"
        url: "https://vault.kyxie.me"
        target: "_blank"
      - name: "Home Assistant"
        icon: "fas fa-home"
        subtitle: "Home Automation"
        url: "http://192.168.2.218:8123"
        target: "_blank"

Start the container. Default username and password are admin and admin:
```
docker compose up -d
```

Portainer

Portainer is a specialized panel for managing Docker container status, somewhat like a web version of Docker Desktop. I mostly use command-line for Docker, but it’s available if needed. Here’s the deployment method:

docker-compose.yml:

services:
  portainer:
    image: portainer/portainer-ce:latest
    container_name: portainer
    restart: unless-stopped
    ports:
      - "9000:9000"
    volumes:
      - /var/run/docker.sock:/var/run/docker.sock
      - ./data:/data

Dashy

Dashy is similar to Homer (and the author’s GitHub avatar background looks suspiciously similar too), providing service links. It also offers countless beautiful widgets. As a Dashboard, I think it’s excellent.

Create a Docker network dashy:
```
docker network create dashy
```

docker-compose.yml:

services:
  dashy:
    image: lissy93/dashy
    container_name: dashy
    ports:
      - "80:8080"
    volumes:
      - ./dashy-data:/app/user-data
    environment:
      - UID=1000
      - GID=1000
    restart: unless-stopped
    networks:
      - dashy
    healthcheck:
      test: ['CMD', 'node', '/app/services/healthcheck']
      interval: 1m30s
      timeout: 10s
      retries: 3
      start_period: 40s

networks:
  dashy:
    external: true

Before starting, create a dashy-data folder and inside it, create a conf.yml. The original author provides many examples: Example Config Files for Dashy · GitHub.
Start the container:
```
docker compose up -d
```

You can add custom CSS in conf.yml to hide the footer:

appConfig:
  customCss: |
    .clock p.time {
      font-size: 3rem !important;
    }
    footer {
      display: none !important;
    }

To use Dashy for system monitoring, install Glances. Glances starts a service on port 61280, which Dashy reads. Here I added Glances to Dashy’s Docker network. For details, see: Widgets | Dashy

glances:
  image: nicolargo/glances:latest
  container_name: glances
  restart: unless-stopped
  ports:
    - "61208:61208"
  volumes:
    - /var/run/docker.sock:/var/run/docker.sock:ro
  pid: host
  privileged: true
  environment:
    GLANCES_OPT: -w
    PUID: 1000
    PGID: 1000
    TZ: America/Toronto
  networks:
    - dashy

Dashy looks great when fully configured:

Uptime Kuma

Also a tool with a beautiful UI. Its main function is monitoring service availability and sending notifications (email, etc.) if services go down. This is my Docker Compose setup for reference. There are plenty of deployment and configuration tutorials online.

services:
  uptime-kuma:
    image: louislam/uptime-kuma:1
    container_name: uptime-kuma
    volumes:
      - ./data:/app/data
      - /var/run/docker.sock:/var/run/docker.sock:ro
    environment:
      - TZ=America/Toronto
    restart: unless-stopped
    networks:
      - cloudflared

networks:
  cloudflared:
    external: true

The interface looks very nice:

Uptime Kuma

Homer#

Portainer#

Dashy#

Uptime Kuma#

Homer

Portainer

Dashy

Uptime Kuma