Frontend Architecture

Technology Choices

The frontend is a single-page app composed of a core library and several add-on libraries that can also run standalone without a server backend. In part, this is due to the development history of the project, which started as a pure static single-page app in 2017. To upgrade the tech stack, we are now using the following frontend tools and frameworks.

npm

Package Manager

esbuild

Code bundler

TypeScript

Type annotations for JavaScript

Svelte

Core frontend framework

TailwindCSS

Styling and theming

DaisyUI

Pre-defined UI components

openapi-typescript

Auto-generated types for REST API

openapi-fetch

Typesafe REST API calls

Note

More to come as the UI will be built.

../_images/ui-application-frame.png

Very early frontend layout sketch