HTML Einrücken Lernen

Eine interaktive Web-Anwendung zum Üben und Lernen der richtigen HTML-Einrückung. Verbessere deine Code-Formatierung mit praktischen Übungen!

🔗 Live Demo

Build with Bolt.new

🎯 Features

• 📝 Interaktive Übungen zur HTML-Einrückung
• ⏱️ Zeitmessung für jede Übungssession
• 🌙 Dark Mode Unterstützung
• ⌨️ Hilfreiche Tastatur-Shortcuts
• 📊 Sofortiges Feedback und Punktebewertung
• 🎉 Fortschritts-Tracking

🛠️ Technologien

• React
• TypeScript
• Vite
• Tailwind CSS
• CodeMirror für Code-Editing
• GitHub Actions für automatisches Deployment

🚀 Lokale Entwicklung

1. Repository klonen:

   git clone https://github.com/vsvito420/html-indentation.git
   cd html-indentation/project

2. Abhängigkeiten installieren:

   npm install

3. Entwicklungsserver starten:

   npm run dev

4. Öffne http://localhost:5173 im Browser

📦 Build

Um eine produktionsreife Version zu erstellen:

npm run build

Die Build-Dateien werden im dist-Verzeichnis erstellt.

🧪 Übungen

Die Anwendung enthält verschiedene Übungen mit steigendem Schwierigkeitsgrad:

1. Einfache Webseite: Grundlegende HTML-Struktur mit verschiedenen Elementen
2. Navigation: Verschachtelte Listen und Links

Jede Übung bietet:

• Klare Beschreibungen
• Sofortiges Feedback
• Punktebewertung
• Möglichkeit zum Zurücksetzen

🌐 Deployment

Die Anwendung wird automatisch via GitHub Actions auf GitHub Pages deployed. Jeder Push zum main Branch triggert einen neuen Build und Deploy.

🤝 Beitragen

Beiträge sind willkommen! Fühle dich frei:

1. Ein Issue zu erstellen
2. Einen Pull Request zu öffnen
3. Neue Übungen vorzuschlagen

📝 Lizenz

MIT