Heimdall Installation

Das Heimdall Dashboard bietet die Möglichkeit eine zentrale Startseite für euren Browser für all eure Homelab Applikationen zu sein. Ich zeige euch, wie ihr mit wenigen Befehlen Heimdall als Docker Container konfigurieren könnt und was euch das an Mehrwert bietet.

Heimdall ist ein sogenanntes “Application Dashboard”. Hier können eure zentral genutzten Web-Applikationen auf einer Seite abgebildet werden mit “Apps”. Im Heimdall Projekt gibt es mehrere hundert verschiedene Apps (bspw. Plex, Portainer, PiHole…). Unterschieden wird zwischen “Foundation Apps” und “Enhanced Apps”. Die “Enhanced Apps” haben den Vorteil, dass bestimmte Informationen aus der verlinkten Applikation direkt im Dashboard angezeigt werden können. Beispielsweise handelt es sich bei PiHole um eine “Enhanced App” und ihr seht direkt auf eurer Startseite im Browser, wieviele DNS Anfragen geblockt wurden.

Sollte eine Applikation oder Webseite nicht als App vorhanden sein, ist das auch nicht weiter schlimm. Ihr könnt jede App in Farbe, Icon und Beschriftung anpassen. Auch eure bevorzugte Suchmaschine ist integrier- und das Hintergrundbild anpassbar.

Installation

Die Installation ist für jeden, der schon ein wenig Erfahrungen mit Docker bzw Portainer hat, einfach.

Der Konfigurations Script läst sich noch belibig Anpassen.In diesem File wird die Konfiguration durchgeführt. Es sind nur ein paar wenige Änderungen notwendig:

Die korrekte Zeitzone setzen:TZ=Europe/Berlin
Freie Ports Anpassen, in meinem fall hab ich hier den freien Port 83 als eingangs Port gewählt
Benutzerkennung, diese sollte in den meisten fällen passen
USERMAP_GID: 1000
USERMAP_GID: 1000

Über SSH auf dem Raspberry einloggen und die Ordnerstruktur anlegen.

diesen kann man sich belibig anpassen.

In Portainer nun die Stack funktion wählen und den Code einfügen.

In Portainer auf Stacks und +Add stack drücken.

				
					version: "2.1"
services:
  heimdall:
    image: linuxserver/heimdall
    container_name: heimdall
    volumes:
      - /mnt/Heimdall/data:/config
    environment:
      - PUID=1000
      - PGID=1000
      - TZ=Europe/Berlin
    ports:
      - 83:80
    restart: unless-stopped

Dem Stack einen Namen geben ( klein geschrieben ) und unten auf „Deploy the stack“ die Installation starten.

Nach einem kurzen moment sollte alles Installiert sein.

Über die ServerIp:83 sollte mann Heimdall Oberfläche erreichen können und diese mit seinen eigenen Verknüpfungen zu füllen.

Css Anpassen

Über die Anpassung der Css kann mann die Oberfläche belibig verändern.

Hier ein Beispiel mit geänderte Bottens

				
					@import url("https://fonts.googleapis.com/css2?family=Raleway:wght@700;800&display=swap");

#app {
  background-position: right;
}
#app #sortable,
#app main {
  padding: 20px;
}
#config-buttons {
  bottom: 50%;
  transform: translateY(50%);
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  box-shadow: rgba(255, 255, 255, 0.1) -1px 1px 1px 0, rgba(255, 255, 255, 0.1) 0 -1px 1px 0,
    rgba(0, 0, 0, 0.1) -1px 0 20px 5px;
  background-color: rgba(40, 40, 40, 0.25);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
#config-buttons a {
  background: none;
}
#config-buttons a svg {
  transition: all 0.1s ease-in-out;
  color: rgba(255, 255, 255, 0.5);
}
#config-buttons a:hover svg {
  transform: scale(1.1);
  color: rgba(255, 255, 255, 0.95);
}

.black {
  color: white !important;
}

.item {
  box-shadow: rgba(0, 0, 0, 0.05) -1px -1px 5px 0, rgba(0, 0, 0, 0.15) 0px 20px 25px -5px,
    rgba(0, 0, 0, 0.04) 0px 10px 10px -5px !important;
  border-radius: 12px;
  background-image: none;
  border: none;
  outline: none;
  height: 100px;
  width: 300px;
  margin: 1.25rem;
  padding: 1rem 55px 1rem 1rem;
  transition: all 0.25s ease-in-out;
  transition-property: transform, box-shadow, background-color;
  background-color: rgba(255, 255, 255, 0.4) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.item:after {
  height: 100px;
  opacity: 0.2;
}
.item:hover {
  transform: scale(1.1);
  background-color: rgba(255, 255, 255, 0.2) !important;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 60px 40px -7px !important;
}
.item .svg-inline--fa {
  height: 100px;
  vertical-align: middle;
  opacity: 0.2;
}

@media only screen and (max-width: 750px) {
  .item {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  #config-buttons {
    display: none;
  }
}

.details * {
  color: white !important;
}
.details {
  padding: 0 0.5rem;
}

.app-icon {
  filter: drop-shadow(1px 1px 2px rgba(10, 0, 20, 0.1));
}

.livestats-container {
  margin-top: 0.5rem;
}
.livestats-container .livestats .title {
  margin-bottom: 3px;
}
.livestats-container .livestats li {
  padding-right: 1rem;
}

.livestats-container strong {
  font-weight: 500 !important;
  padding: 0 2px;
}

.details > .title {
  font-weight: 800;
  font-size: 1.3rem !important;
  letter-spacing: 1px;
  font-family: "Raleway", sans-serif;
  text-shadow: rgba(10, 0, 60, 0.25) 1px 0 5px;
  text-shadow: -1px -1px 1px rgba(255, 255, 255, 0.1), 1px 1px 2px rgba(10, 0, 60, 0.25);
  transition: all 0.25s ease-in-out;
}
.item:hover .details > .title {
  text-shadow: -1px -1px 1px rgba(255, 255, 255, 0.1), 1px 1px 5px rgba(10, 0, 60, 0.2);
}

Das könnte Dich auch interessieren…

Anleitungen zur Installation in Docker

WireGuard Installation

Wireguard ➤ Installation ➤ Portainer ➤ WG-easy Docker ✓

3D Druck

Konstruktion in Fusion 360:

3D Druck Anleitungen:

zuletzt fertiggestellt:

Brillen Ständer Moaï

Headphone stand

Labyrinth Gift Box

BatteBier Kiste

Raspberry Pi

einige Anleitungen für die Installation:

Pi4 Gehäuse 3D Druck:

TestPi

OctoPrint Pi

Nextcloud Pi

NginX Pi

Bike

Bike Tour Berichte :

Bilder Album:

Heimdall Installation

Installation

Css Anpassen

Das könnte Dich auch interessieren…

meine Raspberry`s