LiveBoard Deutschland (Vue + Vuetify + PWA)

Single Page App zur Anzeige von Abfahrten & Ankünften für alle deutschen Bahnhöfe – mit moderner Material-UI, PWA (offlinefähig) und Benachrichtigungen.

Features

• Bahnhofs-Auswahl: Suchfeld (alle deutschen Bahnhöfe), initial Vorschau mit Top‑10 größten Bahnhöfen
• Richtung: Abfahrten, Ankünfte oder beides
• Zeitfenster (1–12 Stunden) und Auto-Reload-Intervall konfigurierbar
• Tabelle mit: Typ, Zug, Von, Nach, Plan/Prognose, Gleis, Verspätung (farblich codiert)
• Zugnummer-Suche (clientseitige Filterung)
• Watchlist mit Glocke: lokale Benachrichtigungen kurz vor/bei Eintreffen
• PWA: Startbildschirm, Offline-Cache, Service Worker, Theme (Light/Dark) mit Toggle

Tech-Stack

• Vite
• Vue 3 (SFC, Composition API)
• Vuetify 3 (Material Design)
• transport.rest (DB/HAFAS)

Entwicklung

npm install
npm run dev

Öffne anschließend http://localhost:5173.

Benachrichtigungen verwenden

1. Im Tabelleneintrag eines Zuges auf die Glocke klicken, um diesen Zug zu beobachten.
2. Browser um Erlaubnis für Benachrichtigungen bitten lassen und bestätigen.
3. Die App prüft alle 20 Sekunden und sendet eine Vorwarnung (< 2 Min) sowie eine "Jetzt"-Meldung.

Hinweise:

• iOS (16.4+): Für Benachrichtigungen App zum Home-Bildschirm hinzufügen (PWA) und Notifications erlauben.
• Android/Chrome: Direkt im Browser nutzbar.
• Aktuell lokal getriggert (keine Server-Pushes). Für echte Push-Nachrichten wäre später eine Push-Subscription (VAPID) nötig.

PWA

• Manifest: public/manifest.webmanifest (Icons unter public/icons/ ergänzen: 192/512, maskable)
• Service Worker: src/service-worker.js (Cache v2; network-first für API, cache-first für statische Assets)
• Installation: Über Browser-Einladung "Zum Home-Bildschirm hinzufügen" oder Browser-Menü.

Deployment

npm run build

Build liegt in dist/. Statisches Hosting (z.B. GitHub Pages, Netlify, Vercel) genügt.

Datenquelle & Haftung

Daten via https://transport.rest (v5/v6 Fallback). Alle Angaben ohne Gewähr.