Wortwerk – Englisch bis C1
Vokabeltrainer als Web-App (PWA) nach dem Vorbild von Vocabuo – mit drei Erweiterungen:
- Geschichten: Sobald 10 Wörter gesehen, aber noch nicht sicher sind, schreibt die KI eine kurze Geschichte mit genau diesen Wörtern – gemischt mit Wörtern, die schon sitzen – mit Vorlesefunktion, Verständnisfragen und Lückentext.
- Themen: Wähle, aus welchen Themen neue Wörter kommen (z. B. Reisen, Camping, Radfahren), und lege eigene Themen an, die die KI mit Wörtern füllt. Jede Geschichte entsteht aus einem Thema.
- FSRS-5 statt fester Stufen: drei Bewertungen (Muss ich noch lernen / Unsicher / Wusste ich). „Muss ich noch lernen“-Wörter kommen in jeder Sitzung zwischendurch wieder dran, bis sie zweimal hintereinander sitzen.
- C1-orientierte Karten: Niveau-Tags (B1–C1), Themen, Kollokationen, False-Friend-Warnungen.
Wortschatz
Rund 3.300 Wörter (B1 ≈ 1.030, B2 ≈ 1.320, C1 ≈ 930) in 22 Themen – jedes mit Übersetzung, Beispielsatz EN/DE und Hinweisen (False Friends, Kollokationen, britisch/amerikanisch). Weitere Wörter lassen sich in der App je Thema mit „+ KI“ ergänzen oder dauerhaft in data/*.txt eintragen (danach node tools/build-words.mjs).
Funktionen
- Startseite mit Serie, Tageskarte (fällige + neue Wörter) und Fortschritt Richtung C1
- Lernkarten: deutsche Bedeutung + Lückensatz → englisches Wort, optional eintippen, Hinweis, „Kenne ich schon“
- Wortschatz mit Suche, Filter nach Niveau, eigene Wörter, „Mit KI ausfüllen“ und „Wortliste mit KI erweitern“
- Statistik: Fälligkeiten, Gedächtnisstabilität, Aktivität, Trefferquote (einheitliche Definition: „gelernt“ = Intervall ≥ 21 Tage)
- Offline-fähig, auf dem iPhone als App installierbar, Sprachausgabe über die eingebaute Stimme
- Sicherung als JSON herunterladen / laden
Lokal starten (Mac)
Voraussetzung: Node.js 18+ (brew install node).
git clone https://github.com/my-project-26/Sprachen.git
cd Sprachen
cp .env.example .env # optional: API-Key eintragen
node server.js
Dann http://localhost:5173 öffnen.
KI-Anbieter
In der App unter Einstellungen → KI-Server wählbar. Es reicht einer:
| Anbieter | Kosten | Einrichtung |
|---|
| Ollama (lokal) | kostenlos | Ollama-App starten, Modell laden: ollama pull gemma3 – kein Key nötig |
| Gemini | Gratis-Kontingent (begrenzt) | Key in Google AI Studio → GEMINI_API_KEY in .env |
| Claude | ca. 1 Cent pro Geschichte | Key in der Anthropic Console → ANTHROPIC_API_KEY in .env |
Ohne jeden Anbieter funktionieren Geschichten im manuellen Modus (Prompt kopieren → in Claude/Gemini-App einfügen → Antwort zurück einfügen).
Online stellen mit GitHub Pages (kostenlos, ohne Server)
- Im Repo auf GitHub: Settings → Pages → Source Deploy from a branch → Branch main, Ordner / (root) → Save.
- Nach 1–2 Minuten läuft die App unter https://my-project-26.github.io/Sprachen/.
- Geschichten funktionieren dort ohne Key über eine kostenlose KI (pollinations.ai). Optional kann jeder unter Einstellungen → KI-Server einen eigenen Gemini-Key eintragen (zuverlässiger; bleibt nur auf dem Gerät). Ist ein Modell überlastet, probiert die App automatisch Ersatzmodelle und danach die kostenlose KI.
Online stellen (Vercel, kostenlos, mit Server)
- Auf https://vercel.com mit GitHub anmelden → Add New → Project → Repo
Sprachen importieren (keine Build-Einstellungen nötig).
- Unter Settings → Environment Variables eintragen:
ANTHROPIC_API_KEY = dein SchlüsselAPP_SECRET = ein langes Passwort (schützt deine KI-Kosten, da die URL öffentlich ist)- optional
ANTHROPIC_MODEL (Standard claude-sonnet-5-5, günstiger claude-haiku-5-5)
- Deployen. In der App unter Einstellungen → KI-Server das
APP_SECRET eintragen und „Verbindung testen“.
Auf dem iPhone installieren: URL in Safari öffnen → Teilen → „Zum Home-Bildschirm“.
Der Lernfortschritt liegt im Browser des jeweiligen Geräts. Für einen Gerätewechsel: Einstellungen → Sicherung herunterladen / laden.
Aufbau
index.html, styles.css Oberfläche
js/app.js Ansichten und Ablauf
js/fsrs.js FSRS-5-Planer
js/store.js Speicherung (localStorage), Tageslogik
js/words.js Themen + Startwortschatz
js/wordbank.js großer Wortschatz (automatisch erzeugt aus data/)
data/*.txt Wortlisten je Thema (B1/B2/C1), Quelle für wordbank.js
tools/build-words.mjs baut js/wordbank.js: `node tools/build-words.mjs`
js/prompts.js KI-Prompts (von Server und manuellem Modus genutzt)
js/api.js, js/tts.js Server-Aufrufe, Sprachausgabe
api/_llm.js Anbindung Claude / Gemini / Ollama
api/story.js POST: Geschichte erzeugen
api/words.js POST: Wörter generieren / Karte ausfüllen
api/health.js GET: Verbindungstest
server.js lokaler Server ohne Abhängigkeiten
sw.js, manifest.webmanifest PWA / Offline
Ideen für die nächsten Schritte
- Eigene Sätze schreiben mit KI-Korrektur (aktive Produktion für C1)
- Wortfamilien (establish → establishment → established) als eigene Kartenseite
- Synchronisierung zwischen Geräten (z. B. Supabase)
- Wechselnde Beispielsätze pro Wiederholung
- FSRS-Parameter aus den eigenen Wiederholungsdaten optimieren
Designs
Unter Einstellungen → Design gibt es 3 Designs: iOS-Glas (Standard), Bordkarte und Vokabelheft.
Jedes hat ein eigenes Layout für Startseite und Lernkarte (js/skins.js), alle übrigen Seiten passen sich über skins.css an.
Niveaus
Der Wortschatz deckt A1 bis C1 ab (rund 4.400 Wörter). A1/A2-Listen liegen in data/*.a.txt.
Unter Einstellungen → „Neue Wörter ab Niveau“ legst du fest, ab welchem Niveau neue Wörter kommen.
