Custom Front-Ends
Curiosity Workspaces let you replace or extend the default UI by writing C# against the Tesserae component toolkit. The code is transpiled to JavaScript by the h5 compiler and uploaded as a bundle that the workspace serves at runtime.
Use a custom front-end when you need:
- An entity-centric experience (device pages, account pages, case workflows).
- A curated search UI scoped to one node type, with domain facets.
- A chat surface that calls your own endpoints and renders domain-specific citations.
- A non-default sidebar / navigation layout.
If you only need to tweak a CSS variable or add one extra view, custom-styling.md and routing-navigation.md are the right starting points without writing a full app.
What a Tesserae app looks like
There's no Main(). Static initialization in the App class registers the routes and the workspace mounts the first one when the page loads.
The real App entry point in the Curiosity source is in FrontEnd/Mosaik.FrontEnd/src/App.cs — a public static partial class App that other App.*.cs files extend (App.Sidebar.cs, App.DefaultRouting.cs, etc.).
In this section
- Development workflow — install h5 and the CLI, run locally, deploy.
- Tesserae basics — components, layouts, async rendering.
- Curiosity components — pre-built widgets for search, graph, neighbors.
- Node renderers — customize how a node looks across the workspace.
- Routing and navigation — register routes, customize the sidebar.
- State management — observables and reactive UI.
- Custom styling — CSS, theme variables, dark mode.
Where the front-end source lives
If you want to read the production app code as a reference, the in-tree front-end is at mosaik/FrontEnd/Mosaik.FrontEnd/. Every App.*.cs file is a partial of the same static App class.