diff --git a/README.md b/README.md
new file mode 100644
index 0000000..b1b0e0e
--- /dev/null
+++ b/README.md
@@ -0,0 +1,89 @@
+# MathQuest - Mathe-Lernseite für Kinder
+
+Eine einfache und spaßige Mathe-Lernseite mit Quest-Punktesystem für Kinder.
+
+## Features
+
+- 🎯 Einfache Mathe-Aufgaben (Addition, Subtraktion, Multiplikation)
+- ⭐ Quest-Punktesystem - jede Aufgabe gibt Punkte
+- 📊 Fortschrittsbalken zur Visualisierung der Gesamtpunktzahl
+- 💾 Persistente Speicherung der Punkte (JSON-Datei)
+- 🎨 Kindgerechtes, buntes Design
+
+## Installation
+
+1. Node.js installieren (falls noch nicht vorhanden)
+
+2. Abhängigkeiten installieren:
+```bash
+npm install
+```
+
+## Starten
+
+```bash
+npm start
+```
+
+Die Seite läuft dann auf `http://localhost:3000`
+
+## Auf VPS deployen
+
+1. Code auf den VPS hochladen
+2. `npm install` ausführen
+3. Mit PM2 oder systemd als Service laufen lassen:
+
+### Mit PM2:
+```bash
+npm install -g pm2
+pm2 start server.js --name mathquest
+pm2 save
+pm2 startup
+```
+
+### Mit systemd:
+Erstelle eine Service-Datei `/etc/systemd/system/mathquest.service`:
+```ini
+[Unit]
+Description=MathQuest Server
+After=network.target
+
+[Service]
+Type=simple
+User=dein-user
+WorkingDirectory=/pfad/zum/mathquest
+ExecStart=/usr/bin/node server.js
+Restart=always
+
+[Install]
+WantedBy=multi-user.target
+```
+
+Dann:
+```bash
+sudo systemctl enable mathquest
+sudo systemctl start mathquest
+```
+
+4. Nginx als Reverse Proxy konfigurieren (optional)
+
+## Architektur
+
+- **tasks.json**: Enthält alle Mathe-Aufgaben (Fragen, Antworten, Punkte)
+ - Wird beim Prüfen von Antworten aktualisiert
+ - Speichert `userAnswer` und `isCorrect` für jede Aufgabe
+- **Backend**: Prüft Antworten und speichert sie direkt in der Task
+- **Frontend**: Lädt Aufgaben, berechnet Gesamtpunktzahl aus korrekt beantworteten Aufgaben
+
+## API Endpoints
+
+- `GET /api/tasks` - Lädt alle Aufgaben (inkl. gespeicherte Antworten)
+- `POST /api/check-answer` - Prüft eine Antwort (taskId, answer)
+ - Speichert `userAnswer` und `isCorrect` in der Task
+ - Gibt zurück: `correct`, `correctAnswer`, `points`
+
+## Anpassungen
+
+- Aufgaben können in `tasks.json` angepasst werden
+- Design kann in `public/style.css` angepasst werden
+- Port kann über Umgebungsvariable `PORT` geändert werden
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..fe66def
--- /dev/null
+++ b/package.json
@@ -0,0 +1,17 @@
+{
+ "name": "mathquest",
+ "version": "1.0.0",
+ "description": "Mathe-Lernseite für Kinder mit Quest-Punkten",
+ "main": "server.js",
+ "scripts": {
+ "start": "node server.js",
+ "dev": "node server.js"
+ },
+ "keywords": ["math", "learning", "kids"],
+ "author": "",
+ "license": "MIT",
+ "dependencies": {
+ "express": "^4.18.2",
+ "cors": "^2.8.5"
+ }
+}
diff --git a/public/app.js b/public/app.js
new file mode 100644
index 0000000..f387c43
--- /dev/null
+++ b/public/app.js
@@ -0,0 +1,202 @@
+// API Base URL
+const API_BASE = '';
+
+// Globale Variablen
+let totalPoints = 0;
+let tasks = [];
+
+// Initialisiere die App
+async function init() {
+ await loadTasks();
+ calculateTotalPoints();
+ renderTasks();
+ updateProgress();
+}
+
+// Berechne Gesamtpunktzahl aus abgeschlossenen Aufgaben
+function calculateTotalPoints() {
+ totalPoints = tasks
+ .filter(task => task.isCorrect === true)
+ .reduce((sum, task) => sum + (task.points || 0), 0);
+ updatePointsDisplay();
+}
+
+// Lade Aufgaben vom Server
+async function loadTasks() {
+ try {
+ const response = await fetch(`${API_BASE}/api/tasks`);
+ const data = await response.json();
+ tasks = data.tasks || [];
+ } catch (error) {
+ console.error('Fehler beim Laden der Aufgaben:', error);
+ tasks = [];
+ }
+}
+
+// Rendere Aufgaben
+function renderTasks() {
+ const container = document.getElementById('taskContainer');
+ container.innerHTML = '';
+
+ tasks.forEach(task => {
+ const taskCard = document.createElement('div');
+ taskCard.className = 'task-card';
+ taskCard.id = `task-${task.id}`;
+
+ const isCompleted = task.isCorrect === true;
+ const hasAnswer = task.userAnswer !== undefined;
+
+ taskCard.innerHTML = `
+
+ ${task.question}
+
+
+
+
+
+ ${isCompleted ? '✅ Richtig beantwortet!' : hasAnswer && !isCompleted ? '❌ Falsch - versuche es nochmal!' : ''}
+
+ `;
+
+ if (isCompleted) {
+ const statusEl = taskCard.querySelector('.task-status');
+ statusEl.className = 'task-status success';
+ } else if (hasAnswer && !isCompleted) {
+ const statusEl = taskCard.querySelector('.task-status');
+ statusEl.className = 'task-status error';
+ }
+
+ container.appendChild(taskCard);
+ });
+}
+
+// Prüfe Antwort
+async function checkAnswer(taskId) {
+ const task = tasks.find(t => t.id === taskId);
+ if (!task) return;
+
+ const input = document.getElementById(`input-${taskId}`);
+ const status = document.getElementById(`status-${taskId}`);
+ const button = input.nextElementSibling;
+
+ const userAnswer = parseInt(input.value);
+
+ if (isNaN(userAnswer)) {
+ status.textContent = 'Bitte gib eine Zahl ein!';
+ status.className = 'task-status error';
+ return;
+ }
+
+ // Prüfe ob Aufgabe bereits korrekt beantwortet wurde
+ if (task.isCorrect === true) {
+ status.textContent = '✅ Diese Aufgabe wurde bereits richtig beantwortet!';
+ status.className = 'task-status completed';
+ return;
+ }
+
+ // Sende Antwort an Backend zur Prüfung
+ try {
+ const response = await fetch(`${API_BASE}/api/check-answer`, {
+ method: 'POST',
+ headers: {
+ 'Content-Type': 'application/json'
+ },
+ body: JSON.stringify({ taskId, answer: userAnswer })
+ });
+
+ const data = await response.json();
+
+ // Lade Tasks neu, um die gespeicherte Antwort zu erhalten
+ await loadTasks();
+ calculateTotalPoints();
+
+ if (data.correct) {
+ status.textContent = '🎉 Richtig! Super gemacht!';
+ status.className = 'task-status success';
+
+ // Deaktiviere Input und Button
+ input.disabled = true;
+ button.disabled = true;
+
+ // Zeige Erfolgsnachricht
+ showMessage(`🎉 ${data.points} Quest-Punkte verdient!`, 'success');
+ } else {
+ status.textContent = '❌ Nicht ganz richtig. Versuch es nochmal!';
+ status.className = 'task-status error';
+ input.focus();
+ }
+
+ // Rendere Tasks neu, um den aktuellen Status anzuzeigen
+ renderTasks();
+ updateProgress();
+ } catch (error) {
+ console.error('Fehler beim Prüfen der Antwort:', error);
+ status.textContent = 'Fehler beim Prüfen. Bitte versuche es erneut.';
+ status.className = 'task-status error';
+ }
+}
+
+// Aktualisiere Punkte-Anzeige
+function updatePointsDisplay() {
+ document.getElementById('totalPoints').textContent = totalPoints;
+}
+
+// Berechne maximale mögliche Punkte (Summe aller Tasks)
+function calculateMaxPoints() {
+ return tasks.reduce((sum, task) => sum + (task.points || 0), 0);
+}
+
+// Aktualisiere Progress-Balken
+function updateProgress() {
+ const maxPoints = calculateMaxPoints();
+ const percentage = maxPoints > 0 ? Math.min((totalPoints / maxPoints) * 100, 100) : 0;
+
+ const progressBar = document.getElementById('progressBar');
+ const progressText = document.getElementById('progressText');
+
+ progressBar.style.width = `${percentage}%`;
+ progressText.textContent = `${totalPoints} / ${maxPoints}`;
+}
+
+// Zeige Nachricht
+function showMessage(text, type) {
+ const message = document.getElementById('message');
+ message.textContent = text;
+ message.className = `message ${type} show`;
+
+ setTimeout(() => {
+ message.classList.remove('show');
+ }, 3000);
+}
+
+// Enter-Taste für Input-Felder
+document.addEventListener('DOMContentLoaded', () => {
+ init();
+
+ // Event Listener für Enter-Taste
+ document.addEventListener('keypress', (e) => {
+ if (e.key === 'Enter') {
+ const input = document.activeElement;
+ if (input && input.classList.contains('task-input')) {
+ const taskId = input.id.replace('input-', '');
+ checkAnswer(taskId);
+ }
+ }
+ });
+});
diff --git a/public/index.html b/public/index.html
new file mode 100644
index 0000000..c39f9b2
--- /dev/null
+++ b/public/index.html
@@ -0,0 +1,39 @@
+
+
+
+
+
+ MathQuest - Mathe lernen mit Quest-Punkten!
+
+
+
+
+
+
+
+
Fortschritt
+
+
0 / 100
+
+
+
+
+
+