Skip to content

Installation

jv edited this page Jun 3, 2026 · 6 revisions

Installation

There are two ways to run Glance: as a Home Assistant add-on (recommended for most people) or locally for development.


Option 1 — Home Assistant Add-on (Ingress)

Runs on the HA server itself and shows up as the Glance panel in the sidebar. Requires a Supervisor (HA OS or Supervised). HA Container/Core have no add-on store and cannot use this.

One-click

Open the Add repository dialog pre-filled in your own HA:

https://my.home-assistant.io/redirect/supervisor_add_addon_repository/?repository_url=https%3A%2F%2Fgithub.com%2Fjvenuto80%2FDynamic-HA-Dashboard

Then click Add.

The button only adds the repository — it does not install the add-on, and on some HA/browser versions it just opens the Add-on Store without the dialog. If that happens, use the manual steps below.

Manual (always works)

  1. Settings → Add-ons → Add-on Store.
  2. Top-right menu → Repositories.
  3. Paste and Add, then Close:
    https://github.com/jvenuto80/Dynamic-HA-Dashboard
    
  4. Refresh the store. A new Glance — HA Dashboard Add-ons section appears.
  5. Open Glance — HA DashboardInstallStartOpen Web UI (it also appears as Glance in the sidebar).

First install builds from source on your device (clones the repo + npm run build), so it can take several minutes and needs internet access.

Next: Configuration for first-time token setup.

Direct port access (Fully Kiosk Browser, tablets, wall displays)

By default the add-on is served through Ingress only (no exposed port — it inherits HA's authentication). To point a kiosk browser straight at the dashboard, give it a direct port:

  1. Open the add-on → Configuration tab. You'll see a Network card with a row labeled 3000/tcp and an empty box to its left.
  2. In that empty box, type the host port you want — enter 3000 (or any other free port).
  3. Click Save, then Restart the add-on.

Then browse to http://<home-assistant-ip>:<port> — e.g. http://192.168.1.10:3000. Leaving the box empty keeps the add-on on Ingress only (sidebar panel).

Use your HA's IP address, not homeassistant.local, in the kiosk URL — tablets/Fully Kiosk often can't resolve the .local hostname. The dashboard is on port 3000; HA's own API is on 8123 (that's what goes in the dashboard's Server URL setting). There is no port 8124.

The box on the left is the host port (the number you type in your browser). The 3000/tcp label on the right is the container's fixed port — don't change it. There is no separate top-level "Network" tab; the card lives on the Configuration tab (visible once the add-on is started).

Ingress vs. direct port — what to know

Ingress (default) Direct host port
URL Glance sidebar panel http://<ha-ip>:<port>
HA login Required (wraps the dashboard) Not required on that port
Best for Normal + remote use Kiosks/tablets on a trusted LAN

What changes when you set a direct port:

  • You gain a stable, simple URL that kiosk browsers (Fully Kiosk, tablets, wall displays) can auto-launch reliably — no long Ingress token path.
  • No Home Assistant authentication on that port. Anyone who can reach that IP:port on your network sees the dashboard UI with no login prompt.
  • Your HA data stays protected by the token. Glance stores no secrets; it only connects to HA after a long-lived token is entered in Settings (saved per-browser in localStorage). A fresh device hitting the port sees an unconfigured dashboard until a token is added; your already-set-up kiosk keeps showing live data because its token lives in that browser.
  • Keep the port on your LAN. Do not port-forward it to the internet or put it behind an unauthenticated reverse proxy — use Ingress for remote access.
  • Both can run at once. Setting a host port doesn't disable the Ingress sidebar panel; leaving the box empty keeps it Ingress-only.

Recommendation: use the direct port only on trusted LAN kiosk devices, and keep Ingress for normal and remote access.


Option 2 — Local development

npm install
npm run dev        # Vite dev server on http://localhost:3000
npm run build      # tsc -b + vite build  → dist/
npm run preview    # serve the production build

Strict TypeScript is enforced (noUnusedLocals); the build must be 0 errors.

Set connection values via .env (copy .env.example.env) or in the in-app Settings modal. See Configuration.


Updating the add-on

When a new version is published, the add-on page shows an Update button. After updating, restart the add-on so the sidebar panel re-registers (see Troubleshooting if the panel name looks stale).

Update rebuilds the dashboard from the latest source automatically. If you ever need to force a fresh build without a version change (e.g. testing new code on the same version), use the add-on's ⋮ menu → Rebuild.

Clone this wiki locally