🚀 Vibe Innovation Lab

Willkommen in eurer digitalen Werkstatt! Hier entwickeln wir heute Software-Prototypen, um echte Probleme zu lösen – ganz ohne selbst zu programmieren.

1. 🏁 Start: So öffnet ihr die Werkstatt

Ihr braucht nichts auf eurem Laptop zu installieren. Alles läuft in der Cloud in eurem Browser.

1. Klickt oben rechts auf den grünen Button <> Code.
2. Wählt den Reiter Codespaces.
3. Klickt auf den grünen Button Create codespace on main.

Es dauert nun ca. 1-2 Minuten, bis euer Virtueller Computer eingerichtet ist. Holt euch einen Kaffee ☕.

2. 🛠️ Vibe Loop Anleitung

2.1 Die Webiste/App starten

Sobald Visual Studio Code im Browser geladen ist, kopiert den folgenden Befehl und fügt ihn mit der rechten Maustaste unten im Terminal (dem schwarzen Fenster) ein und drückt Enter:

streamlit run app.py

2.2 Die Website/App ansehen

1. Schaut in VS Code im unteren Bereich (dort, wo auch das Terminal ist).
2. Klickt auf den Reiter PORTS (neben Terminal und Debug Console).
3. Ihr seht eine Zeile mit Streamlit App (8501) oder Streamlit Port.
4. Fahrt mit der Maus über die Spalte „Weitergeleitete Adresse“ oder „Forwarded Address“.
5. Es erscheinen kleine Symbole: Klickt auf das Weltkugel-Icon 🌐 „In Browser öffnen“ oder „Open in Browser“.
6. Ein neuer Tab öffnet sich mit eurer Website/App.

2.3 Die Website/App aktualisieren

1. Ihr müsst die Website/App nicht jedes Mal schließen.
2. Lasst den Browser-Tab mit der App offen.
3. Wenn ihr den Code ändert und speichert (Strg + S), dann erscheint oben rechts in der Website/App ein Button „Always rerun“.
4. Klickt einfach darauf, und die Seite aktualisiert sich sofort.

2.4 Start-Prompts

Bitte geht nach und nach durch die folgenden Datein und folgt den Anleitungen dort.

Hier geht es direkt zu den Vibe Innovation Prompts:

1. Prompt 1: Der Sokratische Dialog (Coach: Mäeutik-Protokoll)
2. Prompt 2: Die Synthese (Solution Architect)
3. Prompt 3: Die Realisierung (Dev: Senior Developer)

🆘 Hilfe und Tipps

1. Irgendetwas funktioniert nicht? Beschreibt der KI was das Problem ist, macht einen Screenshot und fragt die KI nach einer Lösung! 💡
2. Der Code funktioniert nicht? Fragt die KI! ;) Kopiert die Fehlermeldung und sagt: „Fixe diesen Fehler für mich“. Bleibt im selben Chat, mindestens aber im selben Projekt.
3. Martin fragen. :)