Authors: Brandon Hopkins, Suparna Ganguly

Self-hosted homepages are a great way to manage your home lab or cloud services. If you’re anything like me chances are, you have a variety of docker containers, media servers, and NAS portals all over the place. Using simple bookmarks to keep track of everything often isn’t enough. With a self-hosted homepage, you can view everything you need from anywhere. And you can add integrations and other features to help you better manage everything you need to.

Dashy and Homer are two separate static homepage applications. These are used in home labs and on the cloud to help people organize and manage their services, docker containers, and web bookmarks. This article will overview exactly what these self-hosted homepages have to offer.

Dashy

Dashy is a 100% free and open-source, self-hosted, highly customizable homepage app for your server that has a strong focus on privacy. It offers an easy-to-use visual editor, widgets, status checking, themes, and lots more features. Below are the features that you can avail yourself of with Dashy.

[embedded content]

Live Demo: https://demo.dashy.to/

Customize

You can customize your Dashy as how you want to fit in your use case. From the UI, choose from different layouts, show/hide components, item sizes, switch themes, and a lot more. You can customize each area of your dashboard. There are config options available for custom HTML header, footer, title, navbar links, etc. If you don’t need something, just hide it!

Dashy offers multiple color themes having a UI color editor and support towards custom CSS. Since all of the properties use CSS variables, it is quite easy to override. In addition to themes, you can get a host of icon options, such as Font-Awesome, home lab icons, Material Design Icons, normal images, emojis, auto-fetching favicons, etc.

Integrations

Dashy widgets display dynamic content from API-enabled services. Dashy offers 50+ in-built widgets for self-hosted services, monitoring, and productivity. The status monitoring feature is enabled for your apps and links. With status indicators, you can get an overview of your apps’ health status. Once this feature is enabled, a small dot is shown next to every application indicating whether the app is up and online. That’s how the basic availability and uptime checking can be done. 

Security

Want to protect your dashboard? Dashy’s Authentication feature is there for you. The Basic Auth is very simple and quick to enable. It provides support for multiple users having granular controls. Also, Dashy offers support for multi-user access, Keycloak, and other SSO providers. Optional, end-to-end encrypted, and free cloud backup and restore feature is included. This allows you to have config backed up off-site. This also helps sync data between various instances.

Using Dashy

You can choose an app launch method from the options given, such as by default or by right-clicking on the particular app. Apps can be opened either in a new tab, same tab, pop-up modal, or in a workspace view.

To search, simply type what you’re finding, and results will pop up. Use arrow keys and tab to navigate, and then press enter to launch. Custom shortcuts can be created for most-often used apps, and custom tags for smoother searching. You can also do a web search using a search engine via Dashy.

Dashy has alternate views enabled. With Dashy’s minimal view, you can use Dashy as a fast-loading browser homepage. You’ll also get a workspace view so that you can simultaneously switch between multiple apps without leaving the page.

Multi-Language Support

Multi-language support is provided. Dashy’s UI is translated into multiple languages, such as English, French, Dutch, German, Slovenian, etc. Your language needs to be automatically applied, or you can choose to change it from the config menu.

Other Features

– Dashy offers an easy single-file YAML-based configuration if you’d prefer this over configuring the application through the UI.

– Dashy has a small bundle size, highly responsive UI, and a PWA for basic offline access.

Homer

The name Homer is actually a play on works as it functions as a HOMepage for your servER. Homer is a completely static, open-source, html/js dashboard built with the source in /src using Webpack. Homer isn’t nearly as feature rich as Dashy, but it’s still preferred by many users as it is incredibly simple, lightweight, and despite the customization option of both there are differences when the overall design, be sure to checkout the live demos of both.

It’s served by an HTTP server. Homer doesn’t work if you open dist/index.html over file:// protocol directly. You can check their documentation page to know more about the configuration.

Live Demo: https://homer-demo.netlify.app/

Customize

Homer is very customizable with a single YAML configuration file. You can easily change the number of columns, upload custom icons, add sections, toggle dark or light themes, add background images, and a lot more. This YAML configuration file uses block formats to create new links, integrations, and you have the ability to group these entries. Unlike Dashy there is not an interactive interface to perform customization tasks.

Integrations

Homer has some integration so you can see service status and live information updates within your static homepage. These integrations are called custom services. Adding these custom services within Homer is as simple as adding a custom entry within the YAML configuration for the specific service.

At the moment the services available include PiHole, OpenWeatherMap, Medusa, Lidarr, Ping, Prometheus, and Portainer. Most of these services will require a custom API key and some extra work. You can learn more about these on their Custom Services GitHub page.

Using Homer

Once you have everything configured in the YAML file using Homer is quite simple. The only setting options you get within the dashboard is the ability to switch between a light and dark theme (colors are configurable) and a simple layout switcher between stacked and horizontal grouping.

Deployment

Both of these services are easily deployed through a docker container whether that be on your home server or on your very own instance of Linode. Being that both of the static homepages are incredibly lightweight it’s easy to add these containers alongside others on a single Linode. If you don’t already have an account you can get a $100 60 day to try out Linode today. In your new Linode account you can use their easy one click marketplace to launch a server with Docker ready to go!

To see step-by-step instructions to get these running checkout the video above. To quickly start these containers we can use the following commands.

Homer: bastienwirtz (Bastien Wirtz) · GitHub

docker run -d -p 8080:8080 -v </your/local/assets/>:/www/assets --restart=always b4bz/homer:latest

Dashy: GitHub – Lissy93 · GitHub

docker run -d -p 4000:80 -v /root/my-local-conf.yml:/app/public/conf.yml --name my-dashboard --restart=always lissy93/dashy:latest

Summary

If you’re looking for a self-hosted dashboard that’s static, customizable, and open-source, you can surely choose any of them. But in case, you particularly want something that’s lightweight and loads fast, Homer would be ideal for you. On the other hand, if you need your self-hosted static homepage that offers various features, such as multi-language support, cloud backup, alternate views, etc., Dashy is recommended for you. I hope this article will help you make the right choice of a self-hosted static homepage for yourself.

Posted by Contributor