Apps
Webapp
De React 19 + Vite + Mapbox SPA in apps/web.
De webapp is een single-page application gebouwd met React 19, Vite 8 en Mapbox GL 3.
Structuur
apps/web/
├── src/
│ ├── components/ # Map, sidebar, controls
│ ├── routes/ # TanStack Router routes
│ ├── lib/ # Web-specific glue
│ ├── hooks/ # React hooks
│ └── main.tsx # Entry
├── public/ # Static assets
├── nginx.conf # Production server config
├── entrypoint.sh # Runtime env injection
├── Dockerfile # Multi-stage build → nginx
└── vite.config.tsBelangrijkste dependencies
| Library | Waarom |
|---|---|
mapbox-gl + react-map-gl | De kaart |
@tanstack/react-router | Type-veilige routing met code-split routes |
@tanstack/react-query | Caching van serverstate |
zustand | Clientstate (uit @routess/core) |
tailwindcss v4 | Styling, gethematiseerd via @routess/design-tokens |
@radix-ui/* | Headless UI-primitieven |
@react-oauth/google | Google-aanmeldknop |
Runtime-configuratie
De Dockerfile bouwt met placeholderwaarden. Bij het starten van de container vervangt entrypoint.sh de echte waarden uit de omgevingsvariabelen in de gebouwde JS-bestanden. Zo kan één image door de verschillende omgevingen worden gepromoveerd zonder opnieuw te bouwen.
Scripts
bun run dev # Vite dev server
bun run build # Production build
bun run preview # Preview the production build locally
bun run test # bun test + happy-dom
bun run check-types # tsc --noEmit