The standard behavior of
hyper:// is to serve whichever file is referenced by the URL. This works fine for simple use-cases, but struggles with two use-cases:
- Sites which need a consistent theme and template applied across each page.
- Applications which need to serve interfaces even where a file does not exist (as in the Single Page Application pattern).
To solve this, the
hyper:// protocol supports a behavior called "Frontends."
How frontends work
A Frontend is simply an html file found at
/.ui/ui.html. This file is used to provide a consistent interface for the site. It is served rather than the target file in the following cases:
- No file exists at the target URL.
- The target URL is a folder.
- The "Accept" header includes text/html (which indicates the browser is asking for a "page").
window.location.pathname and then place that in the UI, as in this example snippet:
An advantage of Frontends is that they are stored in a subfolder. This makes it possible for frontends to be their own Hyperdrive sites which are mounted to
Frontend hyperdrives can then be published and shared across multiple sites.