50 lines
2.0 KiB
Markdown
50 lines
2.0 KiB
Markdown
# CLAUDE.md — Pamietnik Webapp
|
|
|
|
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
|
|
|
|
## Stack
|
|
|
|
- **Sprache:** TypeScript (strict)
|
|
- **Build:** Vite
|
|
- **UI:** Vanilla Web Components (kein Framework)
|
|
- **Karte:** MapLibre GL JS + OpenStreetMap Tiles (konfigurierbare Tile-URL)
|
|
- **Kein CSS-Framework** — minimales handgeschriebenes CSS
|
|
|
|
## Befehle
|
|
|
|
```bash
|
|
npm install # Dependencies installieren
|
|
npm run dev # Dev-Server auf :5173 (proxied /v1, /login, /logout → :8080)
|
|
npm run build # TypeScript-Check + Vite-Build nach dist/
|
|
npm run typecheck # Nur TypeScript-Prüfung ohne Build
|
|
npm run preview # Build-Ergebnis lokal vorschauen
|
|
```
|
|
|
|
Das Backend muss lokal auf `:8080` laufen (siehe `../backend/`).
|
|
|
|
## Architektur
|
|
|
|
```
|
|
src/
|
|
main.ts App-Bootstrap, Routen registrieren
|
|
router.ts History-API-Router (keine externe Library)
|
|
api.ts Alle fetch()-Wrapper + TypeScript-Typen für API-Responses
|
|
auth.ts Login/Logout (POST /login, POST /logout)
|
|
style.css Globaler Reset + Basis-Layout
|
|
components/
|
|
app-shell.ts Hauptkomponente: Navigation + Router-Outlet
|
|
login-page.ts Login-Formular
|
|
days-page.ts Tagesübersicht (GET /v1/days)
|
|
day-detail-page.ts Tagesdetail + Karte (GET /v1/trackpoints|stops|suggestions)
|
|
track-map.ts MapLibre-Wrapper als isolierte Web-Component
|
|
```
|
|
|
|
## Konventionen
|
|
|
|
- Alle API-Typen (Trackpoint, Stop, Suggestion, DaySummary) sind in `api.ts` definiert
|
|
- Alle `fetch()`-Aufrufe laufen über `api.ts` — kein direktes `fetch()` in Komponenten
|
|
- Auth-State wird über Session-Cookie gehalten (`credentials: 'include'` bei jedem Request)
|
|
- 401-Response in `api.ts` → automatischer Redirect auf `/login`
|
|
- Tile-URL der Karte ist als Property auf `<track-map>` konfigurierbar (REQ-MAP-02)
|
|
- Neue Routen in `main.ts` registrieren (via `route()`), neue Komponenten in `components/` anlegen und in `main.ts` importieren
|