Project website launched
With the core application logic well underway, it felt like the right time to give MapXr a proper home on the web. This entry covers the decisions behind the site's technical stack and structure.
Stack choices
The site lives inside the existing monorepo at mapxr-site/. Since the app itself
already uses Svelte 5 and Vite, reusing those tools was a natural fit. No context switching,
and the same Tailwind + DaisyUI pair used in the main UI carries over cleanly.
- Svelte 5 with runes (
$state,$derived,$effect) - Tailwind CSS v4 via its native Vite plugin (no
postcss.configneeded) - DaisyUI v5 for component classes (
navbar,hero,card,steps, etc.) - Hash-based routing: no router library, just
window.location.hashand a$staterune
Why hash routing?
GitHub Pages serves static files from a single directory. Any URL that doesn't correspond to an
actual file returns a 404. Hash routing sidesteps this entirely. The browser never sends the
fragment to the server, so #/docs/triggers and #/devlog both load index.html without any redirect tricks.
Lazy-loaded doc pages
Each documentation topic is a plain .svelte file under src/docs-pages/.
Vite's import.meta.glob discovers them at build time and splits each into its own
JS chunk. Navigating to a doc page fetches only that page's chunk. The rest stay unloaded until
needed. The same pattern is used for devlog articles.
Theme
DaisyUI's corporate theme is the light default; business is the dark
alternative. The toggle reads prefers-color-scheme on first visit so the site
matches the user's OS preference without any stored setting.
Deployment
A GitHub Actions workflow at .github/workflows/deploy-site.yml triggers on any push
to main that touches mapxr-site/**. It runs npm ci && npm run build then pushes mapxr-site/dist to the gh-pages branch via peaceiris/actions-gh-pages.