snapshot of https://github.com/twentyhq/twenty.git (main, 2026-09-17; blobs > 131072B omitted)

packages/twenty-docs/l/ja/developers/extend/apps/layout/overview.mdx

@@ -0,0 +1,59 @@
+---
+title: 概要
+description: Twenty の UI 内にアプリを配置します — サイドバー項目、保存済みビュー、レコードページのタブ、およびサンドボックス化された React コンポーネント。
+icon: table-columns
+---
+
+Twenty アプリの **レイアウトレイヤー** とは、ユーザーに見えるすべての要素を指します。アプリがサイドバーのどこに表示されるか、どのリストビューを提供するか、レコード詳細ページがどのように構成されるか、そしてそれらのページ内でどのカスタム React コンポーネントがレンダリングされるかなどです。
+
+```text
+   Sidebar               Record list            Record detail page
+   ───────               ───────────            ──────────────────
+   [📋 My View]    ────▶ ┌──────────┐          ┌─────────────────────┐
+   [📋 Drafts ]          │ Companies│          │ Tabs: [Overview ]   │
+   [📋 Inbox  ]          │ ──────── │          │       [Notes    ]   │
+        ▲                │  Apple   │          │       [Hello    ]◀──── definePageLayoutTab
+        │                │  Acme    │          │                     │   adds a tab...
+        └ defineNavi-    │  …       │          │  ┌────────────────┐ │
+          gationMenu-    └────▲─────┘          │  │                │ │
+          Item points         │                │  │   React UI     │◀── …with a
+          to a defineView     │                │  │  (sandboxed in │ │   defineFrontComponent
+                              └ defineView     │  │   a Worker)    │ │   widget inside
+                                picks columns  │  └────────────────┘ │
+                                and filters    └─────────────────────┘
+```
+
+## このセクションについて
+
+<CardGroup cols={2}>
+  <Card title="ビュー" icon="list" href="/l/ja/developers/extend/apps/layout/views">
+    `defineView` — 表示カラム、フィルター、グループなどを含む、保存済みリスト構成。
+  </Card>
+  <Card title="ナビゲーションメニュー項目" icon="bars" href="/l/ja/developers/extend/apps/layout/navigation-menu-items">
+    `defineNavigationMenuItem` — ビューまたは外部 URL を指すサイドバー項目。
+  </Card>
+  <Card title="ページレイアウト" icon="table-columns" href="/l/ja/developers/extend/apps/layout/page-layouts">
+    `definePageLayout` および `definePageLayoutTab` — レコード詳細ページ上のタブとウィジェット。
+  </Card>
+  <Card title="フロントコンポーネント" icon="window-maximize" href="/l/ja/developers/extend/apps/layout/front-components">
+    `defineFrontComponent` — Twenty 内でレンダリングされる、サンドボックス化された React コンポーネント。
+  </Card>
+  <Card title="コマンドメニュー項目" icon="terminal" href="/l/ja/developers/extend/apps/layout/command-menu-items">
+    `defineCommandMenuItem` — フロントコンポーネントを Cmd+K の項目およびクイックアクションとして登録します。
+  </Card>
+</CardGroup>
+
+## アプリが表示される場所
+
+| 表示場所                 | 制御内容                                             | エンティティ                                    |
+| -------------------- | ------------------------------------------------ | ----------------------------------------- |
+| **サイドバー**            | 保存済みビューまたは外部 URL へリンクするカスタム項目                    | `defineNavigationMenuItem`                |
+| **レコードリスト**          | オブジェクト向けの保存済み構成 — 表示カラム、順序、フィルター、グループ            | `defineView`                              |
+| **レコード詳細ページ**        | レコードページ上のタブおよびウィジェット（独自オブジェクトのもの、または標準オブジェクトのもの） | `definePageLayout`, `definePageLayoutTab` |
+| **上記いずれかの内部**        | カスタム React ウィジェット — ボタン、フォーム、ダッシュボード、連携機能        | `defineFrontComponent`                    |
+| **アプリ設定**            | アプリの「設定」タブ内にある、デフォルトの変数 UI に代わるカスタム設定セクション       | `defineSettingsFrontComponent`            |
+| **コマンドメニュー (Cmd+K)** | ピン留めされたクイックアクションまたは非表示コマンド                       | `defineCommandMenuItem`                   |
+
+フロントコンポーネントは Remote DOM を使用して、分離された Web Worker 内で実行されます。ページ内に *ネイティブに*（iframe 内ではなく）レンダリングされますが、ホストページや DOM へ直接アクセスすることはできません。 Twenty との通信は、メッセージパッシング型のホスト API を通じて行われます。
+
+これらは依然として積極的に開発中です。サンドボックスは DOM を部分的にのみ実装しているため、高度な利用方法では失敗する場合があります。 [現在の制限](/l/ja/developers/extend/apps/layout/front-components#current-limitations) を参照してください。