Daten & CMS

Im Bereich Daten findest du die Inhalte und Daten deiner Website. Du öffnest ihn über das Symbol Daten in der linken Seitenleiste. Er hat zwei Tabs:

• Inhalt: Sammlungen, die im Code deiner Website gespeichert sind. Jede Website hat sie, ganz ohne Einrichtung. Nutze sie für Inhalte, die du selbst bearbeitest, etwa Speisekarten, Teammitglieder, FAQs oder Blogbeiträge.
• Datenquelle: Tabellen in einer Datenbank oder Tabellenkalkulation, die du verbindest. Nutze eine Datenquelle, wenn deine Website Eingaben von Besuchern speichern soll, etwa Anmeldungen, Bestellungen, Buchungen oder Nutzerkonten. Nach dem Verbinden zeigt der Tab den Namen der Quelle.

Tipp

Wenn deine Inhalte direkt in einer Seite stehen, bitte die KI, sie in eine Sammlung zu verschieben: „Verschiebe meine Speisekarte in eine Sammlung, damit ich sie selbst bearbeiten kann“.

Inhaltssammlungen

Jede Sammlung ist eine Datei im Ordner src/data deiner Website. Änderungen erscheinen sofort in der Vorschau und werden beim Veröffentlichen auf deine Live-Website übernommen.

Eine Sammlung erstellen

Klicke oben im Bereich auf +, gib einen Namen ein und klicke auf Erstellen. Das Fenster zeigt die Datei, die erstellt wird, etwa /src/data/blog.ts.

Eine neue Sammlung ist zunächst leer. Klicke auf Feld hinzufügen, um festzulegen, was sie speichert (siehe Felder und Spalten).

Umbenennen, duplizieren oder löschen

Bewege den Mauszeiger über eine Sammlung und klicke auf ⋯, oder klicke mit der rechten Maustaste darauf. Wähle dann Umbenennen, Duplizieren oder Löschen. Du kannst auch auf einen Namen doppelklicken, um ihn zu ändern. Beim Umbenennen werden alle Dateien deiner Website aktualisiert, die die Sammlung verwenden. Das Löschen lässt sich nicht rückgängig machen.

Bei mehr als fünf Sammlungen erscheint über der Liste das Feld Sammlungen filtern.

Eine Datenquelle verbinden

Eine Website kann jeweils eine Datenquelle verwenden. Klicke auf den Tab Datenquelle und wähle eine aus.

Quelle	Geeignet für
WebTwizz Cloud (empfohlen)	Eine Datenbank mit Anmeldung und Dateispeicher, die für dich eingerichtet wird. Kein Konto nötig
Supabase	Datenbank, Anmeldung und Dateispeicher in deinem eigenen Supabase-Konto
Postgres	Railway, RDS oder eine Postgres-Datenbank, die du bereits betreibst
MySQL	Railway, RDS oder eine MySQL-Datenbank, die du bereits betreibst
MongoDB	Ein Atlas-Cluster oder eine beliebige MongoDB-Instanz
Google Sheets	Speisekarten, Preislisten, Zeitpläne und alle Tabellen, die du bereits in einem Tabellenblatt pflegst

Jede Quelle speichert ihre Verbindungsdaten als Secrets unter Einstellungen > Secrets, im Abschnitt Von verbundenen Diensten.

Supabase und Google Sheets sind auch Connectoren. Nach dem Verbinden wird dein Konto für deine anderen Projekte gespeichert. Unter Einstellungen > Connectoren findest du die Tabellen, Anmeldeeinstellungen oder Tabellenblätter des Projekts. Siehe Supabase und Google Sheets.

WebTwizz Cloud

Wähle WebTwizz Cloud und klicke auf Datenbank hinzufügen. Um Daten mit einer anderen deiner Websites zu teilen, wähle stattdessen deren Datenbank aus der Liste. Details zu Limits, Freigabe und Wechsel findest du unter WebTwizz Cloud.

Meist musst du das nicht selbst tun: Die KI fügt WebTwizz Cloud hinzu, sobald deine Website es braucht.

Supabase

1. Wähle Supabase und klicke auf Mit Supabase verbinden.
2. Melde dich bei Supabase an und erlaube den Zugriff. Danach kehrst du zum selben Fenster zurück.
3. Wähle ein Projekt aus der Liste oder + Neues Projekt erstellen.
4. Klicke auf Verbinden.

• Wenn dein Supabase-Konto bereits verknüpft ist, gelangst du direkt zur Projektliste.
• + Neues Projekt erstellen erstellt ein neues Projekt in deiner ersten Supabase-Organisation und verbindet es. Dafür ist die Anmeldung über Mit Supabase verbinden nötig. Es dauert etwa zwei Minuten. Lass das Fenster so lange geöffnet.
• Ein pausiertes Projekt lässt sich nicht verbinden. Stelle es zuerst in deinem Supabase-Dashboard wieder her.
• Möchtest du lieber ein Token verwenden? Klicke auf Stattdessen ein Zugriffstoken einfügen, erstelle eines unter supabase.com/dashboard/account/tokens, füge es ein und klicke auf Weiter.
• Supabase-Konto trennen unter der Projektliste hebt die Verknüpfung deines Supabase-Kontos mit WebTwizz auf. Danach kannst du dich mit einem anderen Konto anmelden.

Supabase fügt NEXT_PUBLIC_SUPABASE_URL, NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY, SUPABASE_SERVICE_ROLE_KEY und SUPABASE_ACCESS_TOKEN hinzu.

Postgres und MySQL

1. Wähle Postgres oder MySQL.
2. Füge deinen Verbindungsstring ein. Bei Postgres beginnt er mit postgres:// oder postgresql://, bei MySQL mit mysql://.
3. WebTwizz prüft die Verbindung während der Eingabe und zeigt Verbunden, wenn sie funktioniert. Andernfalls siehst du den Grund.
4. Klicke auf Verbinden.

Kein Verbindungsstring? Klicke auf Kein Verbindungsstring? Host, Nutzer und Passwort einzeln eingeben und fülle Host, Datenbank, Port, Nutzer und Passwort aus.

• Postgres: Verwende einen Verbindungsstring mit Connection-Pooling, falls dein Anbieter einen bereitstellt.
• MySQL: Verwende einen Nutzer, der Tabellen erstellen und ändern darf. WebTwizz benötigt MySQL 8.0.13 oder neuer.

Die Verbindung wird als DATABASE_URL gespeichert.

MongoDB

Wähle MongoDB und füge deinen Verbindungsstring ein (mongodb:// oder mongodb+srv://). WebTwizz prüft ihn während der Eingabe, wie bei Postgres. Sobald Verbunden erscheint, klicke auf Verbinden. In Atlas findest du den String unter Datenbank > Verbinden > Treiber.

Der String muss deinen Datenbanknamen enthalten, etwa mongodb+srv://user:pass@cluster.mongodb.net/mydb. Er wird als MONGODB_URI gespeichert.

Google Sheets

1. Wähle Google Sheets und klicke auf Weiter mit Google.
2. Melde dich an und erlaube den Zugriff.
3. Wähle eine Tabellendatei aus.

Nur die ausgewählte Tabellendatei wird mit WebTwizz geteilt. Sie bleibt privat. Jedes Tabellenblatt erscheint als Tabelle. Die erste Zeile des Tabellenblatts enthält die Spaltennamen.

Über den Chat

Wenn du die KI um etwas bittest, das Daten speichert, fügt sie WebTwizz Cloud hinzu und baut weiter. Stattdessen zeigt sie eine Karte Datenquelle verbinden, wenn deine Website bereits eine andere Quelle verwendet oder du alle Datenbanken deines Tarifs verbraucht hast. Ein Klick auf die Karte öffnet dasselbe Fenster direkt im Chat, zunächst mit WebTwizz Cloud. Klicke auf Alle Quellen, um eine andere auszuwählen. Klicke auf Erst mit Beispieldaten bauen (oder Jetzt nicht), um die Verbindung später einzurichten.

Ändern oder trennen

Klicke im Tab der Datenquelle auf ⋯ oder mit der rechten Maustaste auf den Tab. Das Menü zeigt die verbundene Quelle sowie Datenquelle ändern, Supabase-Dashboard öffnen (nur bei Supabase) und Trennen.

• Wenn du eine andere Quelle verbindest, ersetzt sie die aktuelle. Deine Daten bleiben, wo sie sind, aber deine Website verwendet sie nicht mehr. Wenn die Website Nutzer hat, zeigt das Fenster, wie viele sich erneut registrieren müssen.
• Nach einem Wechsel bietet der Bereich Daten die Option Meine Website dafür aktualisieren. Damit bittest du die KI, deine Seiten auf die neue Quelle umzustellen.
• Trennen bittet dich um Bestätigung. Deine Website liest und schreibt dann keine Daten mehr über diese Quelle. Beim Anbieter wird nichts gelöscht.
• Es gibt keinen Button zum erneuten Verbinden. Wenn eine Quelle nicht mehr funktioniert, etwa nachdem du ihr Passwort geändert hast, trenne sie und verbinde sie erneut.

Tabellen, Sammlungen und Tabellenblätter

Sobald eine Quelle verbunden ist, zeigt die Liste links ihre Tabellen. Bei MongoDB heißen sie Sammlungen, bei Google Sheets Tabellenblätter. Der Bereich verwendet dieselben Begriffe.

• Klicke auf +, um eine Tabelle, Sammlung oder ein Tabellenblatt zu erstellen. Das Fenster zeigt den endgültigen Namen vor dem Erstellen.
• Bewege den Mauszeiger darüber und klicke auf ⋯, oder klicke mit der rechten Maustaste darauf, um Umbenennen, Duplizieren und Löschen aufzurufen. Beim Löschen werden die Tabelle und alle ihre Daten aus der Quelle entfernt. Das lässt sich nicht rückgängig machen.
• Namen in Supabase, Postgres und MySQL werden in Kleinbuchstaben mit Unterstrichen umgewandelt. Aus „Blog posts“ wird also blog_posts. MongoDB und Google Sheets behalten den Namen so bei, wie du ihn eingibst.

Bei Supabase oder WebTwizz Cloud zeigt die Liste auch Nutzer: alle, die sich über die Anmeldung deiner Website registriert haben. Bei Supabase kannst du sie hier nur lesen. Bei WebTwizz Cloud kannst du außerdem das Zurücksetzen des Passworts anstoßen, Personen sperren oder löschen und die Liste exportieren.

Bei WebTwizz Cloud zeigt die Liste auch Dateien: die Buckets und Ordner mit den Dateien, die auf deiner Website hochgeladen werden. Dort kannst du Dateien hochladen, in der Vorschau ansehen, verschieben, umbenennen und löschen, ihre Links kopieren sowie Buckets und Ordner erstellen. Siehe Dateien.

Daten abfragen

Bei WebTwizz Cloud, Supabase, Postgres, MySQL oder MongoDB klickst du über der Tabellenansicht auf Abfrage. Von unten öffnet sich ein Bereich, der bereits eine Abfrage für die aktuelle Tabelle enthält.

• Fragen zu deinen Daten stellen: Gib eine Frage ein, etwa „Eltern, die diesen Monat Splash gewählt haben“, und klicke auf Fragen. Die KI schreibt die Abfrage, führt sie aus und zeigt die Antwort. Darüber steht die Abfrage.
• Eine Abfrage schreiben: Gib SQL ein und klicke auf Ausführen oder drücke Cmd+Enter. Bei MongoDB schreibst du sie als JSON, etwa {"collection": "orders", "filter": {"status": "paid"}}, oder verwendest "pipeline" für eine Aggregation.
• Bis zu 500 Ergebnisse innerhalb von 10 Sekunden. Blättere unten durch die Ergebnisse oder klicke auf Exportieren, um sie als CSV oder JSON herunterzuladen. Selbst geschriebene Abfragen, die Daten lesen oder hinzufügen, werden sofort ausgeführt. Alles, was Zeilen löscht oder ändert, eine Tabelle löscht oder eine Spalte umbenennt, erfordert zuerst deine Bestätigung. Wenn du Fragen verwendest, fragt die KI-Abfrage auch vor dem Hinzufügen von Zeilen nach. Bei WebTwizz Cloud kannst du mit Daten wiederherstellen deine Daten zurückholen, falls bei einer Änderung etwas schiefgeht. Bei anderen Quellen lässt sich die Änderung nicht rückgängig machen.
• Mehr Platz schaffen: Ziehe die Leiste oben im Bereich, um ihn höher oder niedriger zu machen. Ein Doppelklick füllt den Bildschirm aus. Ziehe die Linie unter der Abfrage, um ihr mehr Zeilen zu geben. Drücke Esc oder ziehe den Bereich ganz nach unten, um ihn zu schließen.

In der Tabellenansicht arbeiten

Beide Tabs verwenden dieselbe Tabellenansicht:

• Gib etwas ins Suchfeld ein, um Zeilen zu filtern.
• Klicke auf eine Spaltenüberschrift, um aufsteigend zu sortieren. Ein zweiter Klick sortiert absteigend, ein dritter hebt die Sortierung auf.
• Mit den Steuerelementen unten wechselst du die Seite oder änderst die Anzahl der Zeilen pro Seite.
• Klicke auf eine Zeile, um sie zu bearbeiten. Klicke am Ende einer Zeile auf ⋯ oder mit der rechten Maustaste darauf, um Bearbeiten, Duplizieren und Löschen aufzurufen.
• Klicke auf Neuer Eintrag oder auf + unter der letzten Zeile, um einen Eintrag hinzuzufügen.

Die Tabellenansicht einer Datenquelle hat außerdem einen Button zum Aktualisieren. Wenn die KI deine Daten ändert, aktualisiert sich die Ansicht automatisch.

Felder und Spalten

Inhaltsfelder

Klicke auf Feld hinzufügen, gib einen Feldname ein und wähle einen Typ. Aktiviere bei Bedarf Erforderlich und lege einen Standardwert fest. Klicke dann auf Feld erstellen.

Feldtypen: Text, Mehrzeiliger Text, Zahl, Datum, Datum & Uhrzeit, Boolean, Farbe, Link, E-Mail, Telefon, Bild, Audio und Video.

Klicke mit der rechten Maustaste auf eine Spaltenüberschrift, um das Feld über Bearbeiten, Duplizieren oder Löschen zu ändern. Beim Löschen eines Felds wird sein Wert aus jedem Eintrag entfernt.

Spalten einer Datenquelle

Klicke auf Spalte hinzufügen, gib einen Spaltenname ein und wähle einen Typ. Lege bei Bedarf einen Standardwert fest und klicke dann auf Spalte erstellen.

• Supabase, Postgres und MySQL: Die Typen sind Text, Kleine Ganzzahl, Ganzzahl, Große Ganzzahl, Numerisch (Dezimal), Gleitkommazahl, Datum, Uhrzeit, Zeitstempel, Boolean, UUID und JSON. Aktiviere Erforderlich (NOT NULL), um einen Wert verpflichtend zu machen. Namen bestehen aus Kleinbuchstaben, Zahlen und Unterstrichen und beginnen mit einem Buchstaben. Für Datum- und Zeitstempelspalten kannst du Aktuelles Datum verwenden oder Aktuelle Uhrzeit verwenden als Standard festlegen.
• Google Sheets: Eine Spalte ist eine Überschriftszelle in der ersten Zeile des Tabellenblatts. Die Typen sind Text, Zahl, Datum, Datum & Uhrzeit und Kontrollkästchen. Namen dürfen Leerzeichen und Großbuchstaben enthalten.
• MongoDB: Hier gibt es kein Spalte hinzufügen. Dokumente können unterschiedliche Felder enthalten. Ein Feld, das du einem Dokument hinzufügst, erscheint als Spalte.

Klicke mit der rechten Maustaste auf eine Spaltenüberschrift, um sie über Bearbeiten umzubenennen, zu Duplizieren oder zu Löschen. Die Spalte id lässt sich nicht ändern.

Eine Zeile bearbeiten

Klicke auf eine Zeile oder auf Neuer Eintrag. Der Bereich Eintrag bearbeiten oder Neuer Eintrag öffnet sich mit einem Feld für jede Spalte. Pflichtfelder sind mit * gekennzeichnet.

• Klicke auf Speichern oder drücke Enter, um zu speichern. Drücke Escape oder klicke auf Abbrechen, um den Bereich ohne Speichern zu schließen.
• In Textfeldern einer Datenquelle fügt Shift+Enter eine neue Zeile ein.
• In Inhaltssammlungen öffnen Bildfelder dieselbe Bildauswahl wie an anderen Stellen im Editor.
• Um die Zeile zu löschen, klicke unten im Bereich auf Löschen und bestätige.
• Wenn deine Datenbank eine Änderung ablehnt, erklärt der Bereich den Grund in einfachen Worten.
• MongoDB: Mit den beiden Symbolen Felder und Rohes JSON oben im Bereich kannst du zur Bearbeitung des gesamten Dokuments als JSON wechseln. Klicke in einer leeren Sammlung auf Als JSON schreiben, um dein erstes Dokument hinzuzufügen.

Zeilen, die du in einer Datenquelle speicherst, werden direkt in deine Datenbank geschrieben.

Mehrere Zeilen auswählen und bearbeiten

Aktiviere die Kontrollkästchen neben den Zeilen, um sie auszuwählen. Das Kontrollkästchen in der Kopfzeile wählt alle Zeilen auf der Seite aus. Wenn eine ganze Seite ausgewählt ist und weitere Zeilen zutreffen, klicke auf Alle auswählen, um sie auf allen Seiten auszuwählen. Dabei wird die Anzahl der passenden Zeilen angezeigt. Mit Aufheben hebst du die Auswahl auf.

Die Auswahlleiste enthält die Buttons Duplizieren und Löschen.

• Aktionen betreffen nur Zeilen, die zu deiner Suche passen. Wenn du nach „latte“ suchst, alles auswählst und löschst, werden nur die zu „latte“ passenden Zeilen entfernt. Die Bestätigung weist darauf hin.
• Wenn du die Suche änderst, wird deine Auswahl aufgehoben.
• Löschen erfordert immer eine Bestätigung. Bei einer Datenquelle musst du auch das Duplizieren aller Zeilen zuerst bestätigen.
• Manche Datenbanktabellen lassen sich nicht duplizieren. Das gilt etwa für Tabellen, deren id mit einer Zeile in einer anderen Tabelle übereinstimmen muss, zum Beispiel einem Nutzerkonto. Dort ist Duplizieren deaktiviert. Wenn du den Mauszeiger darüber bewegst, siehst du den Grund.

Export

Klicke über der Tabellenansicht auf Exportieren und wähle Als CSV exportieren oder Als JSON exportieren, um alle Inhalte der Sammlung oder Tabelle herunterzuladen, bis zu 50,000 Zeilen. Das funktioniert mit jeder Datenquelle.

Die KI mit deinen Daten arbeiten lassen

Sobald eine Datenquelle verbunden ist, baut die KI deine Website auf dieser Grundlage und kann sie für dich ändern. Beschreibe in deinen eigenen Worten, was du möchtest: „Füge eine Buchungstabelle mit Name, E-Mail und Datum hinzu“ oder „Füge diese 20 Produkte zu meiner Produkttabelle hinzu“.

Jede Änderung erscheint als Karte im Chat, etwa Tabelle erstellt oder Daten hinzugefügt, und die Tabellenansicht wird aktualisiert. Bevor die KI Daten dauerhaft entfernt, etwa durch das Löschen von Zeilen oder einer Tabelle, hält sie an und fragt nach. Klicke auf Übernehmen, um fortzufahren, oder auf Ablehnen, um abzubrechen.

Unterschiede zwischen den Quellen

	Supabase	Postgres und MySQL	MongoDB	Google Sheets
Angezeigt als	Tabellen	Tabellen	Sammlungen	Tabellenblätter
Namen	kleinbuchstaben_mit_unterstrichen	kleinbuchstaben_mit_unterstrichen	Wie eingegeben	Wie eingegeben
Spalten hinzufügen	Ja	Ja	Nein, Felder stammen aus Dokumenten	Ja, als Überschriftszellen
Außerdem verfügbar	Nutzer, Supabase-Dashboard öffnen		Bearbeitung als rohes JSON
Gespeichert als	Vier SUPABASE-Secrets	DATABASE_URL	MONGODB_URI	GOOGLE_SHEETS_REFRESH_TOKEN