Projekttypen & Grundkonzepte

Projekttypen

XAIO unterstützt verschiedene Projekttypen, je nachdem, was du bauen willst:

• Website — Statische Seiten, Landingpages, Portfolios. Nur Frontend (React + Vite). Free-Plan.
• Web App — Full-Stack-Anwendungen mit Backend und Datenbank. Frontend (React + Vite) + Backend (FastAPI). Erfordert den Web App Builder-Plan.
• Agent Flow — KI-gestützte Automatisierungs-Workflows. Definiere Agenten, Trigger und Aktionen. Erfordert den Agent Flow-Plan.

Wie XAIO funktioniert

1. Beschreibe deine Idee — Tippe einen Prompt, der beschreibt, was du bauen willst. Sei konkret bei Design, Features und Inhalt.

2. Die KI erstellt einen Plan — XAIO analysiert deine Anfrage und erstellt einen strukturierten Plan. Prüfe und bestätige ihn, bevor die Generierung startet.

3. Code-Generierung — Der KI-Agent schreibt deinen Code Datei für Datei. Du siehst eine Live-Vorschau, die sich in Echtzeit aktualisiert, während Dateien entstehen.

4. Per Chat iterieren — Nach der Generierung nutzt du den Chat für Änderungen. Die KI kennt den gesamten Projektkontext und nimmt gezielte Änderungen vor.

5. Veröffentlichen — Deploye dein Projekt mit einem Klick auf *.xaio.app.

AI-Chat

Der AI-Chat ist der primäre Weg, mit XAIO zu interagieren. Du kannst:

• Neue Features oder Seiten beschreiben
• Design-Änderungen anfragen (Farben, Layout, Schriften)
• Bilder oder Dokumente als Referenz hochladen
• Die KI eigene Bilder generieren lassen
• Probleme beheben, indem du sie beschreibst
• Die KI bestehenden Code oder Bilder analysieren lassen

Intelligentes Modell-Routing

XAIO leitet deine Anfragen automatisch an das beste KI-Modell weiter:

• Einfache Aufgaben (Textänderungen, Farben, CSS) — schnelles, kosteneffizientes Modell
• Komplexe Aufgaben (Multi-File-Features, APIs, Debugging) — das stärkste Modell mit erweitertem Nachdenken

Das passiert automatisch — du musst nichts konfigurieren. So sparst du bei Routine-Änderungen deutlich AI Tasks.

Projekttyp-Konvertierung

Du kannst eine Website direkt in den Projekteinstellungen in eine Web App umwandeln (und zurück). Beim Upgrade zur Web App initialisiert XAIO automatisch das Backend. Beim Downgrade wird das Backend archiviert (nicht gelöscht) und kann später wiederhergestellt werden.

XAIO.md — Projektwissen

Jedes Projekt hat eine XAIO.md-Datei, die das Designsystem, Konventionen und wichtige Entscheidungen speichert. Die KI erstellt sie automatisch nach der ersten Code-Generierung und aktualisiert sie bei größeren Änderungen. XAIO.md bleibt über alle Chats hinweg erhalten — jede neue Unterhaltung respektiert dieselben Design-Entscheidungen.

Du kannst XAIO.md im Dateien-Tab (Unter-Tab XAIO.md) oder in den Projekteinstellungen ansehen. Zum Ändern bittest du die KI im Chat, z. B. „Aktualisiere XAIO.md: Primärfarbe auf #1e40af umstellen".

Live-Vorschau

Jedes Projekt hat eine Live-Vorschau, die sich in Echtzeit aktualisiert, während du oder die KI Änderungen vornehmt. Die Vorschau läuft in einem isolierten Workspace-Container mit eigenem Entwicklungs-Server.

Design-Mode

Klick ein beliebiges Element in der Vorschau an, um es auszuwählen. XAIO zeigt dir die Quelldatei und Zeilennummer. Anschließend kannst du die KI bitten, genau dieses Element zu ändern.

Veröffentlichen

Veröffentliche dein Projekt mit einem Klick auf deinname.xaio.app. Web Apps enthalten ein verwaltetes Backend und optional eine PostgreSQL-Datenbank. Veröffentlichte Seiten erhalten automatisches HTTPS.

Medienbibliothek

Jedes Projekt hat eine Medienbibliothek für Bilder, Videos und andere Assets. Du kannst:

• Dateien von deinem Computer hochladen
• KI-generierte Bilder nutzen (mit „Generiert"-Badge markiert)
• Assets herunterladen
• Assets in deinem Code referenzieren

Integrationen

• GitHub — Verbinde dein Repo für Versionskontrolle, Branches und Pull Requests
• PostgreSQL — Verwaltete Datenbank für Web Apps mit Dev/Prod-Umgebungen
• Benachrichtigungen — Erhalte Hinweise per E-Mail, Slack, Discord oder Telegram
• Local Connector — Bearbeite Code in deiner IDE und nutze gleichzeitig XAIOs KI und Vorschau