Homelab
How To Create A Simple Dashboard Using Homer
I’ve tried and tested many of the available self-hosted dashboard apps such as heimdall, dashy and flame to name a few, but ultimately I have settled on using homer. For me it has the right level of functionality combined with aesthetics that I like to create a simple dashboard.
Dark Mode / List Layout
Light Mode / Table Layout
Here is a ‘slightly sanitized’ version of the config.conf for the above dashboard:
---
# Homelab Dashboard Main Page Configuration
# See https://fontawesome.com/v5/search for icons options
title: "Homelab Dashboard"
#subtitle: "lab.homelab.net"
#logo: "logo.png"
icon: "fas fa-house-laptop" # Optional icon
header: true
footer: '<p>Homelab Dashboard | Maintained by <a href="mailto:[email protected]">Lee Woodhouse</a> | Sponsored by <a href="http://192.168.1.22:8686">Supermario</a> | Logoff Auth server <a href="https://auth.homelab.net">here</a></p>'
columns: "4" # Options "auto" or must be a factor of 12: 1,2,3,4,6,12
connectivityCheck: true
#proxy:
# useCredentials: true
defaults:
layout: list
colorTheme: dark
# Optional theme customization
theme: default # 'default' or one of the themes available in 'src/assets/themes'
colors:
light:
highlight-primary: "#2b2b2b"
highlight-secondary: "#363636"
highlight-hover: "#565656"
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: "#3273dc"
link-hover: "#363636"
dark:
highlight-primary: "#2b2b2b"
highlight-secondary: "#363636"
highlight-hover: "#565656"
background: "#1c1c1c"
card-background: "#2b2b2b"
text: "#eaeaea"
text-header: "#ffffff"
text-title: "#fafafa"
text-#subtitle: "#f5f5f5"
card-shadow: rgba(0, 0, 0, 0.4)
link: "#3273dc"
link-hover: "#ffdd57"
# Optional message | DuckDuckGo Search Bar
message:
#style: "is-link"
title: "Search"
icon: "fa fa-magnifying-glass"
content: '<iframe src="https://duckduckgo.com/search.html?prefill=Search
DuckDuckGo&focus=yes&kz=1&kac=1&kn=1&kp=-2&k1=-1" style="overflow:hidden;margin:0;
padding:0;width:calc(100% - 70px);height:40px;" frameborder="0"></iframe>'
# Optional navbar
links:
- name: "Wordpress"
icon: "fab fa-wordpress"
url: "https://www.myblog.io/"
target: "_blank"
- name: "Linkedin"
icon: "fab fa-linkedin"
url: "https://www.linkedin.com/feed/"
target: "_blank"
- name: "Github"
icon: "fab fa-github"
url: "https://github.com/lpwoodhouse"
target: "_blank" # optional html a tag target attribute
- name: "Reddit"
icon: "fab fa-reddit"
url: "https://www.reddit.com/user/"
target: "_blank"
- name: "Twitter"
icon: "fab fa-twitter"
url: "https://twitter.com/home"
target: "_blank"
- name: "Facebook"
icon: "fab fa-facebook"
url: "https://www.facebook.com"
target: "_blank"
- name: "Work Dashboard (local)"
icon: "fas fa-tools"
url: "https://dashboard-work.homelab.net"
target: "_blank"
# Services
services:
# Section 1
- name: "Hardware"
icon: "fas fa-server"
items:
- name: "Proxmox"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/proxmox.png"
subtitle: "Virtual Environment"
tag: "server"
tagstyle: "is-link" # options is-primary,is-link,is-info,is-success,is-warning,is-danger,is-small,is-medium,is-large,is-outlined,is-loading,[disabled]
url: "https://proxmox.homelab.net"
target: "_blank"
- name: "Synology DSM"
subtitle: "Diskstation DS920+"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/synology-dsm.png"
tag: "storage"
tagstyle: "is-link"
url: "https://quickconnect.to/"
target: "_blank"
- name: "Router Configuration"
subtitle: "Netgear Orbi RBR20"
logo: "assets/dashboard-icons/custom/netgearorbi.png"
tag: "router"
tagstyle: "is-link"
url: "https://orbilogin.com/adv_index.htm"
target: "_blank"
- name: "Printer Configuration"
subtitle: "Epson ET-3750"
logo: "assets/dashboard-icons/custom/epson.png"
tag: "printer"
tagstyle: "is-link"
url: "https://192.168.0.6/PRESENTATION/PSWD"
target: "_blank"
# Section 2
- name: "Container Management"
icon: "fab fa-docker"
items:
- name: "Portainer 1"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/portainer.png"
tag: "docker"
tagstyle: "is-link"
url: "https://portainerlab1.homelab.net/#!/auth"
target: "_blank"
- name: "Portainer 2"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/portainer.png"
tag: "docker"
tagstyle: "is-link"
url: "https://portainerlab2.homelab.net/#!/auth"
target: "_blank"
- name: "Portainer 3"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/portainer.png"
tag: "docker"
tagstyle: "is-link"
url: "https://portainerlab3.homelab.net/#!/auth"
target: "_blank"
- name: "Portainer 4"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/portainer.png"
tag: "docker"
tagstyle: "is-link"
url: "https://portainerlab4.homelab.net/#!/auth"
target: "_blank"
- name: "Portainer 5"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/portainer.png"
tag: "docker"
tagstyle: "is-link"
url: "https://portainerlab5.homelab.net/#!/auth"
target: "_blank"
- name: "Portainer (DSM)"
subtitle: "docker-dsm.homelab.net"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/portainer.png"
tag: "docker"
tagstyle: "is-link"
url: "https://portainerlab-dsm.homelab.net/#!/auth"
target: "_blank"
- name: "Rancher"
subtitle: "rancher.homelab.net"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/rancher.png"
tag: "kubernetes"
tagstyle: "is-link"
url: "https://rancher.homelab.net"
target: "_blank"
- name: "Docker Hub"
subtitle: "hub.docker.com"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/docker.png"
tag: "docker"
tagstyle: "is-link"
url: "https://hub.docker.com/"
target: "_blank"
# Section 3
- name: "Applications"
icon: "fas fa-gears"
items:
- name: "AWX"
subtitle: "Ansible Tower"
logo: "assets/dashboard-icons/custom/awx.png"
tag: "app"
tagstyle: "is-link"
url: "https://awx.homelab.net/#/login"
target: "_blank"
- name: "GitLab"
subtitle: "Self-hosted Git Service"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/gitlab.png"
tag: "app"
tagstyle: "is-link"
url: "https://gitlab.homelab.net/"
target: "_blank"
- name: "Snippet-Box"
subtitle: "Code Snippets Organizer"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/snippetbox.png"
tag: "app"
tagstyle: "is-link"
url: "https://snippet.homelab.net/"
target: "_blank"
- name: "Nginx Proxy Manager"
subtitle: "Reverse Proxy Service"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/nginxproxymanager.png"
tag: "proxy"
tagstyle: "is-link"
url: "https://npm.homelab.net/"
target: "_blank"
- name: "Home Inventory"
subtitle: "Snipe-IT Asset Tracker"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/snipe-it-alt.png"
tag: "database"
tagstyle: "is-link"
url: "https://assets.homelab.net/"
target: "_blank"
- name: "Guacamole"
subtitle: "Clientless RDP Gateway"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/guacamole.png"
tag: "app"
tagstyle: "is-link"
url: "https://guac.homelab.net/"
target: "_blank"
- name: "Bitwarden"
subtitle: "Password Management"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/bitwarden.png"
tag: "app"
tagstyle: "is-link"
url: "https://bitwarden.homelab.net/"
target: "_blank"
- name: "Firefly III"
subtitle: "Personal Finance Management"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/firefly.png"
tag: "app"
tagstyle: "is-link"
url: "https://firefly.homelab.net/"
target: "_blank"
- name: "Node-RED"
subtitle: "Flow-based Programming"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/nodered.png"
tag: "app"
tagstyle: "is-link"
url: "https://nodered.homelab.net/"
target: "_blank"
# Section 4
- name: "Media"
icon: "fas fa-film"
items:
- name: "Plex"
subtitle: "Media Server"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/plex.png"
tag: "media"
tagstyle: "is-link"
url: "https://app.plex.tv/desktop/#!/"
target: "_blank"
- name: "Sonarr"
subtitle: "TV Show Library Management"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/sonarr.png"
tag: "media"
tagstyle: "is-link"
url: "https://sonarr.homelab.net"
target: "_blank"
- name: "Radarr"
subtitle: "Movie Library Management"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/radarr.png"
tag: "media"
tagstyle: "is-link"
url: "https://radarr.homelab.net"
target: "_blank"
- name: "Lidarr"
subtitle: "Music Library"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/lidarr.png"
tag: "media"
tagstyle: "is-link"
url: "https://lidarrl.homelab.net"
target: "_blank"
- name: "Jackett"
subtitle: "Indexer Configuration"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/jackett.png"
tag: "media"
tagstyle: "is-link"
url: "http://192.168.0.23:9117/"
target: "_blank"
- name: "qBittorrent"
subtitle: "Download Management"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/qbittorrent.png"
tag: "media"
tagstyle: "is-link"
url: "https://qbittorrent.homelab.net/"
target: "_blank"
# Section 5
- name: "Monitoring"
icon: "fas fa-heartbeat"
items:
- name: "Grafana"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/grafana.png"
tag: "monitoring"
tagstyle: "is-link"
url: "https://grafana.homelab.net"
target: "_blank"
- name: "Prometheus"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/prometheus.png"
tag: "monitoring"
tagstyle: "is-link"
url: "http://192.168.0.22:9090"
target: "_blank"
- name: "InfluxDB"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/influxdb.png"
tag: "monitoring"
tagstyle: "is-link"
url: "https://influxdb.homelab.net"
target: "_blank"
- name: "Uptime Kuma"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/uptime-kuma.png"
tag: "monitoring"
tagstyle: "is-link"
url: "https://uptime.homelab.net/"
target: "_blank"
- name: "Zabbix"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/zabbix.png"
tag: "monitoring"
tagstyle: "is-link"
url: "https://zabbix.homelab.net/"
target: "_blank"
- name: "Pi-hole"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/pihole.png"
subtitle: "Network-wide Ad Blocking" # optional, if no #subtitle is defined, PiHole statistics will be shown
tag: "app"
tagstyle: "is-link"
url: "https://pihole.homelab.net/admin"
type: "PiHole" # optional, loads a specific component that provides extra features. MUST MATCH a file name (without file extension) available in `src/components/services`
target: "_blank" # optional html a tag target attribute
#class: "green" # optional custom CSS class for card, useful with custom stylesheet
#background: red # optional color for card to set color directly without custom stylesheet
- name: "Pushover"
subtitle: "Manage Push Notifications"
logo: "https://pushover.net/images/icon-256.png"
tag: "web"
tagstyle: "is-link"
url: "https://pushover.net/#apps"
target: "_blank"
# Section 6
- name: "Web/Cloud"
icon: "fas fa-cloud"
items:
- name: "Amazon Web Services"
logo: "assets/dashboard-icons/custom/aws3.png"
tag: "cloud"
tagstyle: "is-link"
url: "https://signin.aws.amazon.com"
target: "_blank"
- name: "Cloudflare Dashboard"
subtitle: "DNS Management"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/cloudflare.png"
tag: "cloud"
tagstyle: "is-link"
url: "https://dash.cloudflare.com/"
target: "_blank"
- name: "Twilio SendGrid"
subtitle: "Email API"
logo: "assets/dashboard-icons/custom/sendgrid.png"
tag: "api"
tagstyle: "is-link"
url: "https://app.sendgrid.com"
target: "_blank"
- name: "Google Domains"
subtitle: "Domain Registration"
logo: "assets/dashboard-icons/custom/google_domains.png"
tag: "web"
tagstyle: "is-link"
url: "https://domains.google.com"
target: "_blank"
# Section 7
- name: "In Development"
icon: "fas fa-tools"
items:
- name: "Flame"
subtitle: "self-hosted startpage editor"
logo: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/master/png/flame.png"
tag: "192.168.0.22:5005"
tagstyle: "is-link"
url: "http://192.168.0.22:5005"
target: "_blank"
- name: "DashMachine (Homelab)"
subtitle: "dashboard alternative"
logo: "assets/dashboard-icons/custom/cogs.png"
tag: "192.168.0.22:5000"
tagstyle: "is-link"
url: "http://192.168.0.22:5000"
target: "_blank"
Lee Woodhouse
0
Tags :