Dieser Leitfaden hilft allen Nutzer:innen – ob neu oder erfahren –, schnell durchzustarten und häufige Fallstricke beim Erstellen von Apps mit Lovable zu vermeiden.
1. Lege dein Fundament: Verwende die Knowledge-Datei
Warum das wichtig ist: Die Knowledge-Datei ist das Gehirn deines Projekts. Sie wird mit jeder Eingabeaufforderung gesendet und hilft der KI, den gesamten Kontext zu verstehen.
Was sie enthalten sollte:
- Deine Produktvision (ähnlich wie ein PRD)
- User Journeys und Personas
- Zentrale Features und Funktionen
- Designsysteme und UI-Richtlinien
- Rollenspezifisches Verhalten (z. B. Admin, User, Investor)
Du kannst eine Knowledge-Datei automatisch über Chat mode generieren:Generate knowledge for my project at T=0 based on the features I’ve already implemented.
Klare, ausführliche Eingabeaufforderungen = besseres Ergebnis. Stell dir die KI wie deinen Engineering-Partner vor – sie weiß nur, was du ihr sagst.
Tipps für Eingabeaufforderungen:
-
Sei spezifisch: Nenne die genaue Seite (z. B.
/dashboard) und das erwartete Verhalten.
-
Verwende natürliche Sprache
Ich möchte, dass Benutzer mit der Rolle Investor auf diese Komponente zugreifen können, aber nicht Admins.
-
Füge Screenshots hinzu: Besonders hilfreich, um Bugs oder UX-Probleme zu beschreiben.
-
Setze Leitplanken: Sag der KI, was sie nicht anfassen soll. Z. B.
Bearbeite /shared/Layout.tsx nicht.
-
Wiederhole wichtige Anweisungen über mehrere Eingabeaufforderungen hinweg. Das Gedächtnis der KI kann begrenzt sein.
-
Versuche nicht, 5 Dinge gleichzeitig zu implementieren. Teile die Arbeit in kleinere, testbare Schritte auf. Verwende Chat Mode nach jedem Block, um zu validieren, bevor du weitermachst.
**Vorlage zur Feature-Aufteilung:**
Erstelle die neue Seite
Füge das UI-Layout hinzu
Verbinde die Daten
Füge Logik + Randfälle hinzu
Teste pro Rolle
-
Wenn deine App mehrere Rollen hat (z. B. Admin, Investor, Startup), definiere immer, für welche Rolle die Eingabeaufforderung gilt. So vermeidest du Bugs durch geteilte Logik/Komponenten.
Als Investor möchte ich das Unternehmens-Dashboard ansehen können, aber ich sollte es nicht bearbeiten dürfen. Bitte isoliere dieses Feature ausschließlich auf die Rolle „Investor“.
3. Use chat mode early and often
Chat mode = dein KI‑Copilot. Er hilft dir beim Debuggen, Brainstormen und Planen von Implementierungen – ohne deinen Code zu bearbeiten, bis du bereit bist.
Wann du zu Chat Mode wechseln solltest:
-
Nach 2–3 fehlgeschlagenen „Try to Fix“-Versuchen
-
Beim Debuggen komplexer Logik oder Datenbankproblemen
-
Beim Planen neuer Features
Suggest 3 ways to implement X
Workflow-Tipp:Einige Nutzer verwenden Chat Mode gerne für 60–70 % ihrer Zeit. Klicke erst auf „Implement the plan“, wenn du vollständig zufrieden bist.
Falls du vergisst, den Chat mode zu verwenden, verbessert dieses Format die Konsistenz der Ergebnisse und verhindert unbeabsichtigte Änderungen an anderem Code.On page /settings, implement [feature]. The expected behavior is [XYZ]. Please don’t touch component A, layout B, or shared logic unless necessary. Follow best practices from Tailwind / Supabase / X.
Um unerwünschte Codeausführung zu vermeiden:Investigate but don’t write code yet.
Suggest 3 ways to solve this without changing anything.
So behältst du die Kontrolle.
Wenn die KI in eine „Schleife“ gerät, verwende diese Abfolge, um endlose Zyklen zu vermeiden, in denen immer wieder kaputter Code geflickt wird:
-
Wechsle zu Chat mode
-
Füge den Fehlerscreenshot ein
-
Sage:
Please investigate this without breaking other features. If needed, revert to the last working version and fix from there.
4. Häufige Fallstricke mit Supabase vermeiden
Achtung: Supabase lässt sich nicht sauber zurücksetzen. Wenn du eine Version zurücksetzt, kann dein Datenbankschema beschädigt werden.
Best Practices:
-
Supabase erst verbinden, nachdem dein Frontend stabil ist
-
Wenn du zurücksetzen musst, gib der KI folgende Eingabeaufforderung:
Please validate the SQL schema at T=0 and ensure no breaking changes have occurred.
-
Teste immer alle datenbankgebundenen Funktionen, bevor du veröffentlichst
5. Verwende Visual Edit für schnelle UI-Korrekturen
Das Visual Edit-Tool ist kostenlos und schnell. Verwende es statt Eingabeaufforderungen für:
- Änderungen an Text, Farben, Schriftarten und kleine Layout-Anpassungen
- Gleichzeitiges Bearbeiten mehrerer kleiner Elemente
- Sichere Commits, ohne Credits zu verbrauchen (mit Rückgängig-Funktion)
6. GitHub + Versionskontrolle sinnvoll nutzen
-
Jede Bearbeitung ist ein Commit. Nutze Pinning, um stabile Versionen zu markieren. Nach jedem funktionierenden Feature: pinnen
-
Nach jedem Bug: Versionen visuell vergleichen. Du kannst die folgende Eingabeaufforderung verwenden:
Compare version at T–1 to T–0. What changed? What might be breaking?
-
Wechsle zu einer stabilen Version zurück, wenn du das Gefühl hast, dass die KI zu viel kaputt gemacht hat.
-
Nutze GitHub-Branching auf eigenes Risiko. Vermeide das Löschen von Branches, bevor du in Lovable wieder zu
main wechselst, um Projekt-Sync-Probleme zu verhindern.
7. Wenn nichts mehr hilft, remixen
Viele Nutzer:innen merken: Beim zweiten Mal geht alles schneller.
- Remix erstellt eine saubere Kopie deines Projekts bei T=0.
- Baue mit besseren Eingabeaufforderungen + klarerem Verständnis neu auf
- Nutze dein altes Projekt nur noch als Referenz
Anwendungsfälle:
- Du hängst in einer fehlerhaften Endlosschleife fest
- Du willst sauber neu starten, aber den Verlauf erhalten
- Du musst Supabase trennen und einen neuen Weg ausprobieren
Zum Remixen musst du Supabase zuerst trennen.
8. Bleib geduldig, bleib gelassen
Du bist nicht allein. KI kann in einem Moment magisch und im nächsten frustrierend sein. Die letzten 5 % eines Builds sind oft die langsamsten – aber auch die wichtigsten.
Goldene Regel:Nimm dir Zeit für deine Eingabeaufforderungen. Überprüfe alles noch einmal. Teile die Arbeit in kleine, testbare Blöcke auf. Je präziser deine Eingaben sind, desto besser sind deine Ergebnisse.
9. Nutze die Doku und bitte um Hilfe
- In der Dokumentation findest du Schritt-für-Schritt-Anleitungen, Vorlagen, SEO-Tipps, Integrationen und mehr. Du kannst deine Fragen direkt an den KI-Assistenten in der Doku stellen.
- Tritt der Discord-Community für Unterstützung durch andere Nutzer:innen bei.
- Wenn du so weit bist, reiche dein Projekt bei Lovable Launch ein.
-
Füge für lange Eingabeaufforderungen eine sprachbasierte Eingabeaufforderung per Diktierfunktion hinzu (z. B. kannst du auf dem Mac das Mikrofon nutzen, um lange Eingabeaufforderungen zu diktieren). So erstellst du schneller bessere Eingaben – besonders hilfreich, wenn du frustriert oder müde bist.
-
Verwende das Muster der Eingabeaufforderung „
I am frustrated…“, um den Fokus der KI zu verbessern.
-
Überprüfe nach einer größeren Änderung stets mehrere Rollen und deren Verhalten (insbesondere bei bedingter Logik).
-
Speichere stabile Versionen als Fallbacks für schnelleres Debugging.
-
Wenn du unerwartete Nebeneffekte siehst, hilft das, Bugs zu vermeiden, die durch zu generische Logik verursacht werden.
Create a component specifically for [role X] and do not reuse shared components unless clearly scoped.