メインコンテンツへスキップ
Twenty アプリは、カスタムオブジェクト、ロジック、UI コンポーネント、AI 機能でワークスペースを拡張する TypeScript パッケージです。 それらは、完全なサンドボックス化と権限制御のもとで Twenty プラットフォーム上で実行されます。

アプリの仕組み

アプリは、twenty-sdk パッケージの defineEntity() 関数を使って宣言されたエンティティの集合です。 SDK はビルド時に AST 解析によってこれらの宣言を検出し、マニフェストを生成します—アプリがワークスペースに追加する内容を完全に記述したものです。 これらの関数はビルド時に設定を検証し、IDE の自動補完と型安全性を提供します。
your-app/
├── src/
│   ├── application-config.ts    ← defineApplication (required, one per app)
│   ├── roles/                   ← defineRole
│   ├── objects/                 ← defineObject
│   ├── fields/                  ← defineField
│   ├── logic-functions/         ← defineLogicFunction
│   ├── front-components/        ← defineFrontComponent
│   ├── skills/                  ← defineSkill
│   ├── agents/                  ← defineAgent
│   ├── views/                   ← defineView
│   ├── navigation-menu-items/   ← defineNavigationMenuItem
│   └── page-layouts/            ← definePageLayout
├── public/                      ← Static assets (images, icons)
└── package.json
ファイル構成は自由です。 エンティティの検出は AST ベースです—ファイルの場所に関係なく、SDK は export default defineEntity(...) の呼び出しを見つけます。 上記のフォルダー構成は慣例であり、必須条件ではありません。

エンティティタイプ

エンティティ目的ドキュメント
アプリケーションアプリの識別情報、デフォルトロール、変数Application Config
ロールオブジェクトとフィールドの権限セットRoles & Permissions
Objectフィールドを持つカスタムレコードタイプObjects
フィールド他のアプリのオブジェクトにフィールドを追加Extending Objects
リレーションオブジェクト間の双方向リンクRelations
ロジック関数トリガーを備えたサーバーサイド TypeScriptロジック関数
スキル再利用可能な AI エージェントの指示スキルとエージェント
エージェントカスタムプロンプトを備えた AI エージェントスキルとエージェント
接続プロバイダーサードパーティ API 用の OAuth 資格情報Connections
ビュー事前設定済みのレコード一覧ビューViews
ナビゲーションメニュー項目カスタムのサイドバー項目Navigation Menu Items
ページレイアウトレコードの詳細ページ上のタブとウィジェットPage Layouts
フロントコンポーネントTwenty 内でサンドボックス化された React UIフロントコンポーネント
コマンドメニュー項目クイックアクションと Cmd+K エントリCommand Menu Items

サンドボックス化

  • ロジック関数は、サーバー上の分離された Node.js プロセスで実行されます。 データへのアクセスは型付き API クライアント経由に限定され、アプリのロール権限の範囲にスコープされます。
  • フロントコンポーネントは Remote DOM を用いた Web Workers 内で実行されます—メインページからサンドボックス化されつつ、ネイティブの DOM 要素(iframe ではありません)をレンダリングします。 メッセージパッシング型のホスト API を介して Twenty と通信します。
  • 権限は API レベルで強制されます。 実行時トークン(TWENTY_APP_ACCESS_TOKEN)は、defineApplication() で定義されたロールに基づいて生成されます。

アプリのライフサイクル

┌─────────────────────────────────────────────────────────┐
│ Development                                             │
│   npx create-twenty-app → yarn twenty dev (live sync)   │
├─────────────────────────────────────────────────────────┤
│ Build & Deploy                                          │
│   yarn twenty dev:build → yarn twenty app:publish        │
├─────────────────────────────────────────────────────────┤
│ Install flow                                            │
│   upload → [pre-install] → metadata migration →         │
│   generate SDK → [post-install]                         │
├─────────────────────────────────────────────────────────┤
│ Publish                                                 │
│   npm publish → appears in Twenty marketplace           │
└─────────────────────────────────────────────────────────┘
  • yarn twenty dev — ソースファイルを監視し、接続された Twenty サーバーへ変更をライブ同期します。 スキーマが変更されると、型付き API クライアントは自動的に再生成されます。
  • yarn twenty dev:build — TypeScript をコンパイルし、esbuild でロジック関数とフロントコンポーネントをバンドルして、マニフェストを生成します。
  • プリ/ポストインストールフック — インストール中に実行されるオプションの関数。 詳細は Install Hooks を参照してください。

次のステップ

設定

アプリの識別情報、デフォルトロール、およびインストールフック。

データ

オブジェクト、フィールド、および双方向リレーション。

ロジック

ロジック関数、スキル、エージェント、OAuth 接続。

レイアウト

ビュー、ナビゲーション、ページレイアウト、フロントコンポーネント。

オペレーション

CLI、テスト、リモート、CI、アプリの公開。