Tenha cuidado, esta é a bomba… hoje temos aqui o Homer Dashboard, que é uma das melhores descobertas deste 2021… É apenas um site leve e estático… mas… Para quê? Para fazer uma página inicial personalizada e bonita com os serviços da web que usamos, em casa ou em empresas, Prepare-se, é 1000 legal…

Poço, creo que nos pasa a todos, cada vez tenemos más y más servicios que gestionar, que acceder… y desde hace mucho tiempo echaba en falta una solución que simplifique su acceso, una manera mejor de organizarse. Homer Dashboard es una web que no pesa, que la podemos tener en 2 minutos instalada, que es mega adaptable y que pensemos que sería el sitio que aglomera los servicios webs fundamentales. Para nosotros o para la empresa, Isso é, una web corporativa de inicio en los navegadores que aglutina las webs, todo en uno.

Si todavía no os hacéis una idea, ir al final del post y ver el ejemplo mío particular, o poner en google “Painel Homer” y en ‘Imágenes’ ver ejemplos, es una chulada. E o que eu disse, es un sitio web totalmente personalizable y facilon, en un fichero en formato YAML lo configuramos de manera sencilla. Lo podremos desplegar en un contenedor de Docker por ejemplo, o en un Nginx o Apache que tengamos por ahí mismamente, no será más que bajarse la web y listo. Tenéis toda la info del proyecto aqui. E aqui tienes una demo online por si quieres ver de qué se trata. Y si queréis, también hay otras soluciones parecidas, mirar DashMachine, Organizr, Heimdall ou SUI entre outros.

Para instalarlo lo dicho, podéis mediante contenedor o directamente en un servidor web que tengamos ya desplegado. En este caso usaré Nginx como ejemplo, si no tienes el servicio instalado lo instalamos:

sudo apt install nginx unzip -y
sudo systemctl enable nginx

E nada, para instalar Homer Dashboard tan sólo bastará con descargarlo, descomprimirlo, corregir los permisos y crear un fichero de configuración para personalizar nuestro Dashboard.

wget https://github.com/bastienwirtz/homer/releases/latest/download/homer.zip
sudo unzip homer.zip -d /usr/share/nginx/homer
sudo chown www-data:www-data /usr/share/nginx/homer/ -R
sudo cp /usr/share/nginx/homer/assets/config.yml.dist /usr/share/nginx/homer/assets/config.yml

Podemos crear un fichero de configuración en Nginx para publicar el sitio, os dejo este de ejemplo, o mismamente modificando el fichero de configuración del sitio predeterminado con la ruta correcta al sitio Homer.

Servidor {
    listen 81;
    listen [::]:81;
    server_name homer.midominio.local;

# Path to the root of your installation
    root /usr/share/nginx/homer/;

   access_log /var/log/nginx/homer.access;
   error_log /var/log/nginx/homer.error;
}

E nada, verificamos que la configuración es correcta & reiniciamos Nginx para recargar los cambios que hemos hecho:

sudo nginx -t
sudo systemctl reload nginx

E nada, accedemos con un navegador al sitio que hemos creado y tendremos el Dashboard inicial, con él podremos partir y en un periquete tener el nuestro propio.

¿Cómo? Editando su fichero de configuración /usr/share/nginx/homer/assets/config.yml

Y te quedará algo tan chulo como esto! O que eu disse, É 100% personalizável, cómo véis le quité el encabezado, le puse un cuadro de búsqueda a Google… También quedó como página de inicio en los navegadores de la empresa, por GPO, al Internet Explorer, Chrome, Firefox, Edge…

Y listo Calisto, tenemos tema oscuro también…

Os dejo un repositorio de iconos por si os facilita y que podréis utilizar, así como cualquier imagen personalizada, claro:

• https://fontawesome.com/icons
• https://github.com/NX211/homer-icons

Por si os ayuda os dejo algo del código inicial de mi sitio Homer Dashboard, de verdad que es yaml y es sencillo de modificar, ¡ánimo!

---
# Homepage configuration
# See https://fontawesome.com/icons for icons options

title: "Serviços abertos de TI - Dashboard de servicios"
subtitle: "Homer"
logo: "logo_openservicesit.png"
cabeçalho: false
footer: false
columns: 4
theme: default
colors:
  Leve:
    highlight-primary: "#7D0458"
    highlight-secondary: "#9e0770"
    highlight-hover: "#ffffff"
    fundo: "#f5f5f5"
    card-background: "#ffffff"
    Texto: "Branco"
    text-header: "#ffffff"
    text-title: "#303030"
    text-subtitle: "#424242"
    card-shadow: rgba(0, 0, 0, 0.1)
    link-hover: "#363636"
    imagem de fundo: "/imagenes/fondo.jpg"
  Escuro:
    highlight-primary: "#7D0458"
    highlight-secondary: "#9e0770"
    highlight-hover: "#2b2b2b"
    fundo: "#131313"
    card-background: "#2b2b2b"
    Texto: "#7D0458"
    text-header: "#ffffff"
    text-title: "#fafafa"
    text-subtitle: "#f5f5f5"
    card-shadow: rgba(0, 0, 0, 0.4)
    link-hover: "#ffdd57"
    imagem de fundo: "/imagenes/fondo.jpg"
Mensagem:
  conteúdo: '<form action="https (em inglês)://google.com/search" method="get"><input type="Texto" name="q" placeholder="Puedes buscar en Google lo que quieras" style="Largura: 100%" spellcheck="Falso" autofocus="Verdadeiro" onkeydown="handleKeyPress(evento)"/></form>'
links:
  - Nome: "Serviços abertos de TI"
    URL: "https (em inglês)://www.openservices.eus"
  - Nome: "Webmail"
    ícone: "fas fa-envelope"
    URL: "https (em inglês)://webmail.bujarra.com"
Serviços:
  - Nome: "Infraestruturas"
    ícone: "fas fa-cloud"
    items:
      - Nome: "Servidor VMware vCenter"
        logo: "/imagenes/vmware.png"
        subtitle: "Gestión de la plataforma virtual"
        URL: "https (em inglês)://os-vc-01.openservices.local/ui/"
        #Alvo: "_blank" # optional html a tag target attribute
      - Nome: "Fortalecer"
        logo: "/imagenes/fortigate.png"
        subtitle: "Acceso al Fortigate"
        URL: "https (em inglês)://192.168.1.1"
...

Nada y si le dedicáis algo más de rato que yo, estoy seguro que podéis hacer algo muy chulo. O que eu disse, pensad en esas webs iniciales para departamentos, sitios de IT…

Como sempre um prazer, os cuidáis mucho, que vaya muy bien y agradecer a los que mueven estas cosas por redes sociales, es la única manera de llegar a más gente que le puedan venir bien este tipo de soluciones open source, ¡Abraços!