Flow Documentation Downloader

Ein Python-Script zum automatischen Herunterladen der gesamten mittwald Flow Komponenten-Dokumentation von der offiziellen Website und Zusammenführen in eine einzige Markdown-Datei.

🎯 Zweck: Agentic Coding vereinfachen

Dieses Tool wurde entwickelt, um Agentic Coding zu vereinfachen und zu verbessern. Die heruntergeladene Markdown-Dokumentation kann direkt an AI-Coding-Assistenten (wie Cursor, GitHub Copilot, ChatGPT, etc.) bereitgestellt werden, um:

• ✅ Präziseres Coding: AI-Assistenten haben Zugriff auf die vollständige Flow-Komponenten-Dokumentation
• ✅ Korrekte API-Nutzung: Alle Props, Events und Verwendungsbeispiele sind verfügbar
• ✅ Bessere Code-Vorschläge: AI kann basierend auf der offiziellen Dokumentation Code generieren
• ✅ Konsistente Implementierung: Verwendung der richtigen Komponenten und Patterns
• ✅ Zeitersparnis: Kein manuelles Nachschlagen der Dokumentation während des Codings

Verwendung mit AI-Assistenten

Die generierte flow_documentation.md kann einfach in den Kontext deines AI-Assistenten geladen werden. Wir bieten detaillierte Anleitungen für die beliebtesten AI-Tools:

• 📘 Cursor - Vollständige Anleitung für Cursor IDE
• 🤖 Claude - Anleitung für Claude Desktop, Web und API
• 💬 ChatGPT - Anleitung für ChatGPT Plus, Web und API

Schnellstart:

1. Cursor: Datei öffnen und als Kontext hinzufügen
2. ChatGPT/Claude: Datei hochladen (Plus/Team) oder Inhalt kopieren
3. GitHub Copilot: Dokumentation als Referenz im Projekt hinterlegen
4. Custom Agents: Als Knowledge Base für RAG-Systeme verwenden

Die strukturierte Markdown-Datei ermöglicht es AI-Assistenten, schnell die richtigen Komponenten zu finden und korrekt zu verwenden.

Features

• ✅ Lädt alle Flow-Komponenten-Dokumentationen automatisch herunter
• ✅ Konvertiert HTML zu Markdown
• ✅ Gruppiert Dokumentation nach Kategorien
• ✅ Unterstützt Debug-Modus für detaillierte Ausgaben
• ✅ Respektiert Rate-Limits mit automatischen Pausen

Voraussetzungen

• Python 3.7 oder höher
• pip (Python Package Manager)

Installation

Option 1: Mit Startscript (empfohlen)

Das Startscript erstellt automatisch eine virtuelle Umgebung und installiert alle Abhängigkeiten:

chmod +x start.sh
./start.sh

Für Debug-Ausgaben:

./start.sh --debug

Option 2: Manuelle Installation

# Virtuelle Umgebung erstellen
python3 -m venv venv

# Virtuelle Umgebung aktivieren
source venv/bin/activate  # Auf Windows: venv\Scripts\activate

# Abhängigkeiten installieren
pip install -r requirements.txt

Verwendung

Mit Startscript

./start.sh

Direkt mit Python

# Virtuelle Umgebung aktivieren (falls nicht bereits aktiv)
source venv/bin/activate

# Script ausführen
python download_docs.py

# Mit Debug-Ausgaben
python download_docs.py --debug

Was macht das Script?

1. Discovery-Phase: Systematisches Durchsuchen aller bekannten Komponenten-Kategorien
2. Link-Following: Rekursives Folgen von Links auf Dokumentationsseiten
3. Download: Herunterladen jeder gefundenen Dokumentationsseite
4. Konvertierung: HTML zu Markdown konvertieren
5. Speicherung: Alles in flow_documentation.md speichern, gruppiert nach Kategorien

Ausgabe

Die Dokumentation wird in flow_documentation.md gespeichert, strukturiert nach Komponenten-Kategorien:

• Actions
• Chat
• Content
• Data Visualisation
• Form Controls
• Navigation
• Overlays
• Status
• Structure
• Upload

Jede Komponente enthält:

• Titel
• Link zur Originalquelle
• Vollständiger Dokumentationsinhalt in Markdown (inkl. Props, Events, Beispiele)

Beispiel-Verwendung mit AI

# In deinem AI-Assistenten:

"Erstelle eine Form mit einem TextField und einem DatePicker 
basierend auf der Flow-Dokumentation. Verwende die korrekten 
Props aus flow_documentation.md."

# Die AI kann dann präzise Code generieren mit:
# - Korrekten Import-Statements
# - Richtigen Props und deren Typen
# - Best Practices aus der Dokumentation

Projekt-Struktur

flowloader/
├── download_docs.py          # Hauptscript
├── start.sh                  # Startscript mit venv-Setup
├── requirements.txt          # Python-Abhängigkeiten
├── README.md                 # Diese Datei
├── CURSOR_USAGE.md           # Anleitung für Cursor
├── CLAUDE_USAGE.md           # Anleitung für Claude
├── CHATGPT_USAGE.md          # Anleitung für ChatGPT
├── SECURITY.md               # Sicherheitshinweise
├── SECURITY_CHECKLIST.md     # Sicherheits-Checkliste
├── .gitignore                # Git-Ignore-Regeln
└── flow_documentation.md     # Generierte Dokumentation (wird erstellt)

Debug-Modus

Für detaillierte Ausgaben während des Downloads:

./start.sh --debug
# oder
python download_docs.py --debug

Der Debug-Modus zeigt:

• Alle HTTP-Requests
• Gefundene Links
• Extrahierten Inhalt (Zeichenanzahl)
• Fehlerdetails
• Fortschrittsstatistiken

Workflow für Agentic Coding

1. Dokumentation herunterladen:

   ./start.sh

2. AI-Assistent wählen und Anleitung folgen:

   • 📘 Cursor Anleitung - Für Cursor IDE
   • 🤖 Claude Anleitung - Für Claude Desktop/Web/API
   • 💬 ChatGPT Anleitung - Für ChatGPT Plus/Web/API

3. Markdown-Datei in AI-Assistenten laden:

   • Cursor: Datei öffnen oder als Kontext hinzufügen (@flow-docs.md)
   • ChatGPT/Claude: Datei hochladen (Plus/Team) oder Inhalt kopieren
   • Custom Agent: Als Knowledge Base integrieren

4. Präzise Coding-Anfragen stellen:

   • "Erstelle eine Form mit TextField und Select basierend auf der Flow-Dokumentation"
   • "Wie verwende ich die Modal-Komponente korrekt?"
   • "Zeige mir ein Beispiel für die Table-Komponente"

5. AI generiert Code mit korrekten Imports, Props und Best Practices

💡 Tipp: Für detaillierte Anleitungen und Best Practices siehe die spezifischen Usage-Guides oben.

Lizenz

Dieses Projekt ist ein Tool zum Herunterladen öffentlicher Dokumentation. Die heruntergeladene Dokumentation gehört mittwald und unterliegt deren Lizenzbedingungen.

Dokumentation

• 📖 README.md - Diese Datei (Übersicht)
• 📘 CURSOR_USAGE.md - Detaillierte Anleitung für Cursor
• 🤖 CLAUDE_USAGE.md - Detaillierte Anleitung für Claude
• 💬 CHATGPT_USAGE.md - Detaillierte Anleitung für ChatGPT
• 🔒 SECURITY.md - Sicherheitshinweise

Beitragen

Feedback und Verbesserungsvorschläge sind willkommen! Bitte erstelle ein Issue oder einen Pull Request.

Disclaimer

Dieses Tool lädt nur öffentlich zugängliche Dokumentation herunter. Bitte respektiere die Nutzungsbedingungen der mittwald Flow Website und verwende das Tool verantwortungsvoll.