fbpx
Перейти к содержимому

homepage — главная страница для ваших сервисов

Постепенно, при увеличении сервисов которыми вы пользуетесь, может возникнуть ситуация, когда уже сложно вспомнить на каком порту и доменном имени находится тот или иной сервис и в данной ситуации на помощь приходит homepage.

homepage — это небольшой сайт на котором вы можете собрать все ваши сервисы, добавить виджеты и закладки на сайты.

homepage главная страница

Основные преимущества homepage

  • Весь сайт статически генерируется во время сборки, поэтому вы можете ожидать мгновенного времени загрузки.
  • Каждый запрос API к бэкэнд-сервисам проходит через прокси-сервер, поэтому ваши ключи API никогда не будут выставлены наружу для клиента фронтэнда
  • Образ конейнера построены для AMD64 (x86_64), ARM64, ARMv7 и ARMv6 Поддерживает все Raspberry Pi, большинство SBC и Apple Silicon
  • Полная поддержка i18n с автоматическим определением языка
  • Мгновенный поиск «Быстрый запуск»
  • Поддержка виджетов
  • Интеграция с Sonarr, Radarr, Readarr, Prowlarr, Bazarr, Lidarr, Emby, Jellyfin, Tautulli, Plex, Ombi, Overseerr, Jellyseerr, Jackett, NZBGet, SABnzbd, ruTorrent, Transmission, qBittorrent , Portainer, Traefik, Speedtest Tracker, PiHole, AdGuard Home, Nginx Proxy Manager, Gotify, Syncthing Relay Server, Authentik, Proxmox и многими другими
  • Настраиваемый внешний вид

Установка homepage

Для установки homepage у вас на сервере должен быть установлен Docker и dockert-compose.

Создадим директорию homepage и в ней файл docker-compose.yml и директорию config

sudo mkdir homepage
cd homepage

В файл docker-compose.yml внесем следующий текст

version: "3.3"
services:
  homepage:
    image: ghcr.io/benphelps/homepage:latest
    container_name: homepage
    ports:
      - 3030:3000
    volumes:
      - ./config:/app/config 
      - /var/run/docker.sock:/var/run/docker.sock:ro 
  dockerproxy:
    image: ghcr.io/tecnativa/docker-socket-proxy:latest
    container_name: dockerproxy
    environment:
        - CONTAINERS=1 # Allow access to viewing containers
        - POST=0 # Disallow any POST operations (effectively read-only)
    ports:
        - 2375:2375
    volumes:
        - /var/run/docker.sock:/var/run/docker.sock:ro # Mounted as read-only
    restart: unless-stopped

Помимо контейнера для homepae будет развернут дополнительный контейнер который позволит интегрировать в панель виджеты с отображением текущих контейнеров, чуть позже мы добавим такой виджет в конфигурацию.

Для того чтобы развернуть контейнеры выполняем команду

docker-compose up -d

После успешной установки переходив по адресу http://server-ip:3030 и попадаем в homepage.

Для того чтобы настроить внешний вид панели нам необходимо будет внести правки в файлы конфигураций которые находятся в директории config.

Подробную информацию о настройке панели вы можете найти в официальной документации homepage.

Настройка homepage

В качестве примера мы выведем такую информацию:

  • Добавим логотип и виджет погоды
  • Добавим сервисы которые установлены в докер контейнерах и статистику по использованию ими ресурсов
  • Ссылки на сервисы
  • Закладки на полезные ресурсы

Для того чтобы добавить логотип и виджет погоды, нам необходимо отредактировать файл widgets.yaml

- logo:
    icon: https://server-ip/logo.png

- resources:
    cpu: true
    memory: true
    disk: /

- search:
    provider: duckduckgo
    target: _blank

- openmeteo:
    label: 🇺🇦Kyiv # optional
    latitude: 50.449684
    longitude: 30.525026
    timezone: Europe/Kiev # optional
    units: metric # or imperial
    cache: 5 # Time in minutes to cache API responses, to stay within limits

Список всех доступных виджетов вы найдете в официальной документации в разделе Information Widgets

Добавим отображение информаци про сервисы Gitea и Portainer а также добавим остальные сервисы которые используются. Для этого отредактируем файл services.yaml. Ниже я приведу свой вариант файла services.yaml. Для каждого сервиса вы можете выбрать любую иконку, в homepage включен набор иконок Dashboard icons, в поле с определением инки достаточно указать имя файла иконки. Более подробнее о том как правильно заполнить файл services.yaml вы можете прочитать на официальном сайте.

- Docker:
    - Gitea:
        icon: gitea.png
        href: http://unixclient.host:3000/
        description: Git service
        server: my-docker
        container: gitea
    - Portainer:
        icon: portainer.png
        href: https://unixclient.host:9443/
        server: my-docker
        container: portainer
        widget:
          type: portainer
          url: https://unixclient.host:9443
          env: 2
          key: ptr_asdDds6nsdwqwqmW1EqwdqwdIA0232dss=
    - Dozzle:
        icon: dozzle.png
        href: http://unixclient.host:8080/
        server: my-docker
        container: dozzle
    - Jellyfin:
        icon: jellyfin.png
        href: http://unixclient.host:9090/
    - Grafana:
        icon: grafana.png
        href: http://unixclient.host:4000/
- Services:
    - Wireguard:
        icon: wireguard.png
        href": http://wireguard.com
    - AdGuard:
        icon: adguard-home.png
        href: http://adguard.com
    - Zabbix:
        icon: zabbix.png
        href: https://unixclient.host:7000/
    - Google:
        icon: google.png
        href: http://google.com/
        ping: http://google.com/

Перейдем к добавлению закладок на полезные ресурсы. Все закладки хранятся в файле bookmarks.yaml. Пример моего файла bookmarks.yaml указан ниже

- Developer:
    - Github:
        - icon: github.png
          href: https://github.com/
    - Stack Overflow:
        - abbr: SO
          href: https://stackoverflow.com/

- UnixHost:
    - UnixHost:
        - icon: tux.png
          href: https://unixhost.pro/
    - Blog:
        - icon: safari-ios.png
          href: https://blog.unixhost.pro
    - Telegram:
        - icon: telegram.png
          href: https://t.me/unixhost
    - Self-hosted Guide by UnixHost:
        - icon: youtube-light.png
          href: https://www.youtube.com/@selfhostedguide

- Entertainment:
    - YouTube:
        - icon: youtube-play.png
          href: https://youtube.com/
    - Netflix:
        - icon: netflix.png
          href: https://netflix.com
    - HBO:
        - abr: HBO
          href: https://www.hbomax.com/

На этом настройка homepage завершена и вы получаете удобную панель с быстрым доступом ко всем необходимым вам ресурсам.