Introduction: Say Hello to Homepage 👋

I've been running a homelab for a while and I've seen a couple different dashboard apps around. They are a nice little bonus to your setup, to put a bit of a face on things and pull it all together, but this one impressed me.

With Homepage, you can easily access everything you need, all in one place. Whether you want to see at a glance the weather, system resources, media streaming stats and more, Homepage has got you covered. Choose from various widgets to display the information that matters most to you.

Homepage is also mobile-friendly, so you can take it on the go. No matter where you are, you can access your personalized dashboard and stay up-to-date with everything that matters.

With Homepage, you can easily organize your favorite websites in one place—no more bookmarking pages and losing them in the endless abyss of your browser. Add the links to your Homepage and access them anytime, anywhere.

Getting Started

If you'd like to load it up using Docker, they have you covered on the Homepage Github.

For my pattern of Kubernetes with Ansible, here is what it looks like: (you can clone my code here)

apiVersion: apps/v1
kind: Deployment
metadata:
  name: homepage
spec:
  replicas: 1
  selector:
    matchLabels:
      app: homepage
  template:
    metadata:
      labels:
        app: homepage
    spec:
      volumes:
        - name: data-mount0
          persistentVolumeClaim:
            claimName: homepage-pvc0
      containers:
        - name: homepage
          image: ghcr.io/benphelps/homepage:latest
          ports:
            - containerPort: 3000
          volumeMounts:
            - mountPath: '/app/config'
              name: data-mount0
          resources:
            limits:
              cpu: 500m
              memory: 512Mi
            requests:
              cpu: 250m
              memory: 256Mi
          imagePullPolicy: Always

apiVersion: v1
kind: PersistentVolume
metadata:
  name: homepage-pv0
  labels:
    type: local
spec:
  capacity:
    storage: 1Gi
  volumeMode: Filesystem
  accessModes:
    - ReadWriteMany
  persistentVolumeReclaimPolicy: Delete
  storageClassName: homepage-disk0
  hostPath:
    path: '/your/local/folder' # Change this to a real value
---
apiVersion: v1
kind: PersistentVolumeClaim
metadata:
  name: homepage-pvc0
spec:
  storageClassName: homepage-disk0
  accessModes:
    - ReadWriteMany
  resources:
    requests:
      storage: 1Gi

apiVersion: v1
kind: Service
metadata:
  name: homepage
  labels:
    app: homepage
spec:
  type: NodePort
  ports:
    - port: 80
      targetPort: 3000
  selector:
    app: homepage

apiVersion: networking.k8s.io/v1
kind: Ingress
metadata:
  name: homepage
  annotations:
    kubernetes.io/ingress.class: nginx

    # type of authentication
    nginx.ingress.kubernetes.io/auth-type: basic
    # name of the secret that contains the user/password definitions
    nginx.ingress.kubernetes.io/auth-secret: basic-auth-secret
    # message to display with an appropriate context why the authentication is required
    nginx.ingress.kubernetes.io/auth-realm: 'Authentication Required'
spec:
  rules:
    - host: homepage.yourdomain.com # Change this to your domain
      http:
        paths:
          - backend:
              service:
                name: homepage
                port:
                  number: 80
            path: /
            pathType: Prefix

Then the Ansible part for installing looks like this:

- hosts: localhost
  collections:
    - kubernetes.core
  vars:
    - namespace: homepage
  tasks:
    - name: (homepage) Create namespace
      kubernetes.core.k8s:
        name: '{{ namespace }}'
        api_version: v1
        kind: Namespace
        state: present

    - name: (homepage) Deploy Ingress
      kubernetes.core.k8s:
        state: present
        namespace: '{{ namespace }}'
        src: ../ingress.yaml

    # Optional: Remove this section if you don't want basic auth
    - name: (homepage) Add Basic Auth
      k8s:
        definition:
          api_version: v1
          kind: Secret
          metadata:
            namespace: '{{ namespace }}'
            name: basic-auth-secret
          state: present
          type: Opaque
          data:
            auth: "{{ lookup('ansible.builtin.template', '../auth') | b64encode }}"

    - name: (homepage) Attach storage volume
      kubernetes.core.k8s:
        state: present
        namespace: '{{ namespace }}'
        src: ../pv0.yaml

    - name: (homepage) Deploy Service
      kubernetes.core.k8s:
        state: present
        namespace: '{{ namespace }}'
        src: ../service.yaml

    - name: (homepage) Deployment
      kubernetes.core.k8s:
        state: present
        namespace: '{{ namespace }}'
        src: ../deployment.yaml

Then to bring it up on your cluster you'd run:

ansible-playbook ansible/install.yaml

What Homepage Can Do for You

You can use it for useful links you find, your homelab services, or even for work!

Services

In Homepage, all the links you see in the centre page are called services. I'd suggest giving their docs a quick read. They're short and sweet and quickly go over how the basics work with services, groups and additional features. The ping and docker integrations here are useful.

Service Widgets

Service widgets are like services, but they provide additional information on them. Things like Uptime Kuma, Synology, Unifi, Plex, Sonarr and many more. You can find the list of apps they support right here.

As you can see, you can add useful widgets and customize your Homepage to fit your needs and preferences.

Information Widgets

Their information widgets are along the top of the dashboard. They show things like your resource usage, weather or a search bar. You can find more of what they support here.

Bookmarks

Bookmarks are at the bottom of the dashboard. They can be some links you find useful but don't use all the time.

Collaborate with Others by Sharing

Of course it's great to have all your own links organized for yourself but sharing with others is another great use case. Collaboration is vital in today's digital world, and Homepage makes it easy to work with others by sharing your dashboard.

If you're working on a project with a team, you can share your Homepage and make sure everyone has access to the same resources. This can help streamline communication and ensure everyone is on the same page.

So whether you're collaborating with coworkers or connecting with friends, Homepage's sharing feature makes it easy to work together and stay productive. Try it and see how it can improve your online collaboration today!

Competition

There are similar apps out there you can try out as well if you want something to compare Homepage to. Here are a few of the more popular ones I've heard of:

• Heimdall - Simple, easy going and no fuss, but you can't group items
• Dashy - Looks good and has all the bells and whistles but can be complicated
• Homer - Simple, has item grouping but I found editing the config very complicated and error prone
• Homarr - A bit dated and janky looking, even though its less than a year old. Probably not worth looking into but maybe they can turn it around 🤷‍♂️

If you were going to look into any others, I'd recommend Dashy and Heimdall.

Summary

In summary, use Homepage to keep your services, handy links, bookmarks easily accessible and sharable.

I hope you found this useful. If you have suggestions on future topics you'd like to see, message me on LinkedIn.