Zum Hauptinhalt springen

Documentation Index

Fetch the complete documentation index at: https://docs.twenty.com/llms.txt

Use this file to discover all available pages before exploring further.

Voraussetzungen

  • Node.js 24+Hier herunterladen
  • Yarn 4 — Wird mit Node.js über Corepack mitgeliefert. Aktivieren Sie es: corepack enable
  • DockerHier herunterladen. Erforderlich, um einen lokalen Twenty-Server auszuführen. Überspringen Sie dies, wenn Twenty bereits anderswo läuft.
Das Erstellen einer Twenty-App umfasst drei Phasen. Das Scaffolding-Tool fasst sie zu einem einzigen Happy-Path-Befehl zusammen, aber jede Phase ist ein eigenes Konzept — wenn etwas fehlschlägt, hilft Ihnen das Wissen, in welcher Phase Sie sich befinden, zu erkennen, was zu beheben ist.
PhaseWas Sie tunToolErgebnis
1. Gerüst erstellenDen Quellcode der App erzeugennpx create-twenty-appEin TypeScript-Projekt auf der Festplatte
2. Server startenEinen Twenty-Server starten, in den synchronisiert wirdDocker + yarn twenty serverEine laufende Twenty-Instanz
3. SynchronisierenIhren Code live mit dem Server synchronisierenyarn twenty devIhre Änderungen erscheinen in der Benutzeroberfläche

Phase 1 — Projektgerüst erstellen

Erstellen Sie eine neue App aus der Vorlage:
npx create-twenty-app@latest my-twenty-app
Sie werden nach einem Namen und einer Beschreibung gefragt — drücken Sie Enter für die Standardwerte. Dadurch wird ein TypeScript-Projekt in my-twenty-app/ erzeugt, mit einer Startdatei application-config.ts, einer Standardrolle, einem CI-Workflow und einem Integrationstest. Nach dieser Phase: Sie haben den Quellcode einer App auf Ihrem Rechner. Es läuft noch nicht — das ist Phase 2.

Phase 2 — Einen lokalen Twenty-Server starten

Ihre App benötigt einen Twenty-Server, in den sie synchronisieren kann. Der Server ist eine vollständige Twenty-Instanz — UI, GraphQL-API, PostgreSQL — die lokal in Docker läuft. Ihr lokaler Code lädt seine Definitionen auf diesen Server hoch, wodurch sie in der Benutzeroberfläche erscheinen. Das Scaffolding-Tool bietet an, einen für Sie zu starten:
Möchten Sie eine lokale Twenty-Instanz einrichten?
  • Ja (empfohlen) — lädt das Docker-Image twentycrm/twenty-app-dev herunter und startet es auf Port 2020. Stellen Sie sicher, dass Docker läuft.
  • Nein — wählen Sie dies, wenn Sie bereits einen Twenty-Server haben, mit dem Sie sich verbinden möchten. Sie können die Verbindung später mit yarn twenty remote add herstellen.
Soll die lokale Instanz gestartet werden?
Sobald der Server läuft, öffnet sich ein Browser zur Anmeldung. Verwenden Sie das vorab eingerichtete Demo-Konto:
  • E-Mail: tim@apple.dev
  • Passwort: tim@apple.dev
Twenty-Anmeldebildschirm
Klicken Sie auf dem nächsten Bildschirm auf Authorize — dadurch erhält die CLI Zugriff auf Ihren Arbeitsbereich.
Twenty-CLI-Autorisierungsbildschirm
Ihr Terminal bestätigt, dass alles eingerichtet ist.
App-Gerüst erfolgreich erstellt
Nach dieser Phase: Sie haben einen laufenden Twenty-Server unter http://localhost:2020, und Ihre CLI ist autorisiert, mit ihm zu synchronisieren.
Wenn Docker nicht installiert ist oder nicht läuft, zeigt das Scaffolding-Tool den richtigen Startbefehl für Ihr Betriebssystem an. Sobald Docker läuft, können Sie mit yarn twenty server start fortfahren — ein erneutes Scaffolding ist nicht nötig.

Phase 3 — Ihre Änderungen synchronisieren

Das ist die innere Schleife, in der Sie die meiste Zeit verbringen werden.
cd my-twenty-app
yarn twenty dev
Dies überwacht src/, baut bei jeder Änderung neu und synchronisiert das Ergebnis mit dem Server. Bearbeiten Sie eine Datei, speichern Sie, und innerhalb einer Sekunde spiegelt der Server die Änderung wider. Sie sehen eine Live-Statusanzeige in Ihrem Terminal. Für ausführlichere Ausgaben (Build-Protokolle, Sync-Anfragen, Fehlerspuren) fügen Sie --verbose hinzu.
Terminalausgabe im Dev-Modus
Öffnen Sie http://localhost:2020/settings/applications#developer. Unter Your Apps sollte Ihre App angezeigt werden.
Liste "Your Apps", die "My twenty app" anzeigt
Klicken Sie auf My twenty app, um die Anwendungsregistrierung anzuzeigen — ein serverseitiger Datensatz, der Ihre App beschreibt (Name, Bezeichner, OAuth-Anmeldedaten, Quelle). Eine Registrierung kann in mehreren Arbeitsbereichen auf demselben Server installiert werden.
Details der Anwendungsregistrierung
Klicken Sie auf View installed app, um die Installation im Arbeitsbereich anzuzeigen. Die Registerkarte About zeigt die Version und Verwaltungsoptionen.
Installierte App
Nach dieser Phase: Sie haben eine Live-Entwicklungsschleife. Bearbeiten Sie eine beliebige Datei in src/, und sie erscheint in der Benutzeroberfläche.

Einmalige Synchronisierung für CI und Skripte

Verwenden Sie --once, um einen einzelnen Build + Sync auszuführen und zu beenden — gleiche Pipeline, kein Watcher:
yarn twenty dev --once
BefehlVerhaltenWann verwenden
yarn twenty devÜberwacht und synchronisiert bei jeder Änderung erneut. Läuft, bis Sie es stoppen.Interaktive lokale Entwicklung.
yarn twenty dev --onceEinmaliger Build + Sync, beendet sich mit 0 bei Erfolg, mit 1 bei Fehler.CI, Pre-Commit-Hooks, KI-Agenten, skriptgesteuerte Workflows.
Beide Modi benötigen einen Server im Entwicklungsmodus und eine authentifizierte Remote-Verbindung.
Der Dev-Modus ist nur auf Twenty-Instanzen verfügbar, die im Entwicklungsmodus laufen (NODE_ENV=development). Produktionsinstanzen lehnen Dev-Sync-Anfragen ab — verwenden Sie yarn twenty deploy, um auf Produktionsserver bereitzustellen. Siehe Apps veröffentlichen.

Mit einem Beispiel beginnen

Verwenden Sie --example, um mit einem vollständigeren Projekt zu starten (benutzerdefinierte Objekte, Felder, Logikfunktionen, Frontend-Komponenten):
npx create-twenty-app@latest my-twenty-app --example postcard
Die Beispiele befinden sich unter twenty-apps/examples. Sie können auch einzelne Entitäten in einem bestehenden Projekt mit yarn twenty add erzeugen — siehe Scaffolding.

Was Sie erstellen können

Apps bestehen aus Entitäten — jede ist als TypeScript-Datei mit einem einzigen export default definiert:
EntitätWas es tut
Objekte & FelderBenutzerdefinierte Datenmodelle (Postkarte, Rechnung usw.) mit typisierten Feldern
LogikfunktionenServerseitiges TypeScript, ausgelöst durch HTTP-Routen, Cron-Zeitpläne oder Datenbankereignisse
Frontend-KomponentenReact-Komponenten, die in der UI von Twenty gerendert werden (Seitenleiste, Widgets, Befehlsmenü)
Fähigkeiten & AgentenKI-Funktionen — wiederverwendbare Anweisungen und autonome Assistenten
Ansichten & NavigationVorkonfigurierte Listenansichten und Seitenleisteneinträge
SeitenlayoutsBenutzerdefinierte Datensatz-Detailseiten mit Tabs und Widgets
Vollständige Referenz: Konzepte.

Nächste Schritte

Konfiguration

Anwendungsidentität, Standardrolle, Install-Hooks, öffentliche Assets.

Daten

Objekte, Felder und bidirektionale Relationen.

Logik

Logikfunktionen, Skills, Agents und OAuth-Verbindungen.

Layout

Ansichten, Navigation, Seiten-Layouts, Front-Komponenten.

Operationen

CLI, Tests, Remotes, CI und die Veröffentlichung Ihrer App.