PRACTICA: Homer

Aquí tienes una práctica completa, sencilla y muy vistosa para principiantes en Docker. Se trata de desplegar Homer, un dashboard visual precioso que funciona como una “pantalla de inicio” para enlaces, apps y servicios. Es chulo, colorido y muy agradecido para enseñar.

---

🐳 Práctica: Desplegar “Homer Dashboard” con Docker

🎯 Objetivo

Aprender a:

• Descargar una imagen desde Docker Hub

• Crear un contenedor de manera sencilla

• Usar volúmenes

• Exponer un puerto

• Personalizar el dashboard

---

⭐ ¿Qué es Homer?

Homer es una aplicación estática, sin base de datos, muy ligera, que muestra un panel tipo “inicio” con iconos y enlaces. ¡Ideal para una práctica divertida!

Aspecto aproximado:

+------------------------------------------------+
|   HOMER · Dashboard bonito y personalizable    |
|   [YouTube] [Google] [GitHub] [Netflix]        |
|   Todo organizado con iconos súper chulos      |
+------------------------------------------------+

---

🧩 1. Descargar y ejecutar el contenedor

En tu terminal:

docker run -d \
  --name homer \
  -p 8080:8080 \
  -v $(pwd)/homer-data:/www/assets \
  b4bz/homer

¿Qué hace cada parte?

• docker run -d → Ejecutar en segundo plano

• --name homer → Nombre del contenedor

• -p 8080:8080 → Exponer la web en http://localhost:8080

• -v $(pwd)/homer-data:/www/assets → Carpeta persistente para personalizar Homer

• b4bz/homer → Imagen oficial del dashboard

---

🖥️ 2. Abrir la aplicación

Una vez ejecutado, abre el navegador:

👉 http://localhost:8080

¡Ya deberías ver el dashboard funcionando!

---

🛠️ 3. Personalizar el dashboard

Ahora vamos a editar la configuración.

Dentro de la carpeta creada automáticamente tienes:

homer-data/
   ├─ config.yml
   ├─ icons/
   ├─ custom.css
   └─ ...

Edita el archivo:

nano homer-data/config.yml

Por ejemplo, añade enlaces:

title: "Mi Dashboard Chulo"
subtitle: "Ejercicio con Docker"

links:
  - name: "YouTube"
    logo: "fab fa-youtube"
    url: "https://youtube.com"

  - name: "Netflix"
    logo: "fas fa-tv"
    url: "https://netflix.com"

  - name: "GitHub"
    logo: "fab fa-github"
    url: "https://github.com"

Guarda, refresca el navegador y… ¡tendrás tu panel personalizado!

---

🔄 4. Reiniciar (si editas la configuración)

Si algo no actualiza:

docker restart homer

---

🧹 5. Detener y eliminar cuando termines

docker stop homer
docker rm homer

Tienes una plantilla mas grande aqui.

title: "Homer Dashboard"
subtitle: "Panel de control personal"
logo: "assets/logo.png"
favicon: "assets/favicon.png"

theme: default

colors:
  light:
    primary: "#0077CC"
    secondary: "#005999"
    background: "#F5F7FA"
    background-alt: "#E8ECEF"
    text: "#222222"
    text-alt: "#444444"

  dark:
    primary: "#1E90FF"
    secondary: "#104E8B"
    background: "#1C1C1C"
    background-alt: "#2A2A2A"
    text: "#EAEAEA"
    text-alt: "#AAAAAA"

message:
  title: "Bienvenido"
  content: |
    Este es nuestro panel centralizado de servicios.
    Desde aquí podemos acceder a todas las herramientas internas,
    favoritos personales y utilidades del entorno.

links:
  - name: "Repositorio GitHub"
    icon: "fab fa-github"
    url: "https://github.com"

  - name: "Correo Web"
    icon: "fas fa-envelope"
    url: "https://mail.google.com"

search:
  provider: "duckduckgo"
  target: "_blank"

services:

  - name: "Herramientas"
    icon: "fas fa-tools"
    items:
      - name: "Servidor NAS"
        url: "http://192.168.1.20"
        icon: "fas fa-hdd"
        subtitle: "Almacenamiento centralizado"

      - name: "Monitorización"
        url: "http://192.168.1.25:3000"
        icon: "fas fa-chart-line"
        subtitle: "Estadísticas y gráficas"

      - name: "Raspberry Pi"
        url: "http://192.168.1.10"
        icon: "fas fa-microchip"
        subtitle: "Servidor doméstico"

  - name: "Multimedia"
    icon: "fas fa-film"
    items:
      - name: "YouTube"
        url: "https://youtube.com"
        icon: "fab fa-youtube"

      - name: "Spotify"
        url: "https://open.spotify.com"
        icon: "fab fa-spotify"

      - name: "Plex"
        url: "http://192.168.1.30:32400"
        icon: "fas fa-play-circle"
        subtitle: "Centro multimedia"

  - name: "Desarrollo"
    icon: "fas fa-code"
    items:
      - name: "Portainer"
        url: "http://192.168.1.50:9000"
        icon: "fas fa-boxes"

      - name: "Documentación"
        url: "https://developer.mozilla.org"
        icon: "fas fa-book"

bookmarks:
  - category: "Noticias"
    links:
      - name: "El País"
        url: "https://elpais.com"
      - name: "BBC"
        url: "https://bbc.com"
      - name: "Hacker News"
        url: "https://news.ycombinator.com"

  - category: "Aprendizaje"
    links:
      - name: "Stack Overflow"
        url: "https://stackoverflow.com"
      - name: "W3Schools"
        url: "https://w3schools.com"

stylesheet: "assets/custom.css"