diff --git a/packages/twenty-docs/docs.json b/packages/twenty-docs/docs.json index d8a33b0ca5..67fcfd9354 100644 --- a/packages/twenty-docs/docs.json +++ b/packages/twenty-docs/docs.json @@ -3151,15 +3151,15 @@ "language": "ja", "tabs": [ { - "tab": "User Guide", + "tab": "ユーザーガイド", "groups": [ { - "group": "Discover Twenty", + "group": "Twenty を知る", "icon": "rocket", "pages": [ "l/ja/user-guide/introduction", { - "group": "Capabilities", + "group": "機能", "pages": [ "l/ja/user-guide/getting-started/capabilities/what-is-twenty", "l/ja/user-guide/getting-started/capabilities/implementation-services", @@ -3167,7 +3167,7 @@ ] }, { - "group": "How-Tos", + "group": "ハウツー", "pages": [ "l/ja/user-guide/getting-started/how-tos/create-workspace", "l/ja/user-guide/getting-started/how-tos/navigate-around-twenty", @@ -3177,12 +3177,12 @@ ] }, { - "group": "Data Model", + "group": "データモデル", "icon": "database", "pages": [ "l/ja/user-guide/data-model/overview", { - "group": "Capabilities", + "group": "機能", "pages": [ "l/ja/user-guide/data-model/capabilities/objects", "l/ja/user-guide/data-model/capabilities/fields", @@ -3190,7 +3190,7 @@ ] }, { - "group": "How-Tos", + "group": "ハウツー", "pages": [ "l/ja/user-guide/data-model/how-tos/create-custom-objects", "l/ja/user-guide/data-model/how-tos/create-custom-fields", @@ -3203,12 +3203,12 @@ ] }, { - "group": "Data Migration", + "group": "データ移行", "icon": "cloud-arrow-up", "pages": [ "l/ja/user-guide/data-migration/overview", { - "group": "Capabilities", + "group": "機能", "pages": [ "l/ja/user-guide/data-migration/capabilities/file-formats", "l/ja/user-guide/data-migration/capabilities/field-mapping", @@ -3218,7 +3218,7 @@ ] }, { - "group": "How-Tos", + "group": "ハウツー", "pages": [ "l/ja/user-guide/data-migration/how-tos/prepare-your-csv-files", "l/ja/user-guide/data-migration/how-tos/import-companies-via-csv", @@ -3235,19 +3235,19 @@ ] }, { - "group": "Calendar & Emails", + "group": "カレンダーとメール", "icon": "envelope", "pages": [ "l/ja/user-guide/calendar-emails/overview", { - "group": "Capabilities", + "group": "機能", "pages": [ "l/ja/user-guide/calendar-emails/capabilities/mailbox", "l/ja/user-guide/calendar-emails/capabilities/calendar" ] }, { - "group": "How-Tos", + "group": "ハウツー", "pages": [ "l/ja/user-guide/calendar-emails/how-tos/connect-several-mailboxes-per-user", "l/ja/user-guide/calendar-emails/how-tos/limit-emails-imported", @@ -3260,12 +3260,12 @@ ] }, { - "group": "Workflows", + "group": "ワークフロー", "icon": "bolt", "pages": [ "l/ja/user-guide/workflows/overview", { - "group": "Capabilities", + "group": "機能", "pages": [ "l/ja/user-guide/workflows/capabilities/workflow-triggers", "l/ja/user-guide/workflows/capabilities/workflow-actions", @@ -3279,10 +3279,10 @@ ] }, { - "group": "How-Tos", + "group": "ハウツー", "pages": [ { - "group": "CRM Automations", + "group": "CRM の自動化", "pages": [ "l/ja/user-guide/workflows/how-tos/crm-automations/send-email-alerts-with-tasks-due", "l/ja/user-guide/workflows/how-tos/crm-automations/notify-teammates-of-note-to-review", @@ -3294,7 +3294,7 @@ ] }, { - "group": "Connect to Other Tools", + "group": "他のツールと連携", "pages": [ "l/ja/user-guide/workflows/how-tos/connect-to-other-tools/set-up-a-webhook-trigger", "l/ja/user-guide/workflows/how-tos/connect-to-other-tools/bring-typeform-submissions-in-twenty", @@ -3304,13 +3304,13 @@ ] }, { - "group": "Advanced Configurations", + "group": "高度な設定", "pages": [ "l/ja/user-guide/workflows/how-tos/advanced-configurations/handle-arrays-in-code-actions" ] }, { - "group": "Need More Help", + "group": "さらにヘルプが必要な場合", "pages": [ "l/ja/user-guide/workflows/how-tos/need-more-help/workflow-troubleshooting", "l/ja/user-guide/workflows/how-tos/need-more-help/workflows-faq", @@ -3327,7 +3327,7 @@ "pages": [ "l/ja/user-guide/ai/overview", { - "group": "Capabilities", + "group": "機能", "pages": [ "l/ja/user-guide/ai/capabilities/ai-chatbot", "l/ja/user-guide/ai/capabilities/ai-agents", @@ -3335,7 +3335,7 @@ ] }, { - "group": "How-Tos", + "group": "ハウツー", "pages": [ "l/ja/user-guide/ai/how-tos/ai-faq" ] @@ -3343,12 +3343,12 @@ ] }, { - "group": "Views & Pipelines", + "group": "ビューとパイプライン", "icon": "table", "pages": [ "l/ja/user-guide/views-pipelines/overview", { - "group": "Capabilities", + "group": "機能", "pages": [ "l/ja/user-guide/views-pipelines/capabilities/table-views", "l/ja/user-guide/views-pipelines/capabilities/kanban-views", @@ -3359,7 +3359,7 @@ ] }, { - "group": "How-Tos", + "group": "ハウツー", "pages": [ "l/ja/user-guide/views-pipelines/how-tos/create-a-table-view-with-grouping", "l/ja/user-guide/views-pipelines/how-tos/create-a-kanban-view-for-projects", @@ -3373,12 +3373,12 @@ ] }, { - "group": "Dashboards", + "group": "ダッシュボード", "icon": "chart-bar", "pages": [ "l/ja/user-guide/dashboards/overview", { - "group": "Capabilities", + "group": "機能", "pages": [ "l/ja/user-guide/dashboards/capabilities/dashboards", "l/ja/user-guide/dashboards/capabilities/widgets", @@ -3386,7 +3386,7 @@ ] }, { - "group": "How-Tos", + "group": "ハウツー", "pages": [ "l/ja/user-guide/dashboards/how-tos/dashboards-faq", "l/ja/user-guide/dashboards/how-tos/widget-faq" @@ -3395,19 +3395,19 @@ ] }, { - "group": "Permissions & Access", + "group": "権限とアクセス", "icon": "lock", "pages": [ "l/ja/user-guide/permissions-access/overview", { - "group": "Capabilities", + "group": "機能", "pages": [ "l/ja/user-guide/permissions-access/capabilities/permissions", "l/ja/user-guide/permissions-access/capabilities/sso-configuration" ] }, { - "group": "How-Tos", + "group": "ハウツー", "pages": [ "l/ja/user-guide/permissions-access/how-tos/permissions-faq" ] @@ -3415,19 +3415,19 @@ ] }, { - "group": "Billing", + "group": "請求", "icon": "credit-card", "pages": [ "l/ja/user-guide/billing/overview", { - "group": "Capabilities", + "group": "機能", "pages": [ "l/ja/user-guide/billing/capabilities/pricing-plans", "l/ja/user-guide/billing/capabilities/workflow-credits" ] }, { - "group": "How-Tos", + "group": "ハウツー", "pages": [ "l/ja/user-guide/billing/how-tos/billing-faq" ] @@ -3435,12 +3435,12 @@ ] }, { - "group": "Settings", + "group": "設定", "icon": "gear", "pages": [ "l/ja/user-guide/settings/overview", { - "group": "Capabilities", + "group": "機能", "pages": [ "l/ja/user-guide/settings/capabilities/workspace-settings", "l/ja/user-guide/settings/capabilities/member-management", @@ -3451,7 +3451,7 @@ ] }, { - "group": "How-Tos", + "group": "ハウツー", "pages": [ "l/ja/user-guide/settings/how-tos/settings-faq" ] @@ -3461,21 +3461,21 @@ ] }, { - "tab": "Developers", + "tab": "開発者", "groups": [ { - "group": "Developers", + "group": "開発者", "pages": [ "l/ja/developers/introduction" ] }, { - "group": "Extend", + "group": "拡張", "icon": "plug", "pages": [ "l/ja/developers/extend/extend", { - "group": "Capabilities", + "group": "機能", "pages": [ "l/ja/developers/extend/capabilities/apis", "l/ja/developers/extend/capabilities/webhooks", @@ -3485,12 +3485,12 @@ ] }, { - "group": "Self-Host", + "group": "セルフホスト", "icon": "desktop", "pages": [ "l/ja/developers/self-host/self-host", { - "group": "Capabilities", + "group": "機能", "pages": [ "l/ja/developers/self-host/capabilities/docker-compose", "l/ja/developers/self-host/capabilities/setup", @@ -3502,17 +3502,17 @@ ] }, { - "group": "Contribute", + "group": "貢献", "icon": "github", "pages": [ "l/ja/developers/contribute/contribute", { - "group": "Capabilities", + "group": "機能", "pages": [ "l/ja/developers/contribute/capabilities/local-setup", "l/ja/developers/contribute/capabilities/bug-and-requests", { - "group": "Frontend Development", + "group": "フロントエンド開発", "pages": [ "l/ja/developers/contribute/capabilities/frontend-development/storybook", { @@ -3520,7 +3520,7 @@ "pages": [ "l/ja/twenty-ui/introduction", { - "group": "Display", + "group": "表示", "pages": [ "l/ja/twenty-ui/display/checkmark", "l/ja/twenty-ui/display/chip", @@ -3531,13 +3531,13 @@ ] }, { - "group": "Feedback", + "group": "フィードバック", "pages": [ "l/ja/twenty-ui/progress-bar" ] }, { - "group": "Input", + "group": "入力", "pages": [ "l/ja/twenty-ui/input/buttons", "l/ja/twenty-ui/input/color-scheme", @@ -3552,7 +3552,7 @@ ] }, { - "group": "Navigation", + "group": "ナビゲーション", "pages": [ "l/ja/twenty-ui/navigation", "l/ja/twenty-ui/navigation/breadcrumb", @@ -3573,7 +3573,7 @@ ] }, { - "group": "Backend Development", + "group": "バックエンド開発", "pages": [ "l/ja/developers/contribute/capabilities/backend-development/server-commands", "l/ja/developers/contribute/capabilities/backend-development/feature-flags", @@ -3596,15 +3596,15 @@ "language": "ko", "tabs": [ { - "tab": "User Guide", + "tab": "사용자 안내서", "groups": [ { - "group": "Discover Twenty", + "group": "Twenty 알아보기", "icon": "rocket", "pages": [ "l/ko/user-guide/introduction", { - "group": "Capabilities", + "group": "기능", "pages": [ "l/ko/user-guide/getting-started/capabilities/what-is-twenty", "l/ko/user-guide/getting-started/capabilities/implementation-services", @@ -3612,7 +3612,7 @@ ] }, { - "group": "How-Tos", + "group": "사용 방법", "pages": [ "l/ko/user-guide/getting-started/how-tos/create-workspace", "l/ko/user-guide/getting-started/how-tos/navigate-around-twenty", @@ -3622,12 +3622,12 @@ ] }, { - "group": "Data Model", + "group": "데이터 모델", "icon": "database", "pages": [ "l/ko/user-guide/data-model/overview", { - "group": "Capabilities", + "group": "기능", "pages": [ "l/ko/user-guide/data-model/capabilities/objects", "l/ko/user-guide/data-model/capabilities/fields", @@ -3635,7 +3635,7 @@ ] }, { - "group": "How-Tos", + "group": "사용 방법", "pages": [ "l/ko/user-guide/data-model/how-tos/create-custom-objects", "l/ko/user-guide/data-model/how-tos/create-custom-fields", @@ -3648,12 +3648,12 @@ ] }, { - "group": "Data Migration", + "group": "데이터 마이그레이션", "icon": "cloud-arrow-up", "pages": [ "l/ko/user-guide/data-migration/overview", { - "group": "Capabilities", + "group": "기능", "pages": [ "l/ko/user-guide/data-migration/capabilities/file-formats", "l/ko/user-guide/data-migration/capabilities/field-mapping", @@ -3663,7 +3663,7 @@ ] }, { - "group": "How-Tos", + "group": "사용 방법", "pages": [ "l/ko/user-guide/data-migration/how-tos/prepare-your-csv-files", "l/ko/user-guide/data-migration/how-tos/import-companies-via-csv", @@ -3680,19 +3680,19 @@ ] }, { - "group": "Calendar & Emails", + "group": "캘린더 및 이메일", "icon": "envelope", "pages": [ "l/ko/user-guide/calendar-emails/overview", { - "group": "Capabilities", + "group": "기능", "pages": [ "l/ko/user-guide/calendar-emails/capabilities/mailbox", "l/ko/user-guide/calendar-emails/capabilities/calendar" ] }, { - "group": "How-Tos", + "group": "사용 방법", "pages": [ "l/ko/user-guide/calendar-emails/how-tos/connect-several-mailboxes-per-user", "l/ko/user-guide/calendar-emails/how-tos/limit-emails-imported", @@ -3705,12 +3705,12 @@ ] }, { - "group": "Workflows", + "group": "워크플로우", "icon": "bolt", "pages": [ "l/ko/user-guide/workflows/overview", { - "group": "Capabilities", + "group": "기능", "pages": [ "l/ko/user-guide/workflows/capabilities/workflow-triggers", "l/ko/user-guide/workflows/capabilities/workflow-actions", @@ -3724,10 +3724,10 @@ ] }, { - "group": "How-Tos", + "group": "사용 방법", "pages": [ { - "group": "CRM Automations", + "group": "CRM 자동화", "pages": [ "l/ko/user-guide/workflows/how-tos/crm-automations/send-email-alerts-with-tasks-due", "l/ko/user-guide/workflows/how-tos/crm-automations/notify-teammates-of-note-to-review", @@ -3739,7 +3739,7 @@ ] }, { - "group": "Connect to Other Tools", + "group": "다른 도구에 연결하기", "pages": [ "l/ko/user-guide/workflows/how-tos/connect-to-other-tools/set-up-a-webhook-trigger", "l/ko/user-guide/workflows/how-tos/connect-to-other-tools/bring-typeform-submissions-in-twenty", @@ -3749,13 +3749,13 @@ ] }, { - "group": "Advanced Configurations", + "group": "고급 설정", "pages": [ "l/ko/user-guide/workflows/how-tos/advanced-configurations/handle-arrays-in-code-actions" ] }, { - "group": "Need More Help", + "group": "추가 도움이 필요하십니까", "pages": [ "l/ko/user-guide/workflows/how-tos/need-more-help/workflow-troubleshooting", "l/ko/user-guide/workflows/how-tos/need-more-help/workflows-faq", @@ -3772,7 +3772,7 @@ "pages": [ "l/ko/user-guide/ai/overview", { - "group": "Capabilities", + "group": "기능", "pages": [ "l/ko/user-guide/ai/capabilities/ai-chatbot", "l/ko/user-guide/ai/capabilities/ai-agents", @@ -3780,7 +3780,7 @@ ] }, { - "group": "How-Tos", + "group": "사용 방법", "pages": [ "l/ko/user-guide/ai/how-tos/ai-faq" ] @@ -3788,12 +3788,12 @@ ] }, { - "group": "Views & Pipelines", + "group": "뷰 및 파이프라인", "icon": "table", "pages": [ "l/ko/user-guide/views-pipelines/overview", { - "group": "Capabilities", + "group": "기능", "pages": [ "l/ko/user-guide/views-pipelines/capabilities/table-views", "l/ko/user-guide/views-pipelines/capabilities/kanban-views", @@ -3804,7 +3804,7 @@ ] }, { - "group": "How-Tos", + "group": "사용 방법", "pages": [ "l/ko/user-guide/views-pipelines/how-tos/create-a-table-view-with-grouping", "l/ko/user-guide/views-pipelines/how-tos/create-a-kanban-view-for-projects", @@ -3818,12 +3818,12 @@ ] }, { - "group": "Dashboards", + "group": "대시보드", "icon": "chart-bar", "pages": [ "l/ko/user-guide/dashboards/overview", { - "group": "Capabilities", + "group": "기능", "pages": [ "l/ko/user-guide/dashboards/capabilities/dashboards", "l/ko/user-guide/dashboards/capabilities/widgets", @@ -3831,7 +3831,7 @@ ] }, { - "group": "How-Tos", + "group": "사용 방법", "pages": [ "l/ko/user-guide/dashboards/how-tos/dashboards-faq", "l/ko/user-guide/dashboards/how-tos/widget-faq" @@ -3840,19 +3840,19 @@ ] }, { - "group": "Permissions & Access", + "group": "권한 및 접근", "icon": "lock", "pages": [ "l/ko/user-guide/permissions-access/overview", { - "group": "Capabilities", + "group": "기능", "pages": [ "l/ko/user-guide/permissions-access/capabilities/permissions", "l/ko/user-guide/permissions-access/capabilities/sso-configuration" ] }, { - "group": "How-Tos", + "group": "사용 방법", "pages": [ "l/ko/user-guide/permissions-access/how-tos/permissions-faq" ] @@ -3860,19 +3860,19 @@ ] }, { - "group": "Billing", + "group": "청구", "icon": "credit-card", "pages": [ "l/ko/user-guide/billing/overview", { - "group": "Capabilities", + "group": "기능", "pages": [ "l/ko/user-guide/billing/capabilities/pricing-plans", "l/ko/user-guide/billing/capabilities/workflow-credits" ] }, { - "group": "How-Tos", + "group": "사용 방법", "pages": [ "l/ko/user-guide/billing/how-tos/billing-faq" ] @@ -3880,12 +3880,12 @@ ] }, { - "group": "Settings", + "group": "설정", "icon": "gear", "pages": [ "l/ko/user-guide/settings/overview", { - "group": "Capabilities", + "group": "기능", "pages": [ "l/ko/user-guide/settings/capabilities/workspace-settings", "l/ko/user-guide/settings/capabilities/member-management", @@ -3896,7 +3896,7 @@ ] }, { - "group": "How-Tos", + "group": "사용 방법", "pages": [ "l/ko/user-guide/settings/how-tos/settings-faq" ] @@ -3906,21 +3906,21 @@ ] }, { - "tab": "Developers", + "tab": "개발자", "groups": [ { - "group": "Developers", + "group": "개발자", "pages": [ "l/ko/developers/introduction" ] }, { - "group": "Extend", + "group": "확장", "icon": "plug", "pages": [ "l/ko/developers/extend/extend", { - "group": "Capabilities", + "group": "기능", "pages": [ "l/ko/developers/extend/capabilities/apis", "l/ko/developers/extend/capabilities/webhooks", @@ -3930,12 +3930,12 @@ ] }, { - "group": "Self-Host", + "group": "셀프 호스팅", "icon": "desktop", "pages": [ "l/ko/developers/self-host/self-host", { - "group": "Capabilities", + "group": "기능", "pages": [ "l/ko/developers/self-host/capabilities/docker-compose", "l/ko/developers/self-host/capabilities/setup", @@ -3947,17 +3947,17 @@ ] }, { - "group": "Contribute", + "group": "기여", "icon": "github", "pages": [ "l/ko/developers/contribute/contribute", { - "group": "Capabilities", + "group": "기능", "pages": [ "l/ko/developers/contribute/capabilities/local-setup", "l/ko/developers/contribute/capabilities/bug-and-requests", { - "group": "Frontend Development", + "group": "프론트엔드 개발", "pages": [ "l/ko/developers/contribute/capabilities/frontend-development/storybook", { @@ -3965,7 +3965,7 @@ "pages": [ "l/ko/twenty-ui/introduction", { - "group": "Display", + "group": "표시", "pages": [ "l/ko/twenty-ui/display/checkmark", "l/ko/twenty-ui/display/chip", @@ -3976,13 +3976,13 @@ ] }, { - "group": "Feedback", + "group": "피드백", "pages": [ "l/ko/twenty-ui/progress-bar" ] }, { - "group": "Input", + "group": "입력", "pages": [ "l/ko/twenty-ui/input/buttons", "l/ko/twenty-ui/input/color-scheme", @@ -3997,7 +3997,7 @@ ] }, { - "group": "Navigation", + "group": "네비게이션", "pages": [ "l/ko/twenty-ui/navigation", "l/ko/twenty-ui/navigation/breadcrumb", @@ -4018,7 +4018,7 @@ ] }, { - "group": "Backend Development", + "group": "백엔드 개발", "pages": [ "l/ko/developers/contribute/capabilities/backend-development/server-commands", "l/ko/developers/contribute/capabilities/backend-development/feature-flags", @@ -4067,7 +4067,7 @@ ] }, { - "group": "Data Model", + "group": "Modelo de dados", "icon": "database", "pages": [ "l/pt/user-guide/data-model/overview", @@ -4150,7 +4150,7 @@ ] }, { - "group": "Workflows", + "group": "Fluxos de trabalho", "icon": "bolt", "pages": [ "l/pt/user-guide/workflows/overview", @@ -4200,7 +4200,7 @@ ] }, { - "group": "Need More Help", + "group": "Precisa de mais ajuda", "pages": [ "l/pt/user-guide/workflows/how-tos/need-more-help/workflow-troubleshooting", "l/pt/user-guide/workflows/how-tos/need-more-help/workflows-faq", @@ -4212,7 +4212,7 @@ ] }, { - "group": "AI", + "group": "IA", "icon": "robot", "pages": [ "l/pt/user-guide/ai/overview", @@ -4233,7 +4233,7 @@ ] }, { - "group": "Views & Pipelines", + "group": "Visualizações e pipelines", "icon": "table", "pages": [ "l/pt/user-guide/views-pipelines/overview", @@ -4263,7 +4263,7 @@ ] }, { - "group": "Dashboards", + "group": "Painéis", "icon": "chart-bar", "pages": [ "l/pt/user-guide/dashboards/overview", @@ -4305,7 +4305,7 @@ ] }, { - "group": "Billing", + "group": "Faturação", "icon": "credit-card", "pages": [ "l/pt/user-guide/billing/overview", @@ -4325,7 +4325,7 @@ ] }, { - "group": "Settings", + "group": "Configurações", "icon": "gear", "pages": [ "l/pt/user-guide/settings/overview", @@ -4351,10 +4351,10 @@ ] }, { - "tab": "Developers", + "tab": "Programadores", "groups": [ { - "group": "Developers", + "group": "Programadores", "pages": [ "l/pt/developers/introduction" ] @@ -4402,7 +4402,7 @@ "l/pt/developers/contribute/capabilities/local-setup", "l/pt/developers/contribute/capabilities/bug-and-requests", { - "group": "Frontend Development", + "group": "Desenvolvimento Frontend", "pages": [ "l/pt/developers/contribute/capabilities/frontend-development/storybook", { @@ -4410,7 +4410,7 @@ "pages": [ "l/pt/twenty-ui/introduction", { - "group": "Display", + "group": "Exibir", "pages": [ "l/pt/twenty-ui/display/checkmark", "l/pt/twenty-ui/display/chip", @@ -4427,7 +4427,7 @@ ] }, { - "group": "Input", + "group": "Entrada", "pages": [ "l/pt/twenty-ui/input/buttons", "l/pt/twenty-ui/input/color-scheme", @@ -4442,7 +4442,7 @@ ] }, { - "group": "Navigation", + "group": "Navegação", "pages": [ "l/pt/twenty-ui/navigation", "l/pt/twenty-ui/navigation/breadcrumb", @@ -4463,7 +4463,7 @@ ] }, { - "group": "Backend Development", + "group": "Desenvolvimento Backend", "pages": [ "l/pt/developers/contribute/capabilities/backend-development/server-commands", "l/pt/developers/contribute/capabilities/backend-development/feature-flags", @@ -5821,15 +5821,15 @@ "language": "zh", "tabs": [ { - "tab": "User Guide", + "tab": "用户指南", "groups": [ { - "group": "Discover Twenty", + "group": "发现 Twenty", "icon": "rocket", "pages": [ "l/zh/user-guide/introduction", { - "group": "Capabilities", + "group": "功能", "pages": [ "l/zh/user-guide/getting-started/capabilities/what-is-twenty", "l/zh/user-guide/getting-started/capabilities/implementation-services", @@ -5837,7 +5837,7 @@ ] }, { - "group": "How-Tos", + "group": "操作指南", "pages": [ "l/zh/user-guide/getting-started/how-tos/create-workspace", "l/zh/user-guide/getting-started/how-tos/navigate-around-twenty", @@ -5847,12 +5847,12 @@ ] }, { - "group": "Data Model", + "group": "数据模型", "icon": "database", "pages": [ "l/zh/user-guide/data-model/overview", { - "group": "Capabilities", + "group": "功能", "pages": [ "l/zh/user-guide/data-model/capabilities/objects", "l/zh/user-guide/data-model/capabilities/fields", @@ -5860,7 +5860,7 @@ ] }, { - "group": "How-Tos", + "group": "操作指南", "pages": [ "l/zh/user-guide/data-model/how-tos/create-custom-objects", "l/zh/user-guide/data-model/how-tos/create-custom-fields", @@ -5873,12 +5873,12 @@ ] }, { - "group": "Data Migration", + "group": "数据迁移", "icon": "cloud-arrow-up", "pages": [ "l/zh/user-guide/data-migration/overview", { - "group": "Capabilities", + "group": "功能", "pages": [ "l/zh/user-guide/data-migration/capabilities/file-formats", "l/zh/user-guide/data-migration/capabilities/field-mapping", @@ -5888,7 +5888,7 @@ ] }, { - "group": "How-Tos", + "group": "操作指南", "pages": [ "l/zh/user-guide/data-migration/how-tos/prepare-your-csv-files", "l/zh/user-guide/data-migration/how-tos/import-companies-via-csv", @@ -5905,19 +5905,19 @@ ] }, { - "group": "Calendar & Emails", + "group": "日历与电子邮件", "icon": "envelope", "pages": [ "l/zh/user-guide/calendar-emails/overview", { - "group": "Capabilities", + "group": "功能", "pages": [ "l/zh/user-guide/calendar-emails/capabilities/mailbox", "l/zh/user-guide/calendar-emails/capabilities/calendar" ] }, { - "group": "How-Tos", + "group": "操作指南", "pages": [ "l/zh/user-guide/calendar-emails/how-tos/connect-several-mailboxes-per-user", "l/zh/user-guide/calendar-emails/how-tos/limit-emails-imported", @@ -5930,12 +5930,12 @@ ] }, { - "group": "Workflows", + "group": "工作流", "icon": "bolt", "pages": [ "l/zh/user-guide/workflows/overview", { - "group": "Capabilities", + "group": "功能", "pages": [ "l/zh/user-guide/workflows/capabilities/workflow-triggers", "l/zh/user-guide/workflows/capabilities/workflow-actions", @@ -5949,10 +5949,10 @@ ] }, { - "group": "How-Tos", + "group": "操作指南", "pages": [ { - "group": "CRM Automations", + "group": "CRM 自动化", "pages": [ "l/zh/user-guide/workflows/how-tos/crm-automations/send-email-alerts-with-tasks-due", "l/zh/user-guide/workflows/how-tos/crm-automations/notify-teammates-of-note-to-review", @@ -5964,7 +5964,7 @@ ] }, { - "group": "Connect to Other Tools", + "group": "连接到其他工具", "pages": [ "l/zh/user-guide/workflows/how-tos/connect-to-other-tools/set-up-a-webhook-trigger", "l/zh/user-guide/workflows/how-tos/connect-to-other-tools/bring-typeform-submissions-in-twenty", @@ -5974,13 +5974,13 @@ ] }, { - "group": "Advanced Configurations", + "group": "高级配置", "pages": [ "l/zh/user-guide/workflows/how-tos/advanced-configurations/handle-arrays-in-code-actions" ] }, { - "group": "Need More Help", + "group": "需要更多帮助", "pages": [ "l/zh/user-guide/workflows/how-tos/need-more-help/workflow-troubleshooting", "l/zh/user-guide/workflows/how-tos/need-more-help/workflows-faq", @@ -5997,7 +5997,7 @@ "pages": [ "l/zh/user-guide/ai/overview", { - "group": "Capabilities", + "group": "功能", "pages": [ "l/zh/user-guide/ai/capabilities/ai-chatbot", "l/zh/user-guide/ai/capabilities/ai-agents", @@ -6005,7 +6005,7 @@ ] }, { - "group": "How-Tos", + "group": "操作指南", "pages": [ "l/zh/user-guide/ai/how-tos/ai-faq" ] @@ -6013,12 +6013,12 @@ ] }, { - "group": "Views & Pipelines", + "group": "视图与管道", "icon": "table", "pages": [ "l/zh/user-guide/views-pipelines/overview", { - "group": "Capabilities", + "group": "功能", "pages": [ "l/zh/user-guide/views-pipelines/capabilities/table-views", "l/zh/user-guide/views-pipelines/capabilities/kanban-views", @@ -6029,7 +6029,7 @@ ] }, { - "group": "How-Tos", + "group": "操作指南", "pages": [ "l/zh/user-guide/views-pipelines/how-tos/create-a-table-view-with-grouping", "l/zh/user-guide/views-pipelines/how-tos/create-a-kanban-view-for-projects", @@ -6043,12 +6043,12 @@ ] }, { - "group": "Dashboards", + "group": "仪表板", "icon": "chart-bar", "pages": [ "l/zh/user-guide/dashboards/overview", { - "group": "Capabilities", + "group": "功能", "pages": [ "l/zh/user-guide/dashboards/capabilities/dashboards", "l/zh/user-guide/dashboards/capabilities/widgets", @@ -6056,7 +6056,7 @@ ] }, { - "group": "How-Tos", + "group": "操作指南", "pages": [ "l/zh/user-guide/dashboards/how-tos/dashboards-faq", "l/zh/user-guide/dashboards/how-tos/widget-faq" @@ -6065,19 +6065,19 @@ ] }, { - "group": "Permissions & Access", + "group": "权限与访问", "icon": "lock", "pages": [ "l/zh/user-guide/permissions-access/overview", { - "group": "Capabilities", + "group": "功能", "pages": [ "l/zh/user-guide/permissions-access/capabilities/permissions", "l/zh/user-guide/permissions-access/capabilities/sso-configuration" ] }, { - "group": "How-Tos", + "group": "操作指南", "pages": [ "l/zh/user-guide/permissions-access/how-tos/permissions-faq" ] @@ -6085,19 +6085,19 @@ ] }, { - "group": "Billing", + "group": "账单", "icon": "credit-card", "pages": [ "l/zh/user-guide/billing/overview", { - "group": "Capabilities", + "group": "功能", "pages": [ "l/zh/user-guide/billing/capabilities/pricing-plans", "l/zh/user-guide/billing/capabilities/workflow-credits" ] }, { - "group": "How-Tos", + "group": "操作指南", "pages": [ "l/zh/user-guide/billing/how-tos/billing-faq" ] @@ -6105,12 +6105,12 @@ ] }, { - "group": "Settings", + "group": "设置", "icon": "gear", "pages": [ "l/zh/user-guide/settings/overview", { - "group": "Capabilities", + "group": "功能", "pages": [ "l/zh/user-guide/settings/capabilities/workspace-settings", "l/zh/user-guide/settings/capabilities/member-management", @@ -6121,7 +6121,7 @@ ] }, { - "group": "How-Tos", + "group": "操作指南", "pages": [ "l/zh/user-guide/settings/how-tos/settings-faq" ] @@ -6131,21 +6131,21 @@ ] }, { - "tab": "Developers", + "tab": "开发者", "groups": [ { - "group": "Developers", + "group": "开发者", "pages": [ "l/zh/developers/introduction" ] }, { - "group": "Extend", + "group": "扩展", "icon": "plug", "pages": [ "l/zh/developers/extend/extend", { - "group": "Capabilities", + "group": "功能", "pages": [ "l/zh/developers/extend/capabilities/apis", "l/zh/developers/extend/capabilities/webhooks", @@ -6155,12 +6155,12 @@ ] }, { - "group": "Self-Host", + "group": "自托管", "icon": "desktop", "pages": [ "l/zh/developers/self-host/self-host", { - "group": "Capabilities", + "group": "功能", "pages": [ "l/zh/developers/self-host/capabilities/docker-compose", "l/zh/developers/self-host/capabilities/setup", @@ -6172,17 +6172,17 @@ ] }, { - "group": "Contribute", + "group": "贡献", "icon": "github", "pages": [ "l/zh/developers/contribute/contribute", { - "group": "Capabilities", + "group": "功能", "pages": [ "l/zh/developers/contribute/capabilities/local-setup", "l/zh/developers/contribute/capabilities/bug-and-requests", { - "group": "Frontend Development", + "group": "前端开发", "pages": [ "l/zh/developers/contribute/capabilities/frontend-development/storybook", { @@ -6190,7 +6190,7 @@ "pages": [ "l/zh/twenty-ui/introduction", { - "group": "Display", + "group": "展示", "pages": [ "l/zh/twenty-ui/display/checkmark", "l/zh/twenty-ui/display/chip", @@ -6201,13 +6201,13 @@ ] }, { - "group": "Feedback", + "group": "反馈", "pages": [ "l/zh/twenty-ui/progress-bar" ] }, { - "group": "Input", + "group": "输入", "pages": [ "l/zh/twenty-ui/input/buttons", "l/zh/twenty-ui/input/color-scheme", @@ -6222,7 +6222,7 @@ ] }, { - "group": "Navigation", + "group": "导航", "pages": [ "l/zh/twenty-ui/navigation", "l/zh/twenty-ui/navigation/breadcrumb", @@ -6243,7 +6243,7 @@ ] }, { - "group": "Backend Development", + "group": "后端开发", "pages": [ "l/zh/developers/contribute/capabilities/backend-development/server-commands", "l/zh/developers/contribute/capabilities/backend-development/feature-flags", diff --git a/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/best-practices-server.mdx b/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/best-practices-server.mdx index d8f5c5ea7c..9a199fd6c1 100644 --- a/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/best-practices-server.mdx +++ b/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/best-practices-server.mdx @@ -1,22 +1,22 @@ --- -title: Best Practices +title: ベストプラクティス', --- -This document outlines the best practices you should follow when working on the backend. +この文書は、バックエンドで作業する際に従うべきベストプラクティスを概説しています。 -## Follow a modular approach +## モジュール化アプローチを採用する -The backend follows a modular approach, which is a fundamental principle when working with NestJS. Make sure you break down your code into reusable modules to maintain a clean and organized codebase. -Each module should encapsulate a particular feature or functionality and have a well-defined scope. This modular approach enables clear separation of concerns and removes unnecessary complexities. +バックエンドは、NestJSを使用する際の基本原則であるモジュラーアプローチを採用しています。 コードを再利用可能なモジュールに分割し、クリーンで整理されたコードベースを維持してください。 +各モジュールは特定の機能や機能性をカプセル化し、明確なスコープを持つべきです。 このモジュラーアプローチにより、関心事を明確に分離し、不要な複雑さを排除します。 -## Expose services to use in modules +## モジュールで使用するサービスを公開する -Always create services that have a clear and single responsibility, which enhances code readability and maintainability. Name the services descriptively and consistently. +常に、明確で単一の責務を持つサービスを作成してください。これにより、コードの可読性と保守性が向上します。 サービスには意味のある一貫した名前を付けてください。 -You should also expose services that you want to use in other modules. Exposing services to other modules is possible through NestJS's powerful dependency injection system, and promotes loose coupling between components. +他のモジュールで使用したいサービスを公開する必要があります。 サービスを他のモジュールへ公開することは、NestJS の強力な依存性注入システムによって可能であり、コンポーネント間の疎結合を促進します。 -## Avoid using `any` type +## `any` 型の使用を避ける -When you declare a variable as `any`, TypeScript's type checker doesn't perform any type checking, making it possible to assign any type of values to the variable. TypeScript uses type inference to determine the type of variable based on the value. By declaring it as `any`, TypeScript can no longer infer the type. This makes it hard to catch type-related errors during development, leading to runtime errors and makes the code less maintainable, less reliable, and harder to understand for others. +変数を `any` として宣言すると、TypeScript の型チェッカーは型チェックを行わなくなり、その変数にはあらゆる型の値を割り当てられるようになります。 TypeScript は、値に基づいて変数の型を決定するために型推論を使用します。 `any` として宣言すると、TypeScript は型を推論できなくなります。 これにより、開発中に型に関連したエラーを捕捉しにくくなり、実行時エラーを引き起こし、コードのメンテナンス性、信頼性が低下し、他の人が理解しづらくなります。 -This is why everything should have a type. So if you create a new object with a first name and last name, you should create an interface or type that contains a first name and last name that defines the shape of the object you are manipulating. +これがすべてに型を持たせるべき理由です。 したがって、名と姓を持つ新しいオブジェクトを作成する場合は、操作しているオブジェクトの構造を定義する、名と姓を含むインターフェースまたは型を作成する必要があります。 diff --git a/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/custom-objects.mdx b/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/custom-objects.mdx index 7feec7a639..62e7786a36 100644 --- a/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/custom-objects.mdx +++ b/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/custom-objects.mdx @@ -1,39 +1,39 @@ --- -title: Custom Objects +title: カスタムオブジェクト --- -Objects are structures that allow you to store data (records, attributes, and values) specific to an organization. Twenty provides both standard and custom objects. +オブジェクトは、組織独自のデータ(記録、属性、値)を保存するための構造です。 Twenty provides both standard and custom objects. Twenty は標準オブジェクトとカスタムオブジェクトの両方を提供します。 -Standard objects are in-built objects with a set of attributes available for all users. Examples of standard objects in Twenty include Company and Person. Standard objects have standard fields that are also available for all Twenty users, like Company.displayName. +標準オブジェクトは、すべてのユーザーが利用可能な一連の属性を備えた組み込みのオブジェクトです。 標準オブジェクトは、すべてのユーザーが利用可能な一連の属性を備えた組み込みのオブジェクトです。 Examples of standard objects in Twenty include Company and Person. 標準オブジェクトは、すべてのユーザーが利用可能な一連の属性を備えた組み込みのオブジェクトです。 Examples of standard objects in Twenty include Company and Person. 標準オブジェクトには、Twenty のすべてのユーザーが利用できる標準フィールドがあり、例えば Company.displayName があります。 -Custom objects are objects that you can create to store information that is unique to your organization. They are not built-in; members of your workspace can create and customize custom objects to hold information that standard objects aren't suitable for. +カスタムオブジェクトは、組織に固有の情報を保存するために作成できるオブジェクトです。 カスタムオブジェクトは、組織に固有の情報を保存するために作成できるオブジェクトです。 カスタムオブジェクトは、組織に固有の情報を保存するために作成できるオブジェクトです。 組み込みではないため、ワークスペースメンバーは、標準オブジェクトに適さない情報を保持するためにカスタムオブジェクトを作成およびカスタマイズできます。 -## High-level schema +## 上位スキーマ
- High level schema + 上位スキーマ

-## How it works +## 仕組み -Custom objects come from metadata tables that determine the shape, name, and type of the objects. All this information is present in the metadata schema database, consisting of tables: +カスタムオブジェクトは、オブジェクトの形状、名前、およびタイプを決定するメタデータテーブルから来ます。 このすべての情報は、テーブルで構成されるメタデータスキーマデータベースに存在します: このすべての情報は、テーブルで構成されるメタデータスキーマデータベースに存在します: このすべての情報は、テーブルで構成されるメタデータスキーマデータベースに存在します: -* **DataSource**: Details where the data is present. -* **Object**: Describes the object and links to a DataSource. -* **Field**: Outlines an Object's fields and connects to the Object. +* **DataSource**: データの存在場所を示します。 +* **オブジェクト**: オブジェクトを説明し、DataSourceにリンクします。 +* **フィールド**: オブジェクトのフィールドを概説し、オブジェクトに接続します。 -To add a custom object, the workspaceMember will query the /metadata API. This updates the metadata accordingly and computes a GraphQL schema based on the metadata, storing it in a GQL cache for later use. +カスタムオブジェクトを追加するには、workspaceMemberが/metadata APIをクエリします。 これにより、メタデータが適切に更新され、メタデータに基づいてGraphQLスキーマが計算され、後で使用するためにGQLキャッシュに保存されます。 これにより、メタデータが適切に更新され、メタデータに基づいてGraphQLスキーマが計算され、後で使用するためにGQLキャッシュに保存されます。 これにより、メタデータが適切に更新され、メタデータに基づいてGraphQLスキーマが計算され、後で使用するためにGQLキャッシュに保存されます。
- Query the /metadata API to add custom objects + カスタムオブジェクトを追加するために/metadata APIをクエリ

-To fetch data, the process involves making queries through the /graphql endpoint and passing them through the Query Resolver. +データを取得するには、/graphqlエンドポイントを介してクエリを行い、Query Resolverを通過させるプロセスが必要です。
- Query the /graphql endpoint to fetch data + データを取得するために/graphqlエンドポイントをクエリします
diff --git a/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/feature-flags.mdx b/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/feature-flags.mdx index a261cfec3c..9cf53d125f 100644 --- a/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/feature-flags.mdx +++ b/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/feature-flags.mdx @@ -1,12 +1,12 @@ --- -title: Feature Flags +title: 機能フラグ --- -Feature flags are used to hide experimental features. For Twenty, they are set on workspace level and not on a user level. +機能フラグは試験的な機能を隠すために使用されます。 機能フラグは試験的な機能を隠すために使用されます。 Twentyでは、それらはワークスペースレベルで設定されており、ユーザーレベルではありません。 機能フラグは試験的な機能を隠すために使用されます。 Twentyでは、それらはワークスペースレベルで設定されており、ユーザーレベルではありません。 -## Adding a new feature flag +## 新しい機能フラグの追加 -In `FeatureFlagKey.ts` add the feature flag: +`FeatureFlagKey.ts`に機能フラグを追加します: ```ts type FeatureFlagKey = @@ -14,7 +14,7 @@ type FeatureFlagKey = | ...; ``` -Also add it to the enum in `feature-flag.entity.ts`: +また、`feature-flag.entity.ts`の列挙型にも追加します: ```ts enum FeatureFlagKeys { @@ -23,7 +23,7 @@ enum FeatureFlagKeys { } ``` -To apply a feature flag on a **backend** feature use: +**バックエンド**機能に機能フラグを適用するには、次を使用します: ```ts @Gate({ @@ -31,16 +31,16 @@ To apply a feature flag on a **backend** feature use: }) ``` -To apply a feature flag on a **frontend** feature use: +**フロントエンド**機能に機能フラグを適用するには、次を使用します: ```ts const isFeatureNameEnabled = useIsFeatureEnabled('IS_FEATURENAME_ENABLED'); ``` -## Configure feature flags for the deployment +## デプロイメント用の機能フラグを設定する -Change the corresponding record in the Table `core.featureFlag`: +Table `core.featureFlag` 内の対応するレコードを変更します: -| id | key | workspaceId | value | -| ------ | ------------------------ | ----------- | ------ | -| Random | `IS_FEATURENAME_ENABLED` | WorkspaceID | `true` | +| id | キー | workspaceId | 値 | +| ---- | ------------------------ | ----------- | --- | +| ランダム | `IS_FEATURENAME_ENABLED` | WorkspaceID | `真` | diff --git a/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/folder-architecture-server.mdx b/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/folder-architecture-server.mdx index 233d92ac8a..e9491e8fe1 100644 --- a/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/folder-architecture-server.mdx +++ b/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/folder-architecture-server.mdx @@ -1,9 +1,9 @@ --- -title: Folder Architecture -info: A detailed look into our server folder architecture +title: フォルダ構成 +info: 当社のサーバーフォルダ構造の詳細な観察 --- -The backend directory structure is as follows: +バックエンドのディレクトリ構造は以下の通りです: ``` server @@ -21,37 +21,37 @@ server └───utils ``` -## Ability +## 能力 -Defines permissions and includes handlers for each entity. +各エンティティの権限を定義し、ハンドラーを含みます。 -## Decorators +## デコレータ -Defines custom decorators in NestJS for added functionality. +NestJS で機能を拡張するためのカスタムデコレーターを定義します。 -See [custom decorators](https://docs.nestjs.com/custom-decorators) for more details. +詳細については、[カスタムデコレータ](https://docs.nestjs.com/custom-decorators) を参照してください。 -## Filters +## フィルター -Includes exception filters to handle exceptions that might occur in GraphQL endpoints. +GraphQLエンドポイントで発生する可能性のある例外を処理するための例外フィルターを含みます。 -## Guards +## ガード -See [guards](https://docs.nestjs.com/guards) for more details. +詳細については、[ガード](https://docs.nestjs.com/guards) を参照してください。 -## Health +## ヘルス -Includes a publicly available REST API (healthz) that returns a JSON to confirm whether the database is working as expected. +データベースが期待通りに動作しているかを確認するためのJSONを返す公開されたREST API (healthz) を含みます。 -## Metadata +## メタデータ -Defines custom objects and makes available a GraphQL API (graphql/metadata). +カスタムオブジェクトを定義し、GraphQL API (graphql/metadata) を利用可能にします。 -## Workspace +## ワークスペース -Generates and serves custom GraphQL schema based on the metadata. +メタデータに基づいてカスタムGraphQLスキーマを生成し、提供します。 -### Workspace Directory Structure +### ワークスペースディレクトリ構造 ``` workspace @@ -83,43 +83,43 @@ workspace └───workspace.factory.ts ``` -The root of the workspace directory includes the `workspace.factory.ts`, a file containing the `createGraphQLSchema` function. This function generates workspace-specific schema by using the metadata to tailor a schema for individual workspaces. By separating the schema and resolver construction, we use the `makeExecutableSchema` function, which combines these discrete elements. +ワークスペースディレクトリのルートには、`workspace.factory.ts` が含まれ、`createGraphQLSchema` 関数が含まれています。 この関数は、メタデータを使用して、個々のワークスペース用のスキーマを調整し、ワークスペース固有のスキーマを生成します。 スキーマとリゾルバーの構築を分離することで、`makeExecutableSchema` 関数を使用し、これらの個別要素を組み合わせます。 この関数は、メタデータを使用して、個々のワークスペース用のスキーマを調整し、ワークスペース固有のスキーマを生成します。 スキーマとリゾルバーの構築を分離することで、`makeExecutableSchema` 関数を使用し、これらの個別要素を組み合わせます。 この関数は、メタデータを使用して、個々のワークスペース用のスキーマを調整し、ワークスペース固有のスキーマを生成します。 スキーマとリゾルバーの構築を分離することで、`makeExecutableSchema` 関数を使用し、これらの個別要素を組み合わせます。 -This strategy is not just about organization, but also helps with optimization, such as caching generated type definitions to enhance performance and scalability. +この戦略は、組織化だけでなく、パフォーマンスやスケーラビリティを向上させるための型定義のキャッシングのような最適化にも役立ちます。 -### Workspace Schema builder +### ワークスペーススキーマビルダー -Generates the GraphQL schema, and includes: +GraphQLスキーマを生成し、含まれるもの: -#### Factories: +#### ファクトリー: -Specialised constructors to generate GraphQL-related constructs. +GraphQL関連の構造を生成するための専門的なコンストラクター。 -* The type.factory translates field metadata into GraphQL types using `TypeMapperService`. -* The type-definition.factory creates GraphQL input or output objects derived from `objectMetadata`. +* type.factoryは、フィールドメタデータを`TypeMapperService`を使用してGraphQLタイプに変換します。 +* type-definition.factoryは、`objectMetadata`から導出されるGraphQLの入力または出力オブジェクトを作成します。 -#### GraphQL Types +#### GraphQLタイプ -Includes enumerations, inputs, objects, and scalars, and serves as the building blocks for the schema construction. +列挙型、入力、オブジェクト、スカラーを含み、スキーマ構築の基礎となります。 -#### Interfaces and Object Definitions +#### インターフェースとオブジェクト定義 -Contains the blueprints for GraphQL entities, and includes both predefined and custom types like `MONEY` or `URL`. +GraphQLエンティティの設計図を含み、`MONEY`や`URL`のような定義済みおよびカスタムタイプが含まれます。 -#### Services +#### サービス -Contains the service responsible for associating FieldMetadataType with its appropriate GraphQL scalar or query modifiers. +FieldMetadataTypeに対応するGraphQLスカラーまたはクエリ修飾子を関連付けるためのサービスを含みます。 -#### Storage +#### ストレージ -Includes the `TypeDefinitionsStorage` class that contains reusable type definitions, preventing duplication of GraphQL types. +GraphQLタイプの重複を防ぐための再利用可能な型定義を含む`TypeDefinitionsStorage`クラスを含みます。 -### Workspace Resolver Builder +### ワークスペースリゾルバービルダー -Creates resolver functions for querying and mutating the GraphQL schema. +GraphQLスキーマのクエリおよび変更を行うリゾルバー関数を作成します。 -Each factory in this directory is responsible for producing a distinct resolver type, such as the `FindManyResolverFactory`, designed for adaptable application across various tables. +このディレクトリ内の各ファクトリーは、様々なテーブルに適用可能な`FindManyResolverFactory`のように、異なるリゾルバータイプを生成する役割を果たします。 -### Workspace Query Runner +### ワークスペースクエリランナー -Runs the generated queries on the database and parses the result. +データベースで生成されたクエリを実行し、その結果を解析します。 diff --git a/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/queue.mdx b/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/queue.mdx index 6148c0fbf0..44e1cb419d 100644 --- a/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/queue.mdx +++ b/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/queue.mdx @@ -1,20 +1,20 @@ --- -title: Message Queue +title: メッセージキュー --- -Queues facilitate async operations to be performed. They can be used for performing background tasks such as sending a welcome email on register. -Each use case will have its own queue class extended from `MessageQueueServiceBase`. +キューは非同期処理を実行するための手段を提供します。 それらは、登録時にウェルカムメールを送信するなどのバックグラウンドタスクを実行するために使用できます。 +各ユースケースには `MessageQueueServiceBase` から拡張された独自のキュークラスが必要です。 -Currently, we only support `bull-mq`[bull-mq](https://bullmq.io/) as the queue driver. +現在のところ、キュードライバとして `bull-mq`[bull-mq](https://bullmq.io/) のみをサポートしています。 -## Steps to create and use a new queue +## 新しいキューを作成して使用する手順 -1. Add a queue name for your new queue under enum `MESSAGE_QUEUES`. -2. Provide the factory implementation of the queue with the queue name as the dependency token. -3. Inject the queue that you created in the required module/service with the queue name as the dependency token. -4. Add worker class with token based injection just like producer. +1. enum `MESSAGE_QUEUES` に、新しいキュー用のキュー名を追加します。 +2. 依存トークンとしてキュー名を持つキューのファクトリ実装を提供します。 +3. 依存性トークンとしてキュー名を使用して、作成したキューを必要なモジュール/サービスにインジェクトします。 +4. トークンベースのインジェクションを用いたワーカークラスをプロデューサーと同様に追加します。 -### Example usage +### 使用例 ```ts class Resolver { diff --git a/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/server-commands.mdx b/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/server-commands.mdx index 6951909788..dc5fca3658 100644 --- a/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/server-commands.mdx +++ b/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/server-commands.mdx @@ -1,19 +1,24 @@ --- -title: Backend Commands +title: バックエンドコマンド --- -## Useful commands +## 便利なコマンド -These commands should be executed from packages/twenty-server folder. +これらのコマンドは packages/twenty-server フォルダから実行してください。 +これらのコマンドは packages/twenty-server フォルダから実行してください。 +これらのコマンドは packages/twenty-server フォルダから実行してください。 +これらのコマンドは packages/twenty-server フォルダから実行してください。 +これらのコマンドは packages/twenty-server フォルダから実行してください。 +これらのコマンドは packages/twenty-server フォルダから実行してください。 From any other folder you can run `npx nx {command} twenty-server` (or `npx nx run twenty-server:{command}`). -### First time setup +### 初期設定 ``` npx nx database:reset twenty-server # setup the database with dev seeds ``` -### Starting the server +### サーバーの起動 ``` npx nx run twenty-server:start @@ -25,77 +30,77 @@ npx nx run twenty-server:start npx nx run twenty-server:lint # pass --fix to fix lint errors ``` -### Test +### テスト ``` npx nx run twenty-server:test:unit # run unit tests npx nx run twenty-server:test:integration # run integration tests ``` -Note: you can run `npx nx run twenty-server:test:integration:with-db-reset` in case you need to reset the database before running the integration tests. +注: 統合テストを実行する前にデータベースをリセットする必要がある場合、 `npx nx run twenty-server:test:integration:with-db-reset` を実行できます。 -### Resetting the database +### データベースのリセット -If you want to reset and seed the database, you can run the following command: +データベースをリセットおよびシードしたい場合は、次のコマンドを実行してください: ```bash npx nx run twenty-server:database:reset ``` -### Migrations +### マイグレーション -#### For objects in Core/Metadata schemas (TypeORM) +#### Core/Metadata スキーマ (TypeORM) のオブジェクトに対して ```bash npx nx run twenty-server:typeorm migration:generate src/database/typeorm/core/migrations/nameOfYourMigration -d src/database/typeorm/core/core.datasource.ts ``` -#### For Workspace objects +#### ワークスペースオブジェクトに対して -There are no migrations files, migration are generated automatically for each workspace, -stored in the database, and applied with this command +マイグレーションファイルはなく、それぞれのワークスペースに対して自動的に生成され、 +データベースに保存され、このコマンドで適用されます。 ```bash npx nx run twenty-server:command workspace:sync-metadata -f ``` - This will drop the database and re-run the migrations and seed. + これによりデータベースが削除され、マイグレーションとシードが再実行されます。 - Make sure to back up any data you want to keep before running this command. + このコマンドを実行する前に、保持したいデータをバックアップしてください。 -## Tech Stack +## 技術スタック -Twenty primarily uses NestJS for the backend. +Twenty は主にバックエンドに NestJS を使用しています。 -Prisma was the first ORM we used. But in order to allow users to create custom fields and custom objects, a lower-level made more sense as we need to have fine-grained control. The project now uses TypeORM. +最初に使用した ORM は Prisma でした。 最初に使用した ORM は Prisma でした。 But in order to allow users to create custom fields and custom objects, a lower-level made more sense as we need to have fine-grained control. 最初に使用した ORM は Prisma でした。 But in order to allow users to create custom fields and custom objects, a lower-level made more sense as we need to have fine-grained control. 現在のプロジェクトでは TypeORM を使用しています。 -Here's what the tech stack now looks like. +現在の技術スタックは次のようになっています。 -**Core** +**コア** * [NestJS](https://nestjs.com/) * [TypeORM](https://typeorm.io/) * [GraphQL Yoga](https://the-guild.dev/graphql/yoga-server) -**Database** +**データベース** * [Postgres](https://www.postgresql.org/) -**Third-party integrations** +**サードパーティ統合** -* [Sentry](https://sentry.io/welcome/) for tracking bugs +* [Sentry](https://sentry.io/welcome/) バグトラッキング用 -**Testing** +**テスト** * [Jest](https://jestjs.io/) -**Tooling** +**ツール** * [Yarn](https://yarnpkg.com/) * [ESLint](https://eslint.org/) -**Development** +**開発** * [AWS EKS](https://aws.amazon.com/eks/) diff --git a/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/zapier.mdx b/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/zapier.mdx index 46bcd563fc..021dda05a3 100644 --- a/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/zapier.mdx +++ b/packages/twenty-docs/l/ja/developers/contribute/capabilities/backend-development/zapier.mdx @@ -1,18 +1,18 @@ --- -title: Zapier App +title: Zapierアプリ --- -Effortlessly sync Twenty with 3000+ apps using [Zapier](https://zapier.com/). Automate tasks, boost productivity, and supercharge your customer relationships! +[Zapier](https://zapier.com/) を使って、3000以上のアプリと Twenty を簡単に同期できます。 タスクを自動化し、生産性を高め、顧客関係を強化しよう! -## About Zapier +## Zapierについて -Zapier is a tool that allows you to automate workflows by connecting the apps that your team uses every day. The fundamental concept of Zapier is automation workflows, called Zaps, and include triggers and actions. +Zapierは、チームが毎日使用するアプリを連携させてワークフローを自動化するツールです。 Zapierの基本的な概念は、Zapsと呼ばれる自動化ワークフローであり、トリガーとアクションを含みます。 Zapierは、チームが毎日使用するアプリを連携させてワークフローを自動化するツールです。 Zapierの基本的な概念は、Zapsと呼ばれる自動化ワークフローであり、トリガーとアクションを含みます。 Zapierの基本的な概念は、Zapsと呼ばれる自動化ワークフローであり、トリガーとアクションを含みます。 -You can learn more about how Zapier works [here](https://zapier.com/how-it-works). +Zapierの仕組みについてもっと知りたい方は[こちら](https://zapier.com/how-it-works)をご覧ください。 -## Setup +## セットアップ -### Step 1: Install Zapier packages +### ステップ 1: Zapier パッケージをインストール ```bash cd packages/twenty-zapier @@ -20,33 +20,33 @@ cd packages/twenty-zapier yarn ``` -### Step 2: Login with the CLI +### ステップ 2: CLI でログイン -Use your Zapier credentials to log in using the CLI: +Zapierの資格情報を使用してCLIでログインしてください。 ```bash zapier login ``` -### Step 3: Set environment variables +### ステップ3:環境変数をセットアップします -From the `packages/twenty-zapier` folder, run: +`packages/twenty-zapier`フォルダーから実行します。 ```bash cp .env.example .env ``` -Run the application locally, go to [http://localhost:3000/settings/api-webhooks](http://localhost:3000/settings/api-webhooks), and generate an API key. +アプリケーションをローカルで実行し、[http://localhost:3000/settings/api-webhooks](http://localhost:3000/settings/api-webhooks)にアクセスしてAPIキーを生成してください。 -Replace the **YOUR_API_KEY** value in the `.env` file with the API key you just generated. +.envファイルの**YOUR_API_KEY**値を生成したAPIキーで置き換えてください。 -## Development +## 開発 - Make sure to run `yarn build` before any `zapier` command. + `zapier`コマンドを実行する前に`yarn build`を実行してください。 -### Test +### テスト ```bash yarn test @@ -58,25 +58,25 @@ yarn test yarn format ``` -### Watch and compile as you edit code +### コードを編集しながら監視&コンパイル ```bash yarn watch ``` -### Validate your Zapier app +### Zapierアプリを検証 ```bash yarn validate ``` -### Deploy your Zapier app +### Zapierアプリをデプロイ ```bash yarn deploy ``` -### List all Zapier CLI commands +### すべてのZapier CLIコマンドを列挙 ```bash zapier diff --git a/packages/twenty-docs/l/ja/developers/contribute/capabilities/bug-and-requests.mdx b/packages/twenty-docs/l/ja/developers/contribute/capabilities/bug-and-requests.mdx index 4db64b703d..3ba6756b1d 100644 --- a/packages/twenty-docs/l/ja/developers/contribute/capabilities/bug-and-requests.mdx +++ b/packages/twenty-docs/l/ja/developers/contribute/capabilities/bug-and-requests.mdx @@ -1,78 +1,78 @@ --- -title: Bugs, Requests & Pull Requests -info: Report issues, request features, and contribute code +title: バグ報告、要望、プルリクエスト +info: Issue を報告し、機能を要望し、コードで貢献する --- -## Reporting Bugs +## バグの報告 -To report a bug, please [create an issue on GitHub](https://github.com/twentyhq/twenty/issues/new). +バグを報告するには、[GitHubで問題を作成](https://github.com/twentyhq/twenty/issues/new)してください。 -You can also ask for help on [Discord](https://discord.gg/cx5n4Jzs57). +[Discord](https://discord.gg/cx5n4Jzs57)でヘルプを求めることもできます。 -## Feature Requests +## 機能リクエスト -If you're not sure if it's a bug, and you feel it's closer to a feature request, then you should probably [open a discussion instead](https://github.com/twentyhq/twenty/discussions/new). +バグかどうか不明で、機能リクエストに近いと感じる場合は、代わりに[ディスカッションを開く](https://github.com/twentyhq/twenty/discussions/new)べきです。 -## Submit a Pull Request +## プルリクエストを提出する -Contributing code to Twenty starts with a pull request (PR). +Twentyへのコード貢献は、プルリクエスト(PR)から始まります。 -### Before You Start +### 始める前に -1. Check [existing issues](https://github.com/twentyhq/twenty/issues) for related work -2. For new features, open an issue first to discuss -3. Review our [Code of Conduct](https://github.com/twentyhq/twenty/blob/main/CODE_OF_CONDUCT.md) +1. 関連する作業がないか[既存の Issue](https://github.com/twentyhq/twenty/issues)を確認してください +2. 新機能については、まず Issue を作成して議論してください +3. プロジェクトの[行動規範](https://github.com/twentyhq/twenty/blob/main/CODE_OF_CONDUCT.md)を確認してください -### Fork and Clone +### フォークとクローン -1. Fork the repository on GitHub -2. Clone your fork: +1. GitHubでリポジトリをフォークする +2. フォークをクローンする: ```bash git clone https://github.com/YOUR_USERNAME/twenty.git cd twenty ``` -3. Add upstream remote: +3. upstream リモートを追加する: ```bash git remote add upstream https://github.com/twentyhq/twenty.git ``` -### Create a Branch +### ブランチを作成する ```bash git checkout -b feature/your-feature-name ``` -Use descriptive branch names: +説明的なブランチ名を使用する: * `feature/add-export-button` * `fix/login-redirect-issue` * `docs/update-api-guide` -### Make Your Changes +### 変更を加える -1. Write clean, well-documented code -2. Follow existing code style -3. Add tests for new functionality -4. Update documentation if needed +1. クリーンで適切にドキュメント化されたコードを書く +2. 既存のコードスタイルに従う +3. 新しい機能にはテストを追加する +4. 必要に応じてドキュメントを更新する -### Submit Your PR +### プルリクエストを提出する -1. Push your branch: +1. ブランチをプッシュする: ```bash git push origin feature/your-feature-name ``` -2. Open a PR on GitHub -3. Fill in the PR template -4. Link related issues +2. GitHubでプルリクエストを作成する +3. PR テンプレートに記入する +4. 関連する Issue をリンクする -### PR Checklist +### PR チェックリスト -* [ ] Code follows project style guidelines -* [ ] Tests pass locally -* [ ] Documentation is updated -* [ ] PR description explains the changes +* [ ] コードがプロジェクトのスタイルガイドに準拠している +* [ ] ローカルでテストが通っている +* [ ] ドキュメントが更新されている +* [ ] PR の説明に変更内容が記載されている diff --git a/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/best-practices-front.mdx b/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/best-practices-front.mdx index 187c2d848c..08c33d8b37 100644 --- a/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/best-practices-front.mdx +++ b/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/best-practices-front.mdx @@ -1,19 +1,19 @@ --- -title: Best Practices +title: ベストプラクティス', --- -This document outlines the best practices you should follow when working on the frontend. +このドキュメントでは、フロントエンド作業におけるベストプラクティスを概要化しています。 -## State management +## 状態管理 -React and Recoil handle state management in the codebase. +React と Recoil はコードベース内の状態管理を行います。 -### Use `useRecoilState` to store state +### 状態を保存するために `useRecoilState` を使用する -It's good practice to create as many atoms as you need to store your state. +状態を保存するために必要なだけ多くのアトムを作成するのがよいです。 - It's better to use extra atoms than trying to be too concise with props drilling. + プロップドリリングを必要以上に控えるより、追加のアトムを使用する方が良いです。 ```tsx @@ -36,29 +36,29 @@ export const MyComponent = () => { } ``` -### Do not use `useRef` to store state +### 状態を保存するために `useRef` を使用しないでください -Avoid using `useRef` to store state. +状態の保存に `useRef` を使用するのは避けてください。 If you want to store state, you should use `useState` or `useRecoilState`. -See [how to manage re-renders](#managing-re-renders) if you feel like you need `useRef` to prevent some re-renders from happening. +いくつかの再レンダリングを防ぐために `useRef` が必要だと感じた場合は、[再レンダリングの管理方法](#managing-re-renders)を参照してください。 -## Managing re-renders +## 再レンダリングの管理 -Re-renders can be hard to manage in React. +React で再レンダリングを管理するのは難しいことがあります。 -Here are some rules to follow to avoid unnecessary re-renders. +不必要な再レンダリングを避けるためのいくつかのルールをご紹介します。 -Keep in mind that you can **always** avoid re-renders by understanding their cause. +再レンダリングの原因を理解することで、常に再レンダリングを避けることができることを念頭に置いてください。 -### Work at the root level +### ルートレベルで作業する -Avoiding re-renders in new features is now made easy by eliminating them at the root level. +新機能での再レンダリングをルートレベルで排除することで、簡単に避けることができるようになりました。 The `PageChangeEffect` sidecar component contains just one `useEffect` that holds all the logic to execute on a page change. -That way you know that there's just one place that can trigger a re-render. +その方法で、再レンダリングを引き起こす場所が 1 つだけあることを認識できます。 ### Always think twice before adding `useEffect` in your codebase @@ -68,17 +68,17 @@ You should think whether you need `useEffect`, or if you can move the logic in a You'll find it generally easy to move the logic in a `handleClick` or `handleChange` function. -You can also find them in libraries like Apollo: `onCompleted`, `onError`, etc. +Apollo などのライブラリで `onCompleted`、`onError` などとしても見つかることがあります。 ### Use a sibling component to extract `useEffect` or data fetching logic If you feel like you need to add a `useEffect` in your root component, you should consider extracting it in a sidecar component. -You can apply the same for data fetching logic, with Apollo hooks. +Apollo フックを使用してデータ取得ロジックにも同じことを適用できます。 ```tsx -// ❌ Bad, will cause re-renders even if data is not changing, -// because useEffect needs to be re-evaluated +// ❌ 悪い例: データが変化していなくても再レンダーを引き起こす +// useEffect を再評価する必要があるため export const PageComponent = () => { const [data, setData] = useRecoilState(dataState); const [someDependency] = useRecoilState(someDependencyState); @@ -100,8 +100,8 @@ export const App = () => ( ``` ```tsx -// ✅ Good, will not cause re-renders if data is not changing, -// because useEffect is re-evaluated in another sibling component +// ✅ 良い例: データが変化していなければ再レンダーは発生しない +// useEffect が別の兄弟コンポーネントで再評価されるため export const PageComponent = () => { const [data, setData] = useRecoilState(dataState); @@ -129,84 +129,84 @@ export const App = () => ( ); ``` -### Use recoil family states and recoil family selectors +### Recoilファミリー状態とファミリーセレクターを使用する -Recoil family states and selectors are a great way to avoid re-renders. +Recoil ファミリー状態とセレクターは、再レンダリングを回避するための優れた方法です。 -They are useful when you need to store a list of items. +アイテムのリストを保存する必要があるときに有用です。 -### You shouldn't use `React.memo(MyComponent)` +### `React.memo(MyComponent)` を使用してはいけません -Avoid using `React.memo()` because it does not solve the cause of the re-render, but instead breaks the re-render chain, which can lead to unexpected behavior and make the code very hard to refactor. +`React.memo()` の使用を避けてください。それは再レンダリングの原因を解決するのではなく、再レンダリングの連鎖を破り、予期しない動作を引き起こす可能性があり、コードのリファクタリングが非常に困難になります。 -### Limit `useCallback` or `useMemo` usage +### `useCallback` または `useMemo` の使用を制限する -They are often not necessary and will make the code harder to read and maintain for a gain of performance that is unnoticeable. +それらは通常必要ではなく、気付かない程度のパフォーマンス向上のためにコードの可読性と保守性を低下させます。 -## Console.logs +## コンソールログ -`console.log` statements are valuable during development, offering real-time insights into variable values and code flow. But, leaving them in production code can lead to several issues: +`console.log` は開発中において、変数の値やコードの流れについてリアルタイムの洞察を提供するために有効です。 しかし、これをプロダクションコードに残すと、いくつかの問題を引き起こす可能性があります。 しかし、これをプロダクションコードに残すと、いくつかの問題を引き起こす可能性があります。 -1. **Performance**: Excessive logging can affect the runtime performance, especially on client-side applications. +1. **パフォーマンス**: 過剰なログはクライアントサイドアプリケーションのランタイムパフォーマンスに影響を与える可能性があります。 -2. **Security**: Logging sensitive data can expose critical information to anyone who inspects the browser's console. +2. **セキュリティ**: センシティブなデータをログに記録すると、ブラウザのコンソールを確認するだけで重要な情報が露見する恐れがあります。 -3. **Cleanliness**: Filling up the console with logs can obscure important warnings or errors that developers or tools need to see. +3. **清潔性**: コンソールにログが溢れると、開発者やツールが見るべき重要な警告やエラーが不明瞭になる可能性があります。 -4. **Professionalism**: End users or clients checking the console and seeing a myriad of log statements might question the code's quality and polish. +4. **プロフェッショナリズム**: エンドユーザーやクライアントがコンソールを確認したときに、多くのログが表示されると、そのコードの品質や仕上がりを疑問視されることがあります。 -Make sure you remove all `console.logs` before pushing the code to production. +`console.logs` はすべて削除してからコードをプロダクションにプッシュしてください。 -## Naming +## 命名について -### Variable Naming +### 変数の命名 -Variable names ought to precisely depict the purpose or function of the variable. +変数名は、その変数の目的や機能を正確に描写する必要があります。 -#### The issue with generic names +#### 汎用的な名前の問題 -Generic names in programming are not ideal because they lack specificity, leading to ambiguity and reduced code readability. Such names fail to convey the variable or function's purpose, making it challenging for developers to understand the code's intent without deeper investigation. This can result in increased debugging time, higher susceptibility to errors, and difficulties in maintenance and collaboration. Meanwhile, descriptive naming makes the code self-explanatory and easier to navigate, enhancing code quality and developer productivity. +プログラミングにおいて汎用的な名前は理想的ではありません。なぜなら、それらは特異性に欠け、曖昧さをもたらし、コードの可読性を低下させるからです。 そのような名前は変数や関数の目的を伝えず、開発者がコードの意図を深く探らない限り理解を困難にします。 これにより、デバッグ時間が増加し、エラーの発生率が高まり、メンテナンスやコラボレーションが難しくなります。 一方で、説明的な命名はコードを自己説明的にし、ナビゲートしやすくし、コードの品質と開発者の生産性を向上させます。 ```tsx -// ❌ Bad, uses a generic name that doesn't communicate its -// purpose or content clearly +// ❌ 悪い例: 目的や内容が +// 明確に伝わらない汎用的な名前を使用している const [value, setValue] = useState(''); ``` ```tsx -// ✅ Good, uses a descriptive name +// ✅ 良い例: 説明的な名前を使用している const [email, setEmail] = useState(''); ``` -#### Some words to avoid in variable names +#### 変数名で避けるべき言葉のいくつか -* dummy +* ダミー -### Event handlers +### イベントハンドラー -Event handler names should start with `handle`, while `on` is a prefix used to name events in components props. +イベントハンドラの名前は `handle` で始めるべきであり、`on` はコンポーネントのプロップ内のイベントを命名するためのプレフィックスとして使用されます。 ```tsx -// ❌ Bad +// ❌ 悪い例 const onEmailChange = (val: string) => { // ... }; ``` ```tsx -// ✅ Good +// ✅ 良い例 const handleEmailChange = (val: string) => { // ... }; ``` -## Optional Props +## オプショナルプロップ -Avoid passing the default value for an optional prop. +オプショナルプロップにデフォルト値を渡すことは避けてください。 -**EXAMPLE** +**例** -Take the`EmailField` component defined below: +以下に定義された `EmailField` コンポーネントを取る: ```tsx type EmailFieldProps = { @@ -219,28 +219,28 @@ const EmailField = ({ value, disabled = false }: EmailFieldProps) => ( ); ``` -**Usage** +**使用方法** ```tsx -// ❌ Bad, passing in the same value as the default value adds no value +// ❌ 悪い例: デフォルト値と同じ値を渡しても意味がない const Form = () => ; ``` ```tsx -// ✅ Good, assumes the default value +// ✅ 良い例: デフォルト値に任せる const Form = () => ; ``` -## Component as props +## プロップとしてのコンポーネント -Try as much as possible to pass uninstantiated components as props, so children can decide on their own of what props they need to pass. +可能な限り、未初期化のコンポーネントをプロップとして渡してください。子コンポーネントが必要なプロップを自分で決定できるようにします。 -The most common example for that is icon components: +そのための最も一般的な例はアイコンコンポーネントです。 ```tsx const SomeParentComponent = () => ; -// In MyComponent +// MyComponent 内 const MyComponent = ({ MyIcon }: { MyIcon: IconComponent }) => { const theme = useTheme(); @@ -252,25 +252,25 @@ const MyComponent = ({ MyIcon }: { MyIcon: IconComponent }) => { }; ``` -For React to understand that the component is a component, you need to use PascalCase, to later instantiate it with `` +Reactがコンポーネントを認識するためには、PascalCaseを使用し、その後に``でインスタンス化する必要があります。 -## Prop Drilling: Keep It Minimal +## プロップのドリリングを最小限に抑える -Prop drilling, in the React context, refers to the practice of passing state variables and their setters through many component layers, even if intermediary components don't use them. While sometimes necessary, excessive prop drilling can lead to: +Reactのコンテキストでのプロップドリリングとは、多くのコンポーネントレイヤーを通じて状態変数やそのセットを渡すことを意味します。中間のコンポーネントがそれを使用していない場合であってもです。 時には必要ですが、過度のプロップドリリングは次の結果を導きかねません。 時には必要ですが、過度のプロップドリリングは次の結果を導きかねません。 時には必要ですが、過度のプロップドリリングは次の結果を導きかねません。 -1. **Decreased Readability**: Tracing where a prop originates or where it's utilized can become convoluted in a deeply nested component structure. +1. **可読性の低下**:プロップがどこから始まり、どこで使われているかを追跡するのが、深くネストされたコンポーネント構造では複雑になり得ます。 -2. **Maintenance Challenges**: Changes in one component's prop structure might require adjustments in several components, even if they don't directly use the prop. +2. **メンテナンスの難しさ**:あるコンポーネントのプロップ構造に変更があると、他のコンポーネントに変更が必要になる場合があります。それが直接プロップを使用していなくても。 -3. **Reduced Component Reusability**: A component receiving a lot of props solely for passing them down becomes less general-purpose and harder to reuse in different contexts. +3. **コンポーネントの再利用性の低下**:多くのプロップを単に下位に渡すコンポーネントは、汎用性が低くなり、異なるコンテキストでの再利用が難しくなります。 -If you feel that you are using excessive prop drilling, see [state management best practices](#state-management). +もし過度のプロップドリリングをしていると感じた場合は、[状態管理のベストプラクティス](#state-management)を参照してください。 -## Imports +## インポート -When importing, opt for the designated aliases rather than specifying complete or relative paths. +インポート時は、完全なパスや相対パスを指定するのではなく、指定されたエイリアスを選択してください。 -**The Aliases** +**ハンドルの別名** ```js { @@ -282,10 +282,10 @@ When importing, opt for the designated aliases rather than specifying complete o } ``` -**Usage** +**使用方法** ```tsx -// ❌ Bad, specifies the entire relative path +// ❌ 悪い例: 相対パス全体を指定している import { CatalogDecorator } from '../../../../../testing/decorators/CatalogDecorator'; @@ -295,14 +295,14 @@ import { ``` ```tsx -// ✅ Good, utilises the designated aliases +// ✅ 良い例: 指定したエイリアスを利用している import { CatalogDecorator } from '~/testing/decorators/CatalogDecorator'; import { ComponentDecorator } from 'twenty-ui/testing'; ``` -## Schema Validation +## スキーマ検証 -[Zod](https://github.com/colinhacks/zod) is the schema validator for untyped objects: +[Zod](https://github.com/colinhacks/zod)は型未定義オブジェクトのスキーマバリデーターです。 ```js const validationSchema = z @@ -310,16 +310,16 @@ const validationSchema = z exist: z.boolean(), email: z .string() - .email('Email must be a valid email'), + .email('メールアドレスは有効な形式である必要があります'), password: z .string() - .regex(PASSWORD_REGEX, 'Password must contain at least 8 characters'), + .regex(PASSWORD_REGEX, 'パスワードは8文字以上である必要があります'), }) .required(); type Form = z.infer; ``` -## Breaking Changes +## 重大な変更 -Always perform thorough manual testing before proceeding to guarantee that modifications haven’t caused disruptions elsewhere, given that tests have not yet been extensively integrated. +変更が他の部分に影響を及ぼしていないことを確実にするために、進む前に徹底的な手動テストを行ってください。テストがまだ広範囲に統合されていないためです。 diff --git a/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/folder-architecture-front.mdx b/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/folder-architecture-front.mdx index 064ac5c256..14278b16aa 100644 --- a/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/folder-architecture-front.mdx +++ b/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/folder-architecture-front.mdx @@ -1,11 +1,11 @@ --- -title: Folder Architecture -info: A detailed look into our folder architecture +title: フォルダ構成 +info: 当社のフォルダ構造の詳細な解説 --- -In this guide, you will explore the details of the project directory structure and how it contributes to the organization and maintainability of Twenty. +このガイドでは、プロジェクトのディレクトリ構成の詳細と、それが Twenty の整理と保守性にどのように寄与するかを解説します。 -By following this folder architecture convention, it's easier to find the files related to specific features and ensure that the application is scalable and maintainable. +このフォルダ構成の規約に従うことで、特定の機能に関連するファイルを見つけやすくなり、アプリケーションのスケーラビリティと保守性を確保できます。 ``` front @@ -22,14 +22,14 @@ front └───... ``` -## Pages +## ページ -Includes the top-level components defined by the application routes. They import more low-level components from the modules folder (more details below). +アプリケーションのルートで定義されたトップレベルのコンポーネントを含みます。 それらは、modules フォルダからより低レベルのコンポーネントをインポートします(詳細は下記を参照)。 -## Modules +## モジュール -Each module represents a feature or a group of feature, comprising its specific components, states, and operational logic. -They should all follow the structure below. You can nest modules within modules (referred to as submodules) and the same rules will apply. +各モジュールは、単一の機能または機能のグループを表し、それぞれ固有のコンポーネント、状態、動作ロジックで構成されています。 +以下の構造に従う必要があります。 モジュール内にモジュール(サブモジュール)をネストでき、同じルールが適用されます。 ``` module1 @@ -50,60 +50,60 @@ module1 └───utils ``` -### Contexts +### コンテキスト -A context is a way to pass data through the component tree without having to pass props down manually at every level. +コンテキストは、各レベルでプロップスを手動で渡すことなく、コンポーネントツリーを通じてデータを渡す方法です。 -See [React Context](https://react.dev/reference/react#context-hooks) for more details. +詳細は[Reactコンテキスト](https://react.dev/reference/react#context-hooks)を参照してください。 ### GraphQL -Includes fragments, queries, and mutations. +フラグメント、クエリ、ミューテーションを含みます。 -See [GraphQL](https://graphql.org/learn/) for more details. +詳細は[GraphQL](https://graphql.org/learn/)を参照してください。 -* Fragments +* フラグメント -A fragment is a reusable piece of a query, which you can use in different places. By using fragments, it's easier to avoid duplicating code. +フラグメントはクエリの再利用可能な一部分で、さまざまな箇所で使用できます。 フラグメントを使用することで、コードを重複させることを避けやすくなります。 -See [GraphQL Fragments](https://graphql.org/learn/queries/#fragments) for more details. +詳細は[GraphQLフラグメント](https://graphql.org/learn/queries/#fragments)を参照してください。 -* Queries +* クエリ -See [GraphQL Queries](https://graphql.org/learn/queries/) for more details. +詳細は[GraphQLクエリ](https://graphql.org/learn/queries/)を参照してください。 -* Mutations +* ミューテーション -See [GraphQL Mutations](https://graphql.org/learn/queries/#mutations) for more details. +詳細は[GraphQLミューテーション](https://graphql.org/learn/queries/#mutations)を参照してください。 -### Hooks +### フック -See [Hooks](https://react.dev/learn/reusing-logic-with-custom-hooks) for more details. +詳細は[フック](https://react.dev/learn/reusing-logic-with-custom-hooks)を参照してください。 -### States +### ステート -Contains the state management logic. [RecoilJS](https://recoiljs.org) handles this. +ステート管理のロジックを含みます。 [RecoilJS](https://recoiljs.org) がこれを管理します。 -* Selectors: See [RecoilJS Selectors](https://recoiljs.org/docs/basic-tutorial/selectors) for more details. +* セレクター: 詳細は[RecoilJSセレクター](https://recoiljs.org/docs/basic-tutorial/selectors)を参照してください。 -React's built-in state management still handles state within a component. +Reactの組み込みステート管理は依然としてコンポーネント内のステートを処理します。 -### Utils +### ユーティリティ -Should just contain reusable pure functions. Otherwise, create custom hooks in the `hooks` folder. +再利用可能な純粋関数のみを含むべきです。 それ以外の場合は、`hooks`フォルダにカスタムフックを作成します。 ## UI -Contains all the reusable UI components used in the application. +アプリケーションで使用される再利用可能なUIコンポーネントをすべて含みます。 -This folder can contain sub-folders, like `data`, `display`, `feedback`, and `input` for specific types of components. Each component should be self-contained and reusable, so that you can use it in different parts of the application. +このフォルダには、特定の種類のコンポーネント用に `data`、`display`、`feedback`、`input` といったサブフォルダを含めることができます。 各コンポーネントは自己完結型で再利用可能でなければならず、アプリケーションのさまざまな部分で使用できます。 -By separating the UI components from the other components in the `modules` folder, it's easier to maintain a consistent design and to make changes to the UI without affecting other parts (business logic) of the codebase. +UIコンポーネントを`modules`フォルダ内の他のコンポーネントから分離することで、一貫したデザインを維持し、UIの変更がコードベースの他の部分(ビジネスロジック)に影響を与えないようにするのが容易になります。 -## Interface and dependencies +## インターフェースと依存関係 -You can import other module code from any module except for the `ui` folder. This will keep its code easy to test. +`ui` フォルダを除く任意のモジュールから、他のモジュールのコードをインポートできます。 これにより、そのコードは簡単にテストできます。 -### Internal +### 内部 -Each part (hooks, states, ...) of a module can have an `internal` folder, which contains parts that are just used within the module. +各部分(フック、ステート、...) は、モジュール内でのみ使用される部分を含む `internal` フォルダを持つことができます。 diff --git a/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/frontend-commands.mdx b/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/frontend-commands.mdx index 48051bddd2..21b5138517 100644 --- a/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/frontend-commands.mdx +++ b/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/frontend-commands.mdx @@ -1,41 +1,41 @@ --- -title: Frontend Commands +title: フロントエンドコマンド --- -## Useful commands +## 便利なコマンド -### Starting the app +### アプリの開始 ```bash npx nx start twenty-front ``` -### Regenerate graphql schema based on API graphql schema +### APIのGraphQLスキーマに基づいてGraphQLスキーマを再生成する ```bash npx nx run twenty-front:graphql:generate --configuration=metadata ``` -OR +または ```bash npx nx run twenty-front:graphql:generate ``` -### Lint +### リント ```bash npx nx run twenty-front:lint # pass --fix to fix lint errors ``` -## Translations +## 翻訳 ```bash npx nx run twenty-front:lingui:extract npx nx run twenty-front:lingui:compile ``` -### Test +### テスト ```bash npx nx run twenty-front:test # run jest tests @@ -44,11 +44,11 @@ npx nx run twenty-front:storybook:test # run tests # (needs yarn storybook:serve npx nx run twenty-front:storybook:coverage # (needs yarn storybook:serve:dev to be running) ``` -## Tech Stack +## 技術スタック -The project has a clean and simple stack, with minimal boilerplate code. +プロジェクトは、最小限のボイラープレートコードを持つシンプルでクリーンなスタックを持っています。 -**App** +**アプリ** * [React](https://react.dev/) * [Apollo](https://www.apollographql.com/docs/) @@ -56,35 +56,35 @@ The project has a clean and simple stack, with minimal boilerplate code. * [Recoil](https://recoiljs.org/docs/introduction/core-concepts) * [TypeScript](https://www.typescriptlang.org/) -**Testing** +**テスト** * [Jest](https://jestjs.io/) * [Storybook](https://storybook.js.org/) -**Tooling** +**ツール** * [Yarn](https://yarnpkg.com/) * [Craco](https://craco.js.org/docs/) * [ESLint](https://eslint.org/) -## Architecture +## アーキテクチャ -### Routing +### ルーティング -[React Router](https://reactrouter.com/) handles the routing. +[React Router](https://reactrouter.com/)はルーティングを処理します。 To avoid unnecessary [re-renders](/l/ja/developers/contribute/capabilities/frontend-development/best-practices-front#managing-re-renders) all the routing logic is in a `useEffect` in `PageChangeEffect`. -### State Management +### 状態管理 -[Recoil](https://recoiljs.org/docs/introduction/core-concepts) handles state management. +[Recoil](https://recoiljs.org/docs/introduction/core-concepts)は状態管理を処理します。 -See [best practices](/l/ja/developers/contribute/capabilities/frontend-development/best-practices-front#state-management) for more information on state management. +状態管理に関する詳細な情報は[ベストプラクティス](/l/ja/developers/contribute/capabilities/frontend-development/best-practices-front#state-management)を参照してください。 -## Testing +## テスト -[Jest](https://jestjs.io/) serves as the tool for unit testing while [Storybook](https://storybook.js.org/) is for component testing. +[Jest](https://jestjs.io/)はユニットテストのツールであり、[Storybook](https://storybook.js.org/)はコンポーネントテスト用です。 -Jest is mainly for testing utility functions, and not components themselves. +Jestは主にユーティリティ関数のテスト用で、コンポーネントのテスト自体ではありません。 -Storybook is for testing the behavior of isolated components, as well as displaying the design system. +Storybookは、独立したコンポーネントの挙動をテストし、デザインシステムを表示するためのものです。 diff --git a/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/hotkeys.mdx b/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/hotkeys.mdx index 43cde50e63..99fb134511 100644 --- a/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/hotkeys.mdx +++ b/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/hotkeys.mdx @@ -1,42 +1,42 @@ --- -title: Hotkeys +title: ホットキー --- -## Introduction +## イントロダクション -When you need to listen to a hotkey, you would normally use the `onKeyDown` event listener. +ホットキーをリッスンする必要がある場合、通常は `onKeyDown` イベントリスナーを使用します。 -In `twenty-front` however, you might have conflicts between same hotkeys that are used in different components, mounted at the same time. +しかし、`twenty-front` では、同時にマウントされている異なるコンポーネントで使用される同じホットキーの間で競合が生じることがあります。 -For example, if you have a page that listens for the Enter key, and a modal that listens for the Enter key, with a Select component inside that modal that listens for the Enter key, you might have a conflict when all are mounted at the same time. +例えば、Enterキーをリッスンするページと、Enterキーをリッスンするモーダル、さらにそのモーダル内のSelectコンポーネントもEnterキーをリッスンしている場合、全てが同時にマウントされると競合が生じる可能性があります。 -## The `useScopedHotkeys` hook +## `useScopedHotkeys` フック -To handle this problem, we have a custom hook that makes it possible to listen to hotkeys without any conflict. +この問題を解決するために、どのような競合もなくホットキーをリッスンすることを可能にするカスタムフックがあります。 -You place it in a component, and it will listen to the hotkeys only when the component is mounted AND when the specified **hotkey scope** is active. +コンポーネント内に配置すると、コンポーネントがマウントされ、指定された**ホットキースコープ**がアクティブなときだけホットキーをリッスンします。 -## How to listen for hotkeys in practice? +## 実際にホットキーをリッスンする方法は? -There are two steps involved in setting up hotkey listening : +ホットキーをリッスンするための設定には2つのステップがあります: -1. Set the [hotkey scope](#what-is-a-hotkey-scope-) that will listen to hotkeys -2. Use the `useScopedHotkeys` hook to listen to hotkeys +1. ホットキーをリッスンする[ホットキースコープ](#what-is-a-hotkey-scope-)を設定します +2. ホットキーをリッスンするために `useScopedHotkeys` フックを使用します -Setting up hotkey scopes is required even in simple pages, because other UI elements like left menu or command menu might also listen to hotkeys. +他のUI要素(例:左側のメニューやコマンドメニュー)もホットキーをリッスンする可能性があるため、ホットキースコープの設定は単純なページでも必要です。 -## Use cases for hotkeys +## ホットキーのユースケース -In general, you'll have two use cases that require hotkeys : +一般的に、ホットキーが必要となる動作は2つあります: -1. In a page or a component mounted in a page -2. In a modal-type component that takes the focus due to a user action +1. ページにマウントされたコンポーネントで +2. ユーザーのアクションでフォーカスをとるモーダルタイプのコンポーネントで -The second use case can happen recursively : a dropdown in a modal for example. +2番目のユースケースは再帰的に発生します:例えばモーダル内のドロップダウン。 -### Listening to hotkeys in a page +### ページ内でホットキーをリッスン -Example : +例: ```tsx const PageListeningEnter = () => { @@ -71,11 +71,11 @@ const PageListeningEnter = () => { }; ``` -### Listening to hotkeys in a modal-type component +### モーダルタイプのコンポーネントでホットキーをリッスン -For this example we'll use a modal component that listens for the Escape key to tell its parent to close it. +この例では、親にモーダルを閉じるように指示するためにEscapeキーをリッスンするモーダルコンポーネントを使用します。 -Here the user interaction is changing the scope. +ここで、ユーザーの操作がスコープを変更します。 ```tsx const ExamplePageWithModal = () => { @@ -108,7 +108,7 @@ const ExamplePageWithModal = () => { }; ``` -Then in the modal component : +その後、モーダルコンポーネント内で: ```tsx const MyDropdownComponent = ({ onClose }: { onClose: () => void }) => { @@ -131,15 +131,15 @@ It's important to use this pattern when you're not sure that just using a useEff Those conflicts can be hard to debug, and it might happen more often than not with useEffects. -## What is a hotkey scope? +## ホットキースコープとは? -A hotkey scope is a string that represents a context in which the hotkeys are active. It is generally encoded as an enum. +ホットキースコープは、ホットキーがアクティブなコンテキストを表す文字列です。 通常、enumとしてエンコードされます。 通常、enumとしてエンコードされます。 通常、enumとしてエンコードされます。 -When you change the hotkey scope, the hotkeys that are listening to this scope will be enabled and the hotkeys that are listening to other scopes will be disabled. +ホットキースコープを変更すると、このスコープをリッスンしているホットキーが有効になり、他のスコープをリッスンしているホットキーが無効になります。 -You can set only one scope at a time. +一度に1つのスコープしか設定できません。 -As an example, the hotkey scopes for each page are defined in the `PageHotkeyScope` enum: +例として、各ページのホットキースコープは`PageHotkeyScope` enumで定義されています: ```tsx export enum PageHotkeyScope { @@ -160,7 +160,7 @@ export enum PageHotkeyScope { } ``` -Internally, the currently selected scope is stored in a Recoil state that is shared across the application : +内部的には、現在選択されているスコープはアプリケーション全体で共有されるRecoilステートに格納されています: ```tsx export const currentHotkeyScopeState = createState({ @@ -169,10 +169,10 @@ export const currentHotkeyScopeState = createState({ }); ``` -But this Recoil state should never be handled manually ! We'll see how to use it in the next section. +しかし、このRecoilステートは手動で処理しないでください! 次のセクションでその使用方法を見ていきます。 次のセクションでその使用方法を見ていきます。 次のセクションでその使用方法を見ていきます。 -## How is it working internally? +## 内部的にはどう機能しているのか? -We made a thin wrapper on top of [react-hotkeys-hook](https://react-hotkeys-hook.vercel.app/docs/intro) that makes it more performant and avoids unnecessary re-renders. +[react-hotkeys-hook](https://react-hotkeys-hook.vercel.app/docs/intro)の上に薄いラッパーを作成し、より効率的にし、不必要な再レンダリングを避けます。 -We also create a Recoil state to handle the hotkey scope state and make it available everywhere in the application. +また、ホットキースコープの状態を処理し、アプリケーション全体で利用できるRecoilステートを作成しました。 diff --git a/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/storybook.mdx b/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/storybook.mdx index 5c7f5fa52a..baff4a6c9a 100644 --- a/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/storybook.mdx +++ b/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/storybook.mdx @@ -1,8 +1,8 @@ --- -title: Storybook -description: Browse Twenty's UI component library +title: ストーリーブック +description: TwentyのUIコンポーネントライブラリを閲覧 --- -View our complete component library and documentation in Storybook. +ストーリーブックで私たちの完全なコンポーネントライブラリおよびドキュメントを参照してください。 -[Open Storybook →](https://storybook.twenty.com) +[ストーリーブックを開く →](https://storybook.twenty.com) diff --git a/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/style-guide.mdx b/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/style-guide.mdx index e3ba4a44f0..39daabcda2 100644 --- a/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/style-guide.mdx +++ b/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/style-guide.mdx @@ -1,24 +1,24 @@ --- -title: Style Guide +title: スタイルガイド --- -This document includes the rules to follow when writing code. +このドキュメントには、コードを書く際に従うべきルールが含まれています。 -The goal here is to have a consistent codebase, which is easy to read and easy to maintain. +ここでの目標は、一貫性があり、読みやすく、メンテナンスしやすいコードベースにすることです。 -For this, it's better to be a bit more verbose than to be too concise. +そのためには、簡潔すぎるよりも少し冗長な方が良いです。 -Always keep in mind that people read code more often than they write it, specially on an open source project, where anyone can contribute. +常に念頭に置いておくべきは、コードは書くより読む方が多いということ、特にオープンソースプロジェクトでは、誰でも貢献できるためです。 -There are a lot of rules that are not defined here, but that are automatically checked by linters. +ここでは定義されていない、多くの規則がありますが、リンターにより自動的にチェックされます。 ## React -### Use functional components +### 関数コンポーネントを使用する -Always use TSX functional components. +常にTSXの関数コンポーネントを使用してください。 -Do not use default `import` with `const`, because it's harder to read and harder to import with code completion. +`const`を使ったデフォルトの`import`は避けてください。読むことや、コード補完でのインポートが難しくなるからです。 ```tsx // ❌ Bad, harder to read, harder to import with code completion @@ -34,11 +34,11 @@ export function MyComponent() { }; ``` -### Props +### プロパティ -Create the type of the props and call it `(ComponentName)Props` if there's no need to export it. +プロップスの型を作成し、エクスポートの必要がない場合にはそれを`(ComponentName)Props`と呼んでください。 -Use props destructuring. +プロップスの分割代入を使用する。 ```tsx // ❌ Bad, no type @@ -52,7 +52,7 @@ type MyComponentProps = { export const MyComponent = ({ name }: MyComponentProps) =>
Hello {name}
; ``` -#### Refrain from using `React.FC` or `React.FunctionComponent` to define prop types +#### プロップス型の定義に`React.FC`または`React.FunctionComponent`を使用しない ```tsx /* ❌ - Bad, defines the component type annotations with `FC` @@ -67,10 +67,10 @@ const EmailField: React.FC<{ ``` ```tsx -/* ✅ - Good, a separate type (OwnProps) is explicitly defined for the - * component's props - * - This method doesn't automatically include the children prop. If - * you want to include it, you have to specify it in OwnProps. +/* ✅ - 良い例: プロップス用に別個のタイプ(OwnProps)を明示的に + * 定義する + * - この方法は、デフォルトでchildrenプロップを含まないため、 + * 必要な場合にOwnPropsに指定する必要があります。 */ type EmailFieldProps = { value: string; @@ -81,9 +81,9 @@ const EmailField = ({ value }: EmailFieldProps) => ( ); ``` -#### No Single Variable Prop Spreading in JSX Elements +#### JSX要素内で単一の変数プロップスプレーディングを使用しない -Avoid using single variable prop spreading in JSX elements, like `{...props}`. This practice often results in code that is less readable and harder to maintain because it's unclear which props the component is receiving. +`{...props}`のようにJSX要素内で単一の変数プロップスプレーディングを避けてください。 この方法は、コンポーネントが受け取るプロップスを不明確にするため、コードの可読性が低下し、メンテナンスが困難になります。 この方法は、コンポーネントが受け取るプロップスを不明確にするため、コードの可読性が低下し、メンテナンスが困難になります。 この方法は、コンポーネントが受け取るプロップスを不明確にするため、コードの可読性が低下し、メンテナンスが困難になります。 ```tsx /* ❌ - Bad, spreads a single variable prop into the underlying component @@ -94,23 +94,23 @@ const MyComponent = (props: OwnProps) => { ``` ```tsx -/* ✅ - Good, Explicitly lists all props - * - Enhances readability and maintainability +/* ✅ - 良い例: すべてのプロップスを明示的にリストする + * - 可読性と維持性を高める */ const MyComponent = ({ prop1, prop2, prop3 }: MyComponentProps) => { return ; }; ``` -Rationale: +根拠: -* At a glance, it's clearer which props the code passes down, making it easier to understand and maintain. -* It helps to prevent tight coupling between components via their props. -* Linting tools make it easier to identify misspelled or unused props when you list props explicitly. +* ひと目で、コードがどのプロップスを渡しているかが明確になり、理解とメンテナンスが容易になります。 +* これにより、コンポーネント間のプロップスによる密結合を防ぐのに役立ちます。 +* プロップスを明示的にリストすれば、lintingツールが綴り間違いや未使用のプロップスを特定しやすくなります。 ## JavaScript -### Use nullish-coalescing operator `??` +### `??`(ヌリッシュ合体演算子)を使う ```tsx // ❌ Bad, can return 'default' even if value is 0 or '' @@ -120,21 +120,21 @@ const value = process.env.MY_VALUE || 'default'; const value = process.env.MY_VALUE ?? 'default'; ``` -### Use optional chaining `?.` +### `?.`(オプショナルチェイニング)を使う ```tsx -// ❌ Bad +// ❌ 悪い例 onClick && onClick(); -// ✅ Good +// ✅ 良い例 onClick?.(); ``` ## TypeScript -### Use `type` instead of `interface` +### `type`を使い、常に`interface`の代わりにする -Always use `type` instead of `interface`, because they almost always overlap, and `type` is more flexible. +`type`は多くの場合、`interface`と重複し、`type`の方が柔軟性が高いため、常に`type`を使用してください。 ```tsx // ❌ Bad @@ -148,11 +148,11 @@ type MyType = { }; ``` -### Use string literals instead of enums +### 列挙型の代わりに文字列リテラルを使う -[String literals](https://www.typescriptlang.org/docs/handbook/2/everyday-types.html#literal-types) are the go-to way to handle enum-like values in TypeScript. They are easier to extend with Pick and Omit, and offer a better developer experience, specially with code completion. +[文字列リテラル](https://www.typescriptlang.org/docs/handbook/2/everyday-types.html#literal-types) は、TypeScriptで列挙型のような値を扱うための推奨方法です。 それらはPickやOmitで拡張するのが簡単で、特にコード補完を伴う開発者の体験を向上させます。 それらはPickやOmitで拡張するのが簡単で、特にコード補完を伴う開発者の体験を向上させます。 それらはPickやOmitで拡張するのが簡単で、特にコード補完を伴う開発者の体験を向上させます。 -You can see why TypeScript recommends avoiding enums [here](https://www.typescriptlang.org/docs/handbook/2/everyday-types.html#enums). +なぜTypeScriptが列挙型を避けることを推奨しているかは[ここ](https://www.typescriptlang.org/docs/handbook/2/everyday-types.html#enums)をご覧ください。 ```tsx // ❌ Bad, utilizes an enum @@ -171,13 +171,13 @@ let color = Color.Red; let color: "red" | "green" | "blue" = "red"; ``` -#### GraphQL and internal libraries +#### GraphQLと内部ライブラリ -You should use enums that GraphQL codegen generates. +GraphQLのcodegenが生成する列挙型を使用する必要があります。 -It's also better to use an enum when using an internal library, so the internal library doesn't have to expose a string literal type that is not related to the internal API. +内部ライブラリを使用する際にも列挙型を使用する方が良いので、内部ライブラリが内部APIに関連しない文字列リテラル型を公開する必要がなくなります。 -Example: +例: ```TSX const { @@ -190,11 +190,11 @@ setHotkeyScopeAndMemorizePreviousScope( ); ``` -## Styling +## スタイリング -### Use StyledComponents +### StyledComponentsを使用する -Style the components with [styled-components](https://emotion.sh/docs/styled). +コンポーネントを[styled-components](https://emotion.sh/docs/styled)でスタイル設定する。 ```tsx // ❌ Bad @@ -208,7 +208,7 @@ const StyledTitle = styled.div` `; ``` -Prefix styled components with "Styled" to differentiate them from "real" components. +スタイル付きコンポーネントを"Styled"で接頭辞にして、"本物の"コンポーネントと区別する。 ```tsx // ❌ Bad @@ -224,17 +224,17 @@ const StyledTitle = styled.div` `; ``` -### Theming +### テーマ -Utilizing the theme for the majority of component styling is the preferred approach. +大部分のコンポーネントのスタイルをテーマに基づかせるのが推奨される手法です。 -#### Units of measurement +#### 測定の単位 -Avoid using `px` or `rem` values directly within the styled components. The necessary values are generally already defined in the theme, so it’s recommended to make use of the theme for these purposes. +Styledコンポーネント内で`px`または`rem`値を直接使用しない 必要な値は一般的にテーマに既に定義されているため、これらの目的でテーマを利用することが推奨されます。 必要な値は一般的にテーマに既に定義されているため、これらの目的でテーマを利用することが推奨されます。 必要な値は一般的にテーマに既に定義されているため、これらの目的でテーマを利用することが推奨されます。 -#### Colors +#### カラー -Refrain from introducing new colors; instead, use the existing palette from the theme. Should there be a situation where the palette does not align, please leave a comment so that the team can rectify it. +新しい色を追加するのではなく、テーマから既存のパレットを使用してください。 パレットが適合しない場合には、コメントを残してチームがそれを修正できるようにしてください。 パレットが適合しない場合には、コメントを残してチームがそれを修正できるようにしてください。 パレットが適合しない場合には、コメントを残してチームがそれを修正できるようにしてください。 ```tsx // ❌ Bad, directly specifies style values without utilizing the theme @@ -258,9 +258,9 @@ const StyledButton = styled.button` `; ``` -## Enforcing No-Type Imports +## タイプ無しのインポートの強制 -Avoid type imports. To enforce this standard, an ESLint rule checks for and reports any type imports. This helps maintain consistency and readability in the TypeScript code. +タイプインポートを避けてください。 タイプインポートを避けてください。 この標準を強制するために、ESLintルールがどのタイプのインポートもチェックして報告します。 これにより、TypeScriptコードの一貫性と可読性が維持されます。 これにより、TypeScriptコードの一貫性と可読性が維持されます。 ```tsx // ❌ Bad @@ -273,18 +273,18 @@ import type { Meta, StoryObj } from '@storybook/react'; import { Meta, StoryObj } from '@storybook/react'; ``` -### Why No-Type Imports +### なぜタイプなしインポートなのか -* **Consistency**: By avoiding type imports and using a single approach for both type and value imports, the codebase remains consistent in its module import style. +* **一貫性**: 型インポートを避け、型と値の両方に単一のアプローチを使用することで、モジュールインポートスタイルの一貫性が保たれます。 -* **Readability**: No-type imports improve code readability by making it clear when you're importing values or types. This reduces ambiguity and makes it easier to understand the purpose of imported symbols. +* **可読性**: 型専用インポートは、値をインポートしているのか型をインポートしているのかを明確にすることで、コードの可読性を高めます。 これにより曖昧さが減り、インポートされたシンボルの目的を理解しやすくなります。 -* **Maintainability**: It enhances codebase maintainability because developers can identify and locate type-only imports when reviewing or modifying code. +* **維持性**: コードベースの維持性を向上させます。開発者がコードを確認/変更する際に、タイプのみのインポートを特定して見つけることができるからです。 -### ESLint Rule +### ESLintルール -An ESLint rule, `@typescript-eslint/consistent-type-imports`, enforces the no-type import standard. This rule will generate errors or warnings for any type import violations. +ESLint のルール `@typescript-eslint/consistent-type-imports` は、型専用インポートの標準を強制します。 このルールは、タイプインポート違反のエラーや警告を生成します。 -Please note that this rule specifically addresses rare edge cases where unintentional type imports occur. TypeScript itself discourages this practice, as mentioned in the [TypeScript 3.8 release notes](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-8.html). In most situations, you should not need to use type-only imports. +このルールは、意図せず型をインポートしてしまう稀なエッジケースに特化して対処することに留意してください。 TypeScript自体、[TypeScript 3.8 リリースノート](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-8.html)でこのプラクティスを避けています。 ほとんどの状況で、タイプのみのインポートを使用する必要はありません。 ほとんどの状況で、タイプのみのインポートを使用する必要はありません。 ほとんどの状況で、タイプのみのインポートを使用する必要はありません。 -To ensure your code complies with this rule, make sure to run ESLint as part of your development workflow. +コードがこのルールに準拠していることを確実にするため、開発ワークフローの一環として ESLint を実行してください。 diff --git a/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/work-with-figma.mdx b/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/work-with-figma.mdx index 6cffcc405e..a91dc197c4 100644 --- a/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/work-with-figma.mdx +++ b/packages/twenty-docs/l/ja/developers/contribute/capabilities/frontend-development/work-with-figma.mdx @@ -1,59 +1,136 @@ --- -title: Work with Figma -info: Learn how you can collaborate with Twenty's Figma +title: Figma で作業する +info: Twenty の Figma を使用した共同作業方法を学ぶ --- -Figma is a collaborative interface design tool that aids in bridging the communication barrier between designers and developers. -This guide explains how you can collaborate with Figma. +Figma は、デザイナーと開発者の間のコミュニケーションの壁を埋めるのを助ける協働インターフェース設計ツールです。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 +このガイドは、Figma を使って共同作業する方法を説明します。 -## Access +## アクセス -1. **Access the shared link:** You can access the project's Figma file [here](https://www.figma.com/file/xt8O9mFeLl46C5InWwoMrN/Twenty). -2. **Sign in:** If you're not already signed in, Figma will prompt you to do so. - Key features are only available to logged-in users, such as the developer mode and the ability to select a dedicated frame. +1. **共有リンクにアクセスする:** プロジェクトの Figma ファイルは [ここ](https://www.figma.com/file/xt8O9mFeLl46C5InWwoMrN/Twenty) からアクセスできます。 +2. **サインイン:** まだサインインしていない場合、Figma はサインインを促します。 + 開発者モードや専用のフレーム選択など、キー機能はサインインしたユーザーのみが利用できます。 - You will not be able to collaborate effectively without an account. + アカウントがないと効果的に協力することはできません。 -## Figma structure +## Figma 構造 -On the left sidebar, you can access the different pages of Twenty's Figma. This is how they're organized: +左側のサイドバーで、Twenty の Figma の異なるページにアクセスできます。 それらは次のように整理されています: それらは次のように整理されています: それらは次のように整理されています: それらは次のように整理されています: それらは次のように整理されています: -* **Components page:** This is the first page. The designer uses it to create and organize the reusable design elements used throughout the design file. For example, buttons, icons, symbols, or any other reusable components. It serves to maintain consistency across the design. -* **Main page:** The second page is the main page, which shows the complete user interface of the project. You can press ***Play*** to use the full app prototype. -* **Features pages:** The other pages are typically dedicated to features in progress. They contain the design of specific features or modules of the application or website. They are typically still in progress. +* **コンポーネントページ:** これは最初のページです。 デザイナーはこれを使用して、デザインファイル全体で使用される再利用可能なデザイン要素を作成および整理します。 例えば、ボタン、アイコン、シンボル、またはその他の再利用可能なコンポーネントとして使用されます。 これにより、デザイン全体で一貫性を保つことができます。 +* **メインページ:** 2 番目のページはメインページで、プロジェクトの完全なユーザーインターフェースを示しています。 ***再生*** を押すことで、アプリプロトタイプを完全に使用できます。 **メインページ:** 2 番目のページはメインページで、プロジェクトの完全なユーザーインターフェースを示しています。 ***再生*** を押すことで、アプリプロトタイプを完全に使用できます。 ***再生*** を押すことで、アプリプロトタイプを完全に使用できます。 +* **特徴ページ:** その他のページは、通常、進行中の機能に専念しています。 それらはアプリケーションまたはウェブサイトの特定の機能またはモジュールのデザインを含みます。 通常、まだ進行中です。 それらはアプリケーションまたはウェブサイトの特定の機能またはモジュールのデザインを含みます。 通常、まだ進行中です。 それらはアプリケーションまたはウェブサイトの特定の機能またはモジュールのデザインを含みます。 通常、まだ進行中です。 それらはアプリケーションまたはウェブサイトの特定の機能またはモジュールのデザインを含みます。 通常、まだ進行中です。 -## Useful Tips +## 役立つヒント -With read-only access, you can't edit the design, but you can access all features that will be useful to convert the designs into code. +閲覧専用アクセスでは、デザインの編集はできませんが、デザインをコードに変換する際に役立つすべての機能にアクセスできます。 -### Use the Dev mode +### 開発者モードを使用する -Figma's Dev Mode enhances developers' productivity by providing easy design navigation, effective asset management, efficient communication tools, toolbox integrations, quick code snippets, and key layer information, bridging the gap between design and development. You can learn more about Dev Mode [here](https://www.figma.com/dev-mode/). +Figma の Dev モードは、デザインナビゲーションの容易化、効果的なアセット管理、効率的な通信ツール、ツールボックス統合、迅速なコードスニペット、主要レイヤー情報の提供により、開発者の生産性を向上させ、デザインと開発の間のギャップを埋めます。 Dev Mode についての詳細は [こちら](https://www.figma.com/dev-mode/) で確認できます。 -Switch to the "Developer" mode in the right part of the toolbar to see design specs, copy CSS, and access assets. +ツールバーの右部分で「開発者」モードに切り替えることで、デザインスペックの確認、CSS のコピー、アセットへのアクセスが可能です。 -### Use the Prototype +### プロトタイプを使用する -Click on any element on the canvas and press the “Play” button at the top right edge of the interface to access the prototype view. Prototype mode allows you to interact with the design as if it were the final product. It demonstrates the flow between screens and how interface elements like buttons, links, or menus behave when interacted with. +キャンバス上の任意の要素をクリックし、インターフェースの右上隅にある「再生」ボタンを押してプロトタイプビューにアクセスします。 プロトタイプモードでは、あたかも最終製品であるかのようにデザインに触れることができます。 画面間のフローや、ボタン、リンク、メニューなどのインターフェース要素が操作時にどのように動作するかを示します。 -1. **Understanding transitions and animations:** In the Prototype mode, you can view any transitions or animations added by a designer between screens or UI elements, providing clear visual instructions to developers on the intended behavior and style. -2. **Implementation clarification:** A prototype can also help reduce ambiguities. Developers can interact with it to gain a better understanding of the functionality or appearance of particular elements. +1. **トランジションとアニメーションの理解:** プロトタイプモードでは、デザイナーによって画面や UI 要素間に追加されたトランジションやアニメーションを表示でき、開発者に意図された動作やスタイルを視覚的に明確に指示します。 +2. **実装の明確化:** プロトタイプは曖昧さを減らすのにも役立ちます。 開発者はそれを操作することで、特定の要素の機能や外観をより良く理解することができます。 -For more comprehensive details and guidance on learning the Figma platform, you can visit the official [Figma Documentation](https://help.figma.com/hc/en-us). +Figma プラットフォームの学習に関するより包括的な詳細とガイダンスについては、公式の [Figma ドキュメント](https://help.figma.com/hc/en-us) を訪れることができます。 -### Measure distances +### 距離を測定する -Select an element, hold `Option` key (Mac) or `Alt` key (Windows), then hover over another element to see the distance between them. +要素を選択し、`Option` キー(Mac)または `Alt` キー(Windows)を押したまま、別の要素の上にカーソルを合わせると、それらの間の距離が表示されます。 -### Figma extension for VSCode (Recommended) +### VSCode 用 Figma 拡張機能(推奨) -[Figma for VS Code](https://marketplace.visualstudio.com/items?itemName=figma.figma-vscode-extension) -lets you navigate and inspect design files, collaborate with designers, track changes, and speed up implementation - all without leaving your text editor. -It's part of our recommended extensions. +[Figma for VS Code](https://marketplace.visualstudio.com/items?itemName=figma.figma-vscode-extension) を使用すると、デザインファイルのナビゲート、検査、デザイナーとのコラボレーション、変更の追跡、実装の促進ができます - すべてをテキストエディターから離れることなく行えます。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 +これは推奨拡張機能の一部です。 -## Collaboration +## コラボレーション -1. **Using Comments:** You are welcome to use the comment feature by clicking on the bubble icon in the left part of the toolbar. -2. **Cursor chat:** A nice feature of Figma is the Cursor chat. Just press `;` on Mac and `/` on Windows to send a message if you see someone else using Figma as the same time as you. +1. **コメントの使用:** ツールバーの左側にあるバブルアイコンをクリックしてコメント機能を使用できます。 +2. **カーソルチャット:** Figma の魅力的な機能のひとつにカーソルチャットがあります。 他の Figma を同時に使用している誰かを見た場合、`/` キー(Windows)または `;` キー(Mac)を押してメッセージを送信します。 **カーソルチャット:** Figma の魅力的な機能のひとつにカーソルチャットがあります。 他の Figma を同時に使用している誰かを見た場合、`/` キー(Windows)または `;` キー(Mac)を押してメッセージを送信します。 他の Figma を同時に使用している誰かを見た場合、`/` キー(Windows)または `;` キー(Mac)を押してメッセージを送信します。 **カーソルチャット:** Figma の魅力的な機能のひとつにカーソルチャットがあります。 他の Figma を同時に使用している誰かを見た場合、`/` キー(Windows)または `;` キー(Mac)を押してメッセージを送信します。 **カーソルチャット:** Figma の魅力的な機能のひとつにカーソルチャットがあります。 他の Figma を同時に使用している誰かを見た場合、`/` キー(Windows)または `;` キー(Mac)を押してメッセージを送信します。 他の Figma を同時に使用している誰かを見た場合、`/` キー(Windows)または `;` キー(Mac)を押してメッセージを送信します。 **カーソルチャット:** Figma の魅力的な機能のひとつにカーソルチャットがあります。 他の Figma を同時に使用している誰かを見た場合、`/` キー(Windows)または `;` キー(Mac)を押してメッセージを送信します。 **カーソルチャット:** Figma の魅力的な機能のひとつにカーソルチャットがあります。 他の Figma を同時に使用している誰かを見た場合、`/` キー(Windows)または `;` キー(Mac)を押してメッセージを送信します。 他の Figma を同時に使用している誰かを見た場合、`/` キー(Windows)または `;` キー(Mac)を押してメッセージを送信します。 **カーソルチャット:** Figma の魅力的な機能のひとつにカーソルチャットがあります。 他の Figma を同時に使用している誰かを見た場合、`/` キー(Windows)または `;` キー(Mac)を押してメッセージを送信します。 他の Figma を同時に使用している誰かを見た場合、`/` キー(Windows)または `;` キー(Mac)を押してメッセージを送信します。 diff --git a/packages/twenty-docs/l/ja/developers/contribute/capabilities/local-setup.mdx b/packages/twenty-docs/l/ja/developers/contribute/capabilities/local-setup.mdx index c5c2f04ceb..53240e2fd1 100644 --- a/packages/twenty-docs/l/ja/developers/contribute/capabilities/local-setup.mdx +++ b/packages/twenty-docs/l/ja/developers/contribute/capabilities/local-setup.mdx @@ -1,13 +1,13 @@ --- -title: Local Setup -description: The guide for contributors (or curious developers) who want to run Twenty locally. +title: ローカルセットアップ +description: 寄稿者(または好奇心旺盛な開発者)のためのガイドで、ローカルにTwentyを実行したい人向けです。 --- -## Prerequisites +## 前提条件 - - Before you can install and use Twenty, make sure you install the following on your computer: + + Twentyをインストールして使用する前に、以下をコンピュータにインストールしてください。 * [Git](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git) * [Node v24.5.0](https://nodejs.org/en/download) @@ -15,25 +15,31 @@ description: The guide for contributors (or curious developers) who want to run * [nvm](https://github.com/nvm-sh/nvm/blob/master/README.md) - `npm` won't work, you should use `yarn` instead. Yarn is now shipped with Node.js, so you don't need to install it separately. - You only have to run `corepack enable` to enable Yarn if you haven't done it yet. + `npm`は使えません。代わりに`yarn`を使用してください。 + `npm`は使えません。代わりに`yarn`を使用してください。 Yarnは今Node.jsに同梱されているので、別途インストールする必要はありません。 + Yarnを有効にするには、まだしていない場合は`corepack enable`を実行するだけです。 + `npm`は使えません。代わりに`yarn`を使用してください。 Yarnは今Node.jsに同梱されているので、別途インストールする必要はありません。 + Yarnを有効にするには、まだしていない場合は`corepack enable`を実行するだけです。Yarnを有効にするには、まだしていない場合は`corepack enable`を実行するだけです。 - - 1. Install WSL - Open PowerShell as Administrator and run: + + 1. WSLをインストール + 管理者としてPowerShellを開き、次のコマンドを実行します。 ```powershell wsl --install ``` - You should now see a prompt to restart your computer. If not, restart it manually. + コンピュータを再起動するプロンプトが表示されるはずです。 表示されなければ、手動で再起動してください。 表示されなければ、手動で再起動してください。 表示されなければ、手動で再起動してください。 - Upon restart, a powershell window will open and install Ubuntu. This may take up some time. - You'll see a prompt to create a username and password for your Ubuntu installation. + 再起動後、PowerShellウィンドウが開き、Ubuntuをインストールします。 これには少し時間がかかるかもしれません。 + 再起動後、PowerShellウィンドウが開き、Ubuntuをインストールします。 これには少し時間がかかるかもしれません。 + Ubuntuインストールのためにユーザー名とパスワードを設定するプロンプトが表示されます。 これには少し時間がかかるかもしれません。 + 再起動後、PowerShellウィンドウが開き、Ubuntuをインストールします。 これには少し時間がかかるかもしれません。 + Ubuntuインストールのためにユーザー名とパスワードを設定するプロンプトが表示されます。 - 2. Install and configure git + 2. gitをインストールして設定する ```bash sudo apt-get install git @@ -43,10 +49,11 @@ description: The guide for contributors (or curious developers) who want to run git config --global user.email "youremail@domain.com" ``` - 3. Install nvm, node.js and yarn + 3. nvm、node.js、yarnをインストールする - Use `nvm` to install the correct `node` version. The `.nvmrc` ensures all contributors use the same version. + `nvm`を使用して正しい`node`バージョンをインストールします。 `.nvmrc`は、すべての寄稿者が同じバージョンを使用することを保証します。 + `.nvmrc`は、すべての寄稿者が同じバージョンを使用することを保証します。 ```bash @@ -55,7 +62,7 @@ description: The guide for contributors (or curious developers) who want to run curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/master/install.sh | bash ``` - Close and reopen your terminal to use nvm. Then run the following commands. + nvmを使用できるようにするには、ターミナルを閉じて再度開いてください。 次のコマンドを実行します。 次のコマンドを実行します。 次のコマンドを実行します。 ```bash @@ -70,13 +77,15 @@ description: The guide for contributors (or curious developers) who want to run --- -## Step 1: Git Clone +## ステップ1:Gitクローン -In your terminal, run the following command. +ターミナルで次のコマンドを実行します。 - - If you haven't already set up SSH keys, you can learn how to do so [here](https://docs.github.com/en/authentication/connecting-to-github-with-ssh/about-ssh). + + SSHキーの設定をまだ行っていない場合は、[こちら](https://docs.github.com/en/authentication/connecting-to-github-with-ssh/about-ssh)で学べます。```bash + git clone git@github.com:twentyhq/twenty.git + ``` ```bash git clone git@github.com:twentyhq/twenty.git @@ -90,36 +99,36 @@ In your terminal, run the following command. -## Step 2: Position yourself at the root +## ステップ 2: ルートディレクトリに移動する ```bash cd twenty ``` -You should run all commands in the following steps from the root of the project. +プロジェクトのルートで次のステップのすべてのコマンドを実行する必要があります。 -## Step 3: Set up a PostgreSQL Database +## ステップ3:PostgreSQLデータベースをセットアップします - **Option 1 (preferred):** To provision your database locally: - Use the following link to install Postgresql on your Linux machine: [Postgresql Installation](https://www.postgresql.org/download/linux/) + **オプション1(推奨):** データベースをローカルにプロビジョニングするには: + LinuxマシンにPostgresqlをインストールするには、次のリンクを使用してください:[Postgresqlインストール](https://www.postgresql.org/download/linux/) ```bash psql postgres -c "CREATE DATABASE \"default\";" -c "CREATE DATABASE test;" ``` - Note: You might need to add `sudo -u postgres` to the command before `psql` to avoid permission errors. + 注意:`psql`の前に`sudo -u postgres`を追加して、パーミッションエラーを避ける必要があるかもしれません。 - **Option 2:** If you have docker installed: + **オプション2:** dockerをインストールしている場合: ```bash - make postgres-on-docker + make -C packages/twenty-docker postgres-on-docker ``` - **Option 1 (preferred):** To provision your database locally with `brew`: + **オプション1(推奨):** `brew`でローカルにデータベースをプロビジョニングするには: ```bash brew install postgresql@16 @@ -128,16 +137,14 @@ You should run all commands in the following steps from the root of the project. psql postgres -c "CREATE DATABASE \"default\";" -c "CREATE DATABASE test;" ``` - You can verify if the PostgreSQL server is running by executing: + PostgreSQLサーバーが稼働しているかどうかを確認するには、以下を実行してください。 ```bash brew services list ``` - The installer might not create the `postgres` user by default when installing - via Homebrew on MacOS. Instead, it creates a PostgreSQL role that matches your macOS - username (e.g., "john"). - To check and create the `postgres` user if necessary, follow these steps: + インストーラーは、デフォルトでHomebrew経由でMacOSにインストールする際に`postgres`ユーザーを作成しないかもしれません。 代わりに、macOSのユーザー名(例:「john」)と一致するPostgreSQLロールを作成します。 + 必要に応じて、`postgres`ユーザーを確認して作成するには、次の手順を実行してください。 ```bash # Connect to PostgreSQL @@ -146,14 +153,14 @@ You should run all commands in the following steps from the root of the project. psql -U $(whoami) -d postgres ``` - Once at the psql prompt (postgres=#), run: + psqlプロンプト(postgres=#)で次を実行します。 ```bash # List existing PostgreSQL roles \du ``` - You'll see output similar to: + 以下のような出力が表示されます。 ```bash Role name | Attributes | Member of @@ -161,98 +168,98 @@ You should run all commands in the following steps from the root of the project. john | Superuser | {} ``` - If you do not see a `postgres` role listed, proceed to the next step. - Create the `postgres` role manually: + `postgres`ロールがリストに表示されない場合は、次のステップに進んでください。 + `postgres`ロールを手動で作成します。 ```bash CREATE ROLE postgres WITH SUPERUSER LOGIN; ``` - This creates a superuser role named `postgres` with login access. + これにより、ログイン権限を持つ `postgres` というスーパーユーザーロールが作成されます。 - **Option 2:** If you have docker installed: + **オプション2:** dockerをインストールしている場合: ```bash - make postgres-on-docker + make -C packages/twenty-docker postgres-on-docker ``` - - All the following steps are to be run in the WSL terminal (within your virtual machine) + + 以下のすべてのステップは、WSLターミナル(仮想マシン内)で実行されます。 - **Option 1:** To provision your Postgresql locally: - Use the following link to install Postgresql on your Linux virtual machine: [Postgresql Installation](https://www.postgresql.org/download/linux/) + **オプション1:** PostgreSQLをローカルでプロビジョニングするには: + Linux仮想マシンにPostgresqlをインストールするには、次のリンクを使用してください:[Postgresqlインストール](https://www.postgresql.org/download/linux/) ```bash psql postgres -c "CREATE DATABASE \"default\";" -c "CREATE DATABASE test;" ``` - Note: You might need to add `sudo -u postgres` to the command before `psql` to avoid permission errors. + 注意:`psql`の前に`sudo -u postgres`を追加して、パーミッションエラーを避ける必要があるかもしれません。 - **Option 2:** If you have docker installed: - Running Docker on WSL adds an extra layer of complexity. - Only use this option if you are comfortable with the extra steps involved, including turning on [Docker Desktop WSL2](https://docs.docker.com/desktop/wsl). + **オプション2:** dockerをインストールしている場合: + WSLでDockerを実行すると、手順が少し複雑になります。 + 追加の手順を含む[Docker Desktop WSL2](https://docs.docker.com/desktop/wsl)の有効化などの追加の手順に精通している場合にのみこのオプションを使用してください。 ```bash - make postgres-on-docker + make -C packages/twenty-docker postgres-on-docker ``` -You can now access the database at [localhost:5432](localhost:5432), with user `postgres` and password `postgres` . +データベースに[localhost:5432](localhost:5432)でアクセスできるようになりました。ユーザーは`postgres`、パスワードは`postgres`です。 -## Step 4: Set up a Redis Database (cache) +## ステップ4:Redisデータベース(キャッシュ)をセットアップ -Twenty requires a redis cache to provide the best performance +Twentyは、最良のパフォーマンスを提供するためにredisキャッシュを必要とします。 - **Option 1:** To provision your Redis locally: - Use the following link to install Redis on your Linux machine: [Redis Installation](https://redis.io/docs/latest/operate/oss_and_stack/install/install-redis/install-redis-on-linux/) + **オプション1:** Redisをローカルでプロビジョニングするには: + LinuxマシンにRedisをインストールするには、次のリンクを使用してください:[Redisインストール](https://redis.io/docs/latest/operate/oss_and_stack/install/install-redis/install-redis-on-linux/) - **Option 2:** If you have docker installed: + **オプション2:** dockerをインストールしている場合: ```bash - make redis-on-docker + make -C packages/twenty-docker redis-on-docker ``` - **Option 1 (preferred):** To provision your Redis locally with `brew`: + **オプション1(推奨):** `brew`でredisをローカルプロビジョニングするには: ```bash brew install redis ``` - Start your redis server: + Redisサーバーを開始します: `brew services start redis` - **Option 2:** If you have docker installed: + **オプション2:** dockerをインストールしている場合: ```bash - make redis-on-docker + make -C packages/twenty-docker redis-on-docker ``` - - **Option 1:** To provision your Redis locally: - Use the following link to install Redis on your Linux virtual machine: [Redis Installation](https://redis.io/docs/latest/operate/oss_and_stack/install/install-redis/install-redis-on-linux/) + + **オプション1:** Redisをローカルでプロビジョニングするには: + Linux仮想マシンにRedisをインストールするには、次のリンクを使用してください:[Redisインストール](https://redis.io/docs/latest/operate/oss_and_stack/install/install-redis/install-redis-on-linux/) - **Option 2:** If you have docker installed: + **オプション2:** dockerをインストールしている場合: ```bash - make redis-on-docker + make -C packages/twenty-docker redis-on-docker ``` -If you need a Client GUI, we recommend [redis insight](https://redis.io/insight/) (free version available) +クライアントGUIが必要な場合は、[redis insight](https://redis.io/insight/)(無料版利用可能)をお勧めします。 -## Step 5: Setup environment variables +## ステップ5:環境変数をセットアップします -Use environment variables or `.env` files to configure your project. More info [here](/l/ja/developers/self-host/capabilities/setup) +環境変数や`.env`ファイルを使ってプロジェクトを設定します。 詳細は[こちら](https://docs.twenty.com/l/ja/developers/self-hosting/setup)。 詳細は[こちら](/l/ja/developers/self-host/capabilities/setup)。 -Copy the `.env.example` files in `/front` and `/server`: +`/front`と`/server`内の`.env.example`ファイルをコピーします: ```bash cp ./packages/twenty-front/.env.example ./packages/twenty-front/.env @@ -260,48 +267,48 @@ cp ./packages/twenty-server/.env.example ./packages/twenty-server/.env ``` - **Multi-Workspace Mode:** By default, Twenty runs in single-workspace mode where only one workspace can be created. To enable multi-workspace support (useful for testing subdomain-based features), set `IS_MULTIWORKSPACE_ENABLED=true` in your server `.env` file. See [Multi-Workspace Mode](/l/ja/developers/self-host/capabilities/setup#multi-workspace-mode) for details. + **マルチワークスペースモード:** デフォルトでは、Twenty は単一ワークスペースモードで動作し、ワークスペースは 1 つだけ作成できます。 マルチワークスペース対応を有効にするには(サブドメインベースの機能のテストに有用)、サーバーの `.env` ファイルで `IS_MULTIWORKSPACE_ENABLED=true` を設定してください。 詳細は[マルチワークスペースモード](/l/ja/developers/self-host/capabilities/setup#multi-workspace-mode)を参照してください。 -## Step 6: Installing dependencies +## ステップ6:依存関係をインストールします -To build Twenty server and seed some data into your database, run the following command: +Twentyサーバーを構築し、データベースにデータをシードするには、以下のコマンドを実行します: ```bash yarn ``` -Note that `npm` or `pnpm` won't work +`npm`または`pnpm`は使えません -## Step 7: Running the project +## ステップ7:プロジェクトを実行する - Depending on your Linux distribution, Redis server might be started automatically. - If not, check the [Redis installation guide](https://redis.io/docs/latest/operate/oss_and_stack/install/install-redis/) for your distro. + Linuxディストリビューションによっては、Redisサーバーが自動的に開始されるかもしれません。 + そうでない場合は、[Redisインストールガイド](https://redis.io/docs/latest/operate/oss_and_stack/install/install-redis/)を参照し、お使いのディストリビューションに合わせて確認してください。 - Redis should already be running. If not, run: + Redisはすでに稼働しているはずです。 稼働していなかった場合は、以下を実行してください: ```bash brew services start redis ``` - - Depending on your Linux distribution, Redis server might be started automatically. - If not, check the [Redis installation guide](https://redis.io/docs/latest/operate/oss_and_stack/install/install-redis/) for your distro. + + Linuxディストリビューションによっては、Redisサーバーが自動的に開始されるかもしれません。 + そうでない場合は、[Redisインストールガイド](https://redis.io/docs/latest/operate/oss_and_stack/install/install-redis/)を参照し、お使いのディストリビューションに合わせて確認してください。 -Set up your database with the following command: +次のコマンドでデータベースをセットアップします: ```bash npx nx database:reset twenty-server ``` -Start the server, the worker and the frontend services: +サーバー、ワーカー、フロントエンドサービスを開始します: ```bash npx nx start twenty-server @@ -309,25 +316,25 @@ npx nx worker twenty-server npx nx start twenty-front ``` -Alternatively, you can start all services at once: +または、すべてのサービスを一度に開始することができます: ```bash npx nx start ``` -## Step 8: Use Twenty +## ステップ 8: Twentyを使用する -**Frontend** +**フロントエンド** -Twenty's frontend will be running at [http://localhost:3001](http://localhost:3001). -You can log in using the default demo account: `tim@apple.dev` (password: `tim@apple.dev`) +Twentyのフロントエンドは[http://localhost:3001](http://localhost:3001)で稼働しています。 +デフォルトのデモアカウントを使用してログインできます: `tim@apple.dev` (パスワード: `tim@apple.dev`) -**Backend** +**バックエンド** -* Twenty's server will be up and running at [http://localhost:3000](http://localhost:3000) -* The GraphQL API can be accessed at [http://localhost:3000/graphql](http://localhost:3000/graphql) -* The REST API can be reached at [http://localhost:3000/rest](http://localhost:3000/rest) +* Twentyのサーバーは[http://localhost:3000](http://localhost:3000)で稼働しています +* GraphQL API は [http://localhost:3000/graphql](http://localhost:3000/graphql) でアクセスできます +* REST API は [http://localhost:3000/rest](http://localhost:3000/rest) でアクセスできます -## Troubleshooting +## トラブルシューティング -If you encounter any problem, check [Troubleshooting](/l/ja/developers/self-host/capabilities/troubleshooting) for solutions. +問題が発生した場合は、[トラブルシューティング](/l/ja/developers/self-host/capabilities/troubleshooting)を確認して解決策を見つけてください。 diff --git a/packages/twenty-docs/l/ja/developers/contribute/contribute.mdx b/packages/twenty-docs/l/ja/developers/contribute/contribute.mdx index dbeb7d1517..9b70356d08 100644 --- a/packages/twenty-docs/l/ja/developers/contribute/contribute.mdx +++ b/packages/twenty-docs/l/ja/developers/contribute/contribute.mdx @@ -1,32 +1,32 @@ --- -title: Contribute -description: Contribute to Twenty's open-source development. +title: 貢献 +description: Twentyのオープンソース開発に貢献しましょう。 --- AI -## Overview +## 概要 -Twenty is open-source and welcomes contributions from the community. Whether you're fixing bugs, adding features, or improving documentation, your contributions help make Twenty better for everyone. +Twentyはオープンソースであり、コミュニティからの貢献を歓迎しています。 バグを修正したり、機能を追加したり、ドキュメントを改善したりするなど、あなたの貢献は、Twentyをすべての人にとってより良いものにする助けになります。 -## Ways to Contribute +## 貢献する方法 -* **Report bugs**: Help identify and document issues -* **Submit features**: Propose and implement new functionality -* **Improve documentation**: Make our docs clearer and more helpful -* **Frontend development**: Work on the React-based UI -* **Backend development**: Contribute to the NestJS server +* **バグを報告**: 問題の特定と記録に協力する +* **機能の提案**: 新しい機能を提案して実装する +* **ドキュメントを改善**: ドキュメントをより分かりやすく役立つものにする +* **フロントエンド開発**: ReactベースのUIに取り組む +* **バックエンド開発**: NestJSサーバーに貢献する -## Getting Started +## 始めに - - Report issues or request features + + 問題を報告する、または機能を要望する - - Contribute to the UI + + UIに貢献する diff --git a/packages/twenty-docs/l/ja/developers/extend/capabilities/apis.mdx b/packages/twenty-docs/l/ja/developers/extend/capabilities/apis.mdx index 0b2c8b826e..3c6a989ae5 100644 --- a/packages/twenty-docs/l/ja/developers/extend/capabilities/apis.mdx +++ b/packages/twenty-docs/l/ja/developers/extend/capabilities/apis.mdx @@ -1,147 +1,147 @@ --- -title: APIs -description: Query and modify your CRM data programmatically using REST or GraphQL. +title: API +description: REST または GraphQL を使用して、プログラムから CRM データをクエリおよび変更します。 --- import { VimeoEmbed } from '/snippets/vimeo-embed.mdx'; -Twenty was built to be developer-friendly, offering powerful APIs that adapt to your custom data model. We provide four distinct API types to meet different integration needs. +Twentyは開発者に優しい設計で、強力なAPIを提供し、カスタムデータモデルに適応します。 異なる統合ニーズに対応する4つの異なるAPIタイプを提供します。 異なる統合ニーズに対応する4つの異なるAPIタイプを提供します。 異なる統合ニーズに対応する4つの異なるAPIタイプを提供します。 -## Developer-First Approach +## 開発者優先アプローチ -Twenty generates APIs specifically for your data model: +Twenty は、お使いのデータモデルに特化した API を生成します: -* **No long IDs required**: Use your object and field names directly in endpoints -* **Standard and custom objects treated equally**: Your custom objects get the same API treatment as built-in ones -* **Dedicated endpoints**: Each object and field gets its own API endpoint -* **Custom documentation**: Generated specifically for your workspace's data model +* **長いIDが不要**:オブジェクトとフィールド名をエンドポイントに直接使用 +* **標準とカスタムオブジェクトを同等に扱う**:カスタムオブジェクトも組み込みのものと同じAPI処理を受ける +* **専用エンドポイント**:各オブジェクトとフィールドに固有のAPIエンドポイントが設けられる +* **カスタムドキュメント**:ワークスペースのデータモデルに特化して生成 - Your personalized API documentation is available under **Settings → API & Webhooks** after creating an API key. Since Twenty generates APIs that match your custom data model, the documentation is unique to your workspace. + API キー作成後、**Settings → API & Webhooks** でパーソナライズされた API ドキュメントを利用できます。 Twenty はカスタムデータモデルに合致する API を生成するため、ドキュメントはお使いのワークスペース専用です。 -## The Two API Types +## 2 つの API タイプ -### Core API +### コアAPI -Accessed on `/rest/` or `/graphql/` +`/rest/` または `/graphql/` でアクセスできます。 -Work with your actual **records** (the data): +実際の **レコード**(データ)を扱います: -* Create, read, update, delete People, Companies, Opportunities, etc. -* Query and filter data -* Manage record relationships +* People、Companies、Opportunities などを作成・読み取り・更新・削除。 +* データのクエリとフィルター +* レコードの関係管理 -### Metadata API +### メタデータAPI -Accessed on `/rest/metadata/` or `/metadata/` +`/rest/metadata/` または `/metadata/` でアクセスできます。 -Manage your **workspace and data model**: +**ワークスペースとデータモデル**を管理: -* Create, modify, or delete objects and fields -* Configure workspace settings -* Define relationships between objects +* オブジェクトやフィールドの作成、変更、削除 +* ワークスペース設定の構成 +* オブジェクト間のリレーションシップを定義 -## REST vs GraphQL +## REST と GraphQL の比較 -Both Core and Metadata APIs are available in REST and GraphQL formats: +Core と Metadata の両 API は、REST と GraphQL の形式で利用可能です: -| Format | Available Operations | -| ----------- | ---------------------------------------------------------- | -| **REST** | CRUD, batch operations, upserts | -| **GraphQL** | Same + **batch upserts**, relationship queries in one call | +| 形式 | 利用可能な操作 | +| ----------- | ---------------------------------------- | +| **REST** | CRUD、バッチ操作、アップサート | +| **GraphQL** | 同様に、**バッチアップサート**、1 回の呼び出しでのリレーションシップクエリ | -Choose based on your needs — both formats access the same data. +ニーズに合わせて選択してください—どちらの形式でも同じデータにアクセスできます。 -## API Endpoints +## APIエンドポイント -| Environment | Base URL | -| --------------- | ------------------------- | -| **Cloud** | `https://api.twenty.com/` | -| **Self-Hosted** | `https://{your-domain}/` | +| 環境 | ベース URL | +| ---------- | ------------------------- | +| **クラウド** | `https://api.twenty.com/` | +| **セルフホスト** | `https://{your-domain}/` | -## Authentication +## 認証 -Every API request requires an API key in the header: +すべての API リクエストにはヘッダーに API キーが必要です: ``` Authorization: Bearer YOUR_API_KEY ``` -### Create an API Key +### APIキーを作成 -1. Go to **Settings → APIs & Webhooks** -2. Click **+ Create key** -3. Configure: - * **Name**: Descriptive name for the key - * **Expiration Date**: When the key expires -4. Click **Save** -5. **Copy immediately** — the key is only shown once +1. **Settings → APIs & Webhooks**に移動 +2. **+ Create key** をクリック +3. 設定: + * **Name**: キーのわかりやすい名前 + * **Expiration Date**: キーの有効期限 +4. **保存**をクリック +5. **すぐにコピー** — キーは一度しか表示されません - + - Your API key grants access to sensitive data. Don't share it with untrusted services. If compromised, disable it immediately and generate a new one. + API キーは機密データへのアクセスを許可します。 信頼できないサービスと共有しないでください。 漏洩した場合は、直ちに無効化して新しいものを生成してください。 -### Assign a Role to an API Key +### API キーにロールを割り当てる -For better security, assign a specific role to limit access: +セキュリティを高めるため、アクセスを制限する特定のロールを割り当ててください: -1. Go to **Settings → Roles** -2. Click on the role to assign -3. Open the **Assignment** tab -4. Under **API Keys**, click **+ Assign to API key** -5. Select the API key +1. **設定 → 役割** に移動 +2. 割り当てるロールをクリック +3. **割り当て** タブを開く +4. **API Keys** の下で、**+ Assign to API key** をクリック +5. API キーを選択 -The key will inherit that role's permissions. See [Permissions](/l/ja/user-guide/permissions-access/capabilities/permissions) for details. +キーはそのロールの権限を継承します。 詳細は[権限](/l/ja/user-guide/permissions-access/capabilities/permissions)を参照してください。 -### Manage API Keys +### APIキーの管理 -**Regenerate**: Settings → APIs & Webhooks → Click key → **Regenerate** +**Regenerate**: Settings → APIs & Webhooks → キーをクリック → **Regenerate** -**Delete**: Settings → APIs & Webhooks → Click key → **Delete** +**Delete**: Settings → APIs & Webhooks → キーをクリック → **Delete** -## API Playground +## API プレイグラウンド -Test your APIs directly in the browser with our built-in playground — available for both **REST** and **GraphQL**. +組み込みのプレイグラウンドでブラウザから直接 API をテストできます—**REST** と **GraphQL** の両方で利用可能です。 -### Access the Playground +### プレイグラウンドにアクセス -1. Go to **Settings → APIs & Webhooks** -2. Create an API key (required) -3. Click on **REST API** or **GraphQL API** to open the playground +1. **Settings → APIs & Webhooks**に移動 +2. API キーを作成(必須) +3. プレイグラウンドを開くには **REST API** または **GraphQL API** をクリック -### What You Get +### 提供内容 -* **Interactive documentation**: Generated for your specific data model -* **Live testing**: Execute real API calls against your workspace -* **Schema explorer**: Browse available objects, fields, and relationships -* **Request builder**: Construct queries with autocomplete +* **インタラクティブなドキュメント**: お使いの特定のデータモデル向けに生成 +* **ライブテスト**: ワークスペースに対して実際の API 呼び出しを実行 +* **スキーマエクスプローラー**: 利用可能なオブジェクト、フィールド、リレーションシップを閲覧 +* **リクエストビルダー**: オートコンプリートでクエリを構築 -The playground reflects your custom objects and fields, so documentation is always accurate for your workspace. +プレイグラウンドはカスタムのオブジェクトとフィールドを反映するため、ドキュメントは常にお使いのワークスペースに対して正確です。 -## Batch Operations +## バッチ操作 -Both REST and GraphQL support batch operations: +REST と GraphQL の両方がバッチ操作をサポートしています: -* **Batch size**: Up to 60 records per request -* **Operations**: Create, update, delete multiple records +* **バッチサイズ**:リクエストあたり最大60記録 +* **操作**: 複数のレコードの作成、更新、削除 -**GraphQL-only features:** +**GraphQL のみの機能:** -* **Batch Upsert**: Create or update in one call -* Use plural object names (e.g., `CreateCompanies` instead of `CreateCompany`) +* **バッチアップサート**: 1 回の呼び出しで作成または更新 +* 複数形のオブジェクト名を使用(例:`CreateCompany` ではなく `CreateCompanies`) -## Rate Limits +## API レートリミット -API requests are throttled to ensure platform stability: +プラットフォームの安定性を確保するため、API リクエストはレート制限されています: -| Limit | Value | -| -------------- | -------------------- | -| **Requests** | 100 calls per minute | -| **Batch size** | 60 records per call | +| 制限 | 値 | +| ---------- | ------------------- | +| **リクエスト** | 1 分あたり 100 回の呼び出し | +| **バッチサイズ** | 1 回の呼び出しあたり 60 レコード | - Use batch operations to maximize throughput — process up to 60 records in a single API call instead of making individual requests. + バッチ操作を使用してスループットを最大化しましょう—個別のリクエストではなく、1 回の API 呼び出しで最大 60 レコードを処理できます。 diff --git a/packages/twenty-docs/l/ja/developers/extend/capabilities/apps.mdx b/packages/twenty-docs/l/ja/developers/extend/capabilities/apps.mdx index dc528fa780..7cfdddba3a 100644 --- a/packages/twenty-docs/l/ja/developers/extend/capabilities/apps.mdx +++ b/packages/twenty-docs/l/ja/developers/extend/capabilities/apps.mdx @@ -1,81 +1,88 @@ --- -title: Twenty Apps -description: Build and manage Twenty customizations as code. +title: Twenty アプリ +description: Twenty のカスタマイズをコードとして構築・管理します。 --- - Apps are currently in alpha testing. The feature is functional but still evolving. + アプリは現在アルファテスト中です。 この機能は動作しますが、まだ進化の途上です。 -## What Are Apps? +## Apps とは? -Apps let you build and manage Twenty customizations **as code**. Instead of configuring everything through the UI, you define your data model and serverless functions in code — making it faster to build, maintain, and roll out to multiple workspaces. +Apps を使うと、Twenty のカスタマイズを**コードとして**構築・管理できます。 すべてを UI から設定する代わりに、データモデルやサーバーレス関数をコードで定義できます。これにより、構築と保守が高速になり、複数のワークスペースへの展開も容易になります。 -**What you can do today:** +**現在できること:** -* Define custom objects and fields as code (managed data model) -* Build serverless functions with custom triggers -* Deploy the same app across multiple workspaces +* カスタムオブジェクトとフィールドをコードとして定義(管理されたデータモデル) +* カスタムトリガー付きのサーバーレス関数を作成 +* 同じアプリを複数のワークスペースにデプロイ -**Coming soon:** +**近日公開:** -* Custom UI layouts and components +* カスタム UI レイアウトとコンポーネント -## Prerequisites +## 前提条件 -* Node.js 24+ and Yarn 4 -* A Twenty workspace and an API key (create one at https://app.twenty.com/settings/api-webhooks) +* Node.js 24+ と Yarn 4 +* Twenty のワークスペースと API キー(https://app.twenty.com/settings/api-webhooks で作成) -## Getting Started +## 始めに -Create a new app using the official scaffolder, then authenticate and start developing: +公式スキャフォルダーで新しいアプリを作成し、認証して開発を開始します: ```bash filename="Terminal" -# Scaffold a new app +# 新しいアプリのひな型を作成 npx create-twenty-app@latest my-twenty-app cd my-twenty-app -# Authenticate using your API key (you'll be prompted) -yarn auth +# yarn@4 を使用していない場合 +corepack enable +yarn install -# Start dev mode: automatically syncs local changes to your workspace -yarn dev +# API キーで認証(プロンプトが表示されます) +yarn auth:login + +# 開発モードを開始:ローカルの変更がワークスペースに自動同期されます +yarn app:dev ``` -From here you can: +そこで次のことができます: ```bash filename="Terminal" -# Add a new entity to your application (guided) -yarn create-entity +# アプリケーションに新しいエンティティを追加(ガイド付き) +yarn app:create-entity -# Generate a typed Twenty client and workspace entity types -yarn generate +# 型付きの Twenty クライアントとワークスペースのエンティティ型を生成 +yarn app:generate -# Run a one‑time sync (instead of watch mode) -yarn sync +# 1回限りの同期を実行(ウォッチモードの代わり) +yarn app:sync -# Watch your application's functions logs -yarn logs +# アプリケーションの関数のログを監視 +yarn function:logs -# Uninstall the application from the current workspace -yarn uninstall +# 名前で関数を実行 +yarn function:execute -n my-function -p '{\"name\": \"test\"}' -# Display commands' help -yarn help +# 現在のワークスペースからアプリケーションをアンインストール +yarn app:uninstall + +# コマンドのヘルプを表示 +yarn app:help ``` -See also: the CLI reference pages for [create-twenty-app](https://www.npmjs.com/package/create-twenty-app) and [twenty-sdk CLI](https://www.npmjs.com/package/twenty-sdk). +参考: [create-twenty-app](https://www.npmjs.com/package/create-twenty-app) および [twenty-sdk CLI](https://www.npmjs.com/package/twenty-sdk) の CLI リファレンスページをご覧ください。 -## Project structure (scaffolded) +## プロジェクト構成(スキャフォルド作成) -When you run `npx create-twenty-app@latest my-twenty-app`, the scaffolder: +`npx create-twenty-app@latest my-twenty-app` を実行すると、スキャフォルダーは次を行います: -* Copies a minimal base application into `my-twenty-app/` -* Adds a local `twenty-sdk` dependency and Yarn 4 configuration -* Creates config files and scripts wired to the `twenty` CLI -* Generates a default application config and a default function role +* 最小限のベースアプリケーションを `my-twenty-app/` にコピーします +* ローカルの `twenty-sdk` 依存関係と Yarn 4 の設定を追加します +* `twenty` CLI と連携する設定ファイルとスクリプトを作成します +* デフォルトのアプリケーション設定とデフォルトの関数ロールを生成します -A freshly scaffolded app looks like this: +スキャフォルド直後のアプリは次のようになります: ```text filename="my-twenty-app/" my-twenty-app/ @@ -85,79 +92,144 @@ my-twenty-app/ .nvmrc .yarnrc.yml .yarn/ - releases/ - yarn-4.9.2.cjs install-state.gz eslint.config.mjs tsconfig.json README.md src/ - application.config.ts - role.config.ts - // your entities, actions, and other app files + app/ + application.config.ts # Required - main application configuration + default-function.role.ts # Default role for serverless functions + // your entities (*.object.ts, *.function.ts, *.role.ts) + utils/ # Optional - handler implementations & utilities ``` -At a high level: +### コンベンション優先 -* **package.json**: Declares the app name, version, engines (Node 24+, Yarn 4), and adds `twenty-sdk` plus scripts like `dev`, `sync`, `generate`, `create-entity`, `logs`, `uninstall`, and `auth` that delegate to the local `twenty` CLI. -* **.gitignore**: Ignores common artifacts such as `node_modules`, `.yarn`, `generated/` (typed client), `dist/`, `build/`, coverage folders, log files, and `.env*` files. -* **yarn.lock**, **.yarnrc.yml**, **.yarn/**: Lock and configure the Yarn 4 toolchain used by the project. -* **.nvmrc**: Pins the Node.js version expected by the project. -* **eslint.config.mjs** and **tsconfig.json**: Provide linting and TypeScript configuration for your app’s TypeScript sources. -* **README.md**: A short README in the app root with basic instructions. -* **src/**: The main place where you define your application-as-code: - * `application.config.ts`: Global configuration for your app (metadata and runtime wiring). See “Application config” below. - * `role.config.ts`: Default function role used by your serverless functions. See “Default function role” below. - * Future entities, actions/functions, and any supporting code you add. +アプリケーションは **コンベンション優先(設定より規約)** のアプローチを採用し、エンティティはファイルのサフィックスで検出されます。 これにより、`src/app/` フォルダー内を柔軟に構成できます: -Later commands will add more files and folders: +| ファイルサフィックス | エンティティタイプ | +| --------------- | ------------- | +| `*.object.ts` | カスタムオブジェクトの定義 | +| `*.function.ts` | サーバーレス関数の定義 | +| `*.role.ts` | ロールの定義 | -* `yarn generate` will create a `generated/` folder (typed Twenty client + workspace types). -* `yarn create-entity` will add entity definition files under `src/` for your custom objects. +### サポートされるフォルダー構成 -## Authentication +エンティティは次のいずれのパターンでも構成できます: -The first time you run `yarn auth`, you'll be prompted for: +**従来型(タイプ別):** -* API URL (defaults to http://localhost:3000 or your current workspace profile) -* API key +```text +src/app/ +├── application.config.ts +├── objects/ +│ └── postCard.object.ts +├── functions/ +│ └── createPostCard.function.ts +└── roles/ + └── admin.role.ts +``` -Your credentials are stored per-user in `~/.twenty/config.json`. You can maintain multiple profiles and switch using `--workspace `. +**機能単位:** -Examples: +```text +src/app/ +├── application.config.ts +└── post-card/ + ├── postCard.object.ts + ├── createPostCard.function.ts + └── postCardAdmin.role.ts +``` + +**フラット:** + +```text +src/app/ +├── application.config.ts +├── postCard.object.ts +├── createPostCard.function.ts +└── admin.role.ts +``` + +概要: + +* **package.json**: アプリ名、バージョン、エンジン(Node 24+、Yarn 4)を宣言し、`twenty-sdk` と、`dev`、`sync`、`generate`、`create-entity`、`logs`、`uninstall`、`auth` などのスクリプトを追加します。これらはローカルの `twenty` CLI に委譲されます。 +* **.gitignore**: `node_modules`、`.yarn`、`generated/`(型付きクライアント)、`dist/`、`build/`、カバレッジ用フォルダー、ログファイル、`.env*` ファイルなどの一般的な生成物を無視します。 +* **yarn.lock**、**.yarnrc.yml**、**.yarn/**: プロジェクトで使用する Yarn 4 ツールチェーンをロックおよび構成します。 +* **.nvmrc**: プロジェクトで想定する Node.js バージョンを固定します。 +* **eslint.config.mjs** と **tsconfig.json**: アプリの TypeScript ソース向けの Lint と TypeScript 設定を提供します。 +* **README.md**: アプリのルートにある、基本的な手順を記した短い README。 +* **src/app/**: アプリケーションをコードとして定義する主な場所: + * `application.config.ts`: アプリのグローバル設定(メタデータとランタイムの接続)。 「アプリケーション設定」を参照してください。 + * `*.role.ts`: サーバーレス関数で使用するロール定義。 「デフォルトの関数ロール」を参照してください。 + * `*.object.ts`: カスタムオブジェクトの定義。 + * `*.function.ts`: サーバーレス関数の定義。 +* **src/utils/**: ハンドラーの実装やユーティリティ用の任意フォルダー。 + +後続のコマンドにより、さらにファイルやフォルダーが追加されます: + +* `yarn app:generate` は `generated/` フォルダー(型付きの Twenty クライアント + ワークスペースの型)を作成します。 +* `yarn app:create-entity` は、カスタムオブジェクト、関数、ロール用のエンティティ定義ファイルを `src/app/` 配下に追加します。 + l + +## 認証 + +初めて `yarn auth:login` を実行すると、次が求められます: + +* API URL(デフォルトは http://localhost:3000 または現在のワークスペースプロファイル) +* API キー + +認証情報はユーザーごとに `~/.twenty/config.json` に保存されます。 複数のプロファイルを管理し、相互に切り替えることができます。 + +### ワークスペースの管理 ```bash filename="Terminal" -# Login interactively (recommended) -yarn auth +# 対話的にログイン(推奨) +yarn auth:login -# Use a specific workspace profile -yarn auth --workspace my-custom-workspace +# 特定のワークスペースプロファイルにログイン +yarn auth:login --workspace my-custom-workspace + +# 設定済みのワークスペースをすべて一覧表示 +yarn auth:list + +# デフォルトのワークスペースを切り替え(対話的) +yarn auth:switch + +# 特定のワークスペースに切り替え +yarn auth:switch production + +# 現在の認証状態を確認 +yarn auth:status ``` -## Use the SDK resources (types & config) +一度 `auth:switch` でワークスペースを切り替えると、その後のすべてのコマンドはデフォルトでそのワークスペースを使用します。 一時的に `--workspace ` で上書きできます。 -The twenty-sdk provides typed building blocks you use inside your app. Below are the key pieces you'll touch most often. +## SDK リソース(型と設定)を使う -### Defining objects +twenty-sdk は、アプリ内で使用する型付きのビルディングブロックとヘルパー関数を提供します。 以下は、最も頻繁に扱う主要な構成要素です。 -Custom objects are regular TypeScript classes annotated with decorators from `twenty-sdk`. They live under `src/objects/` in your app and describe both schema and behavior for records in your workspace. +### ヘルパー関数 -Here is an example `postCard` object from the Hello World app: +この SDK は、アプリのエンティティを定義するための組み込み検証付きヘルパー関数を 4 つ提供します: + +| 関数 | 目的 | +| ------------------ | --------------------- | +| `defineApp()` | アプリケーションのメタデータを構成 | +| `defineObject()` | フィールド付きのカスタムオブジェクトを定義 | +| `defineFunction()` | ハンドラー付きのサーバーレス関数を定義 | +| `defineRole()` | ロールの権限とオブジェクトアクセスを構成 | + +これらの関数は実行時に設定を検証し、IDE の補完と型安全性を向上させます。 + +### オブジェクトの定義 + +カスタムオブジェクトは、ワークスペース内のレコードのスキーマと挙動の両方を表します。 組み込み検証付きでオブジェクトを定義するには `defineObject()` を使用します: ```typescript -import { type Note } from '../../generated'; - -import { - type AddressField, - Field, - FieldType, - type FullNameField, - Object, - OnDeleteAction, - Relation, - RelationType, - STANDARD_OBJECT_UNIVERSAL_IDENTIFIERS, -} from 'twenty-sdk'; +// src/app/postCard.object.ts +import { defineObject, FieldType } from 'twenty-sdk'; enum PostCardStatus { DRAFT = 'DRAFT', @@ -166,176 +238,186 @@ enum PostCardStatus { RETURNED = 'RETURNED', } -@Object({ +export default defineObject({ universalIdentifier: '54b589ca-eeed-4950-a176-358418b85c05', nameSingular: 'postCard', namePlural: 'postCards', - labelSingular: 'Post card', - labelPlural: 'Post cards', - description: ' A post card object', + labelSingular: 'Post Card', + labelPlural: 'Post Cards', + description: 'A post card object', icon: 'IconMail', -}) -export class PostCard { - @Field({ - universalIdentifier: '58a0a314-d7ea-4865-9850-7fb84e72f30b', - type: FieldType.TEXT, - label: 'Content', - description: "Postcard's content", - icon: 'IconAbc', - }) - content: string; - - @Field({ - universalIdentifier: 'c6aa31f3-da76-4ac6-889f-475e226009ac', - type: FieldType.FULL_NAME, - label: 'Recipient name', - icon: 'IconUser', - }) - recipientName: FullNameField; - - @Field({ - universalIdentifier: '95045777-a0ad-49ec-98f9-22f9fc0c8266', - type: FieldType.ADDRESS, - label: 'Recipient address', - icon: 'IconHome', - }) - recipientAddress: AddressField; - - @Field({ - universalIdentifier: '87b675b8-dd8c-4448-b4ca-20e5a2234a1e', - type: FieldType.SELECT, - label: 'Status', - icon: 'IconSend', - defaultValue: `'${PostCardStatus.DRAFT}'`, - options: [ - { value: PostCardStatus.DRAFT, label: 'Draft', position: 0, color: 'gray' }, - { value: PostCardStatus.SENT, label: 'Sent', position: 1, color: 'orange' }, - { value: PostCardStatus.DELIVERED, label: 'Delivered', position: 2, color: 'green' }, - { value: PostCardStatus.RETURNED, label: 'Returned', position: 3, color: 'orange' }, - ], - }) - status: PostCardStatus; - - @Relation({ - universalIdentifier: 'c9e2b4f4-b9ad-4427-9b42-9971b785edfe', - type: RelationType.ONE_TO_MANY, - label: 'Notes', - icon: 'IconComment', - inverseSideTargetUniversalIdentifier: STANDARD_OBJECT_UNIVERSAL_IDENTIFIERS.note, - onDelete: OnDeleteAction.CASCADE, - }) - notes: Note[]; - - @Field({ - universalIdentifier: 'e06abe72-5b44-4e7f-93be-afc185a3c433', - type: FieldType.DATE_TIME, - label: 'Delivered at', - icon: 'IconCheck', - isNullable: true, - defaultValue: null, - }) - deliveredAt?: Date; -} + fields: [ + { + universalIdentifier: '58a0a314-d7ea-4865-9850-7fb84e72f30b', + name: 'content', + type: FieldType.TEXT, + label: 'Content', + description: "Postcard's content", + icon: 'IconAbc', + }, + { + universalIdentifier: 'c6aa31f3-da76-4ac6-889f-475e226009ac', + name: 'recipientName', + type: FieldType.FULL_NAME, + label: 'Recipient name', + icon: 'IconUser', + }, + { + universalIdentifier: '95045777-a0ad-49ec-98f9-22f9fc0c8266', + name: 'recipientAddress', + type: FieldType.ADDRESS, + label: 'Recipient address', + icon: 'IconHome', + }, + { + universalIdentifier: '87b675b8-dd8c-4448-b4ca-20e5a2234a1e', + name: 'status', + type: FieldType.SELECT, + label: 'Status', + icon: 'IconSend', + defaultValue: `'${PostCardStatus.DRAFT}'`, + options: [ + { value: PostCardStatus.DRAFT, label: 'Draft', position: 0, color: 'gray' }, + { value: PostCardStatus.SENT, label: 'Sent', position: 1, color: 'orange' }, + { value: PostCardStatus.DELIVERED, label: 'Delivered', position: 2, color: 'green' }, + { value: PostCardStatus.RETURNED, label: 'Returned', position: 3, color: 'orange' }, + ], + }, + { + universalIdentifier: 'e06abe72-5b44-4e7f-93be-afc185a3c433', + name: 'deliveredAt', + type: FieldType.DATE_TIME, + label: 'Delivered at', + icon: 'IconCheck', + isNullable: true, + defaultValue: null, + }, + ], +}); ``` -Key points: +主要ポイント: -* The `@Object` decorator defines the object identity and labels used across the workspace; its `universalIdentifier` must be unique and stable across deployments. -* Each `@Field` decorator defines a field on the object with a type, label, and its own stable `universalIdentifier`. -* `@Relation` wires this object to other objects (standard or custom) and controls cascade behavior with `onDelete`. -* You can scaffold new objects using `yarn create-entity`, which guides you through naming, fields, and relationships, then generates object files similar to the `postCard` example. +* 組み込み検証と優れた IDE サポートのために `defineObject()` を使用します。 +* `universalIdentifier` は、デプロイをまたいで一意かつ安定している必要があります。 +* 各フィールドには、`name`、`type`、`label`、および自身の安定した `universalIdentifier` が必要です。 +* `fields` 配列は任意です。カスタムフィールドなしでオブジェクトを定義できます。 +* `yarn app:create-entity` を使用すれば、新しいオブジェクトをスキャフォルドできます。名前、フィールド、リレーションシップの設定がガイドされます。 -### Application config (application.config.ts) + + **ベースフィールドは自動作成されます。** カスタムオブジェクトを定義すると、Twenty は `name`、`createdAt`、`updatedAt`、`createdBy`、`position`、`deletedAt` などの標準フィールドを自動的に追加します。 これらを `fields` 配列で定義する必要はありません。カスタムフィールドのみを追加してください。 + -Every app has a single `application.config.ts` file that describes: + + TypeScript のデコレーターを使ってオブジェクトを定義することもできます。 この方法では、`@Object`、`@Field`、`@Relation` デコレーターを用いたクラスベースの構文を使用します: -* **Who the app is**: identifiers, display name, and description. -* **How its functions run**: which role they use for permissions. -* **(Optional) variables**: key–value pairs exposed to your functions as environment variables. + ```typescript + import { + type AddressField, + Field, + FieldType, + type FullNameField, + Object, + OnDeleteAction, + Relation, + RelationType, + STANDARD_OBJECT_UNIVERSAL_IDENTIFIERS, + } from 'twenty-sdk'; + import { type Note } from '../../generated'; -When you scaffold a new app, you start with a minimal config: + @Object({ + universalIdentifier: '54b589ca-eeed-4950-a176-358418b85c05', + nameSingular: 'postCard', + namePlural: 'postCards', + labelSingular: 'Post card', + labelPlural: 'Post cards', + description: 'A post card object', + icon: 'IconMail', + }) + export class PostCard { + @Field({ + universalIdentifier: '58a0a314-d7ea-4865-9850-7fb84e72f30b', + type: FieldType.TEXT, + label: 'Content', + description: "Postcard's content", + icon: 'IconAbc', + }) + content: string; + + @Relation({ + universalIdentifier: 'c9e2b4f4-b9ad-4427-9b42-9971b785edfe', + type: RelationType.ONE_TO_MANY, + label: 'Notes', + icon: 'IconComment', + inverseSideTargetUniversalIdentifier: STANDARD_OBJECT_UNIVERSAL_IDENTIFIERS.note, + onDelete: OnDeleteAction.CASCADE, + }) + notes: Note[]; + } + ``` + + 注記: デコレーター方式では、TypeScript 設定で `experimentalDecorators` が必要です。 + + +### アプリケーション設定(application.config.ts) + +すべてのアプリには、次の内容を記述する単一の `application.config.ts` ファイルがあります: + +* **アプリの概要**: 識別子、表示名、説明。 +* **関数の実行方法**: 権限に使用するロール。 +* **(任意)変数**: 関数に環境変数として公開されるキーと値のペア。 + +アプリケーション設定を定義するには `defineApp()` を使用します: ```typescript -import { type ApplicationConfig } from 'twenty-sdk'; +// src/app/application.config.ts +import { defineApp } from 'twenty-sdk'; +import { DEFAULT_FUNCTION_ROLE_UNIVERSAL_IDENTIFIER } from './default-function.role'; -const config: ApplicationConfig = { - universalIdentifier: '', +export default defineApp({ + universalIdentifier: '4ec0391d-18d5-411c-b2f3-266ddc1c3ef7', displayName: 'My Twenty App', description: 'My first Twenty app', - functionRoleUniversalIdentifier: '', -}; - -export default config; -``` - -You can gradually extend this file as your app grows. For example, you can add an icon and application-scoped variables: - -```typescript -import { type ApplicationConfig } from 'twenty-sdk'; - -const config: ApplicationConfig = { - universalIdentifier: '', - displayName: 'My App', - description: 'What your app does', - icon: 'IconWorld', // Choose an icon by name + icon: 'IconWorld', applicationVariables: { DEFAULT_RECIPIENT_NAME: { - universalIdentifier: '', - description: 'Default recipient used by functions', + universalIdentifier: '19e94e59-d4fe-4251-8981-b96d0a9f74de', + description: 'Default recipient name for postcards', value: 'Jane Doe', isSecret: false, }, }, - functionRoleUniversalIdentifier: '', -}; - -export default config; + functionRoleUniversalIdentifier: DEFAULT_FUNCTION_ROLE_UNIVERSAL_IDENTIFIER, +}); ``` -Notes: +注記: -* `universalIdentifier` fields are deterministic IDs you own; generate them once and keep them stable across syncs. -* `applicationVariables` become environment variables for your functions (for example, `DEFAULT_RECIPIENT_NAME` is available as `process.env.DEFAULT_RECIPIENT_NAME`). -* `functionRoleUniversalIdentifier` must match the role you define in `role.config.ts` (see below). +* `universalIdentifier` フィールドは、あなたが管理する決定的な ID です。一度生成し、同期をまたいで安定したままにしてください。 +* `applicationVariables` は関数の環境変数になります(例:`DEFAULT_RECIPIENT_NAME` は `process.env.DEFAULT_RECIPIENT_NAME` として利用可能)。 +* `functionRoleUniversalIdentifier` は、`*.role.ts` ファイルで定義するロールと一致している必要があります(下記参照)。 -#### Roles and permissions +#### ロールと権限 -Applications can define roles that encapsulate permissions on your workspace’s objects and actions. The field `functionRoleUniversalIdentifier` in `application.config.ts` designates the default role used by your app’s serverless functions. +アプリケーションは、ワークスペース内のオブジェクトやアクションに対する権限をカプセル化するロールを定義できます。 `application.config.ts` の `functionRoleUniversalIdentifier` フィールドは、アプリのサーバーレス関数で使用されるデフォルトのロールを指定します。 -* The runtime API key injected as `TWENTY_API_KEY` is derived from this default function role. -* The typed client will be restricted to the permissions granted to that role. -* Follow least‑privilege: create a dedicated role with only the permissions your functions need, then reference its universal identifier. +* `TWENTY_API_KEY` として注入される実行時の API キーは、このデフォルトの関数ロールから派生します。 +* 型付きクライアントの権限は、そのロールに付与された権限に制限されます。 +* 最小権限の原則に従い、関数に必要な権限のみに限定した専用ロールを作成し、そのユニバーサル識別子を参照してください。 -##### Default function role (role.config.ts) +##### デフォルトの関数ロール(\*.role.ts) -When you scaffold a new app, the CLI also creates `src/role.config.ts`. This file exports the default role your serverless functions will use at runtime: +新しいアプリをスキャフォルドすると、CLI はデフォルトのロールファイルも作成します。 組み込み検証付きでロールを定義するには `defineRole()` を使用します: ```typescript -import { PermissionFlag, type RoleConfig } from 'twenty-sdk'; +// src/app/default-function.role.ts +import { defineRole, PermissionFlag } from 'twenty-sdk'; -export const functionRole: RoleConfig = { - universalIdentifier: '', - label: 'My Twenty App default function role', - description: 'My Twenty App default function role', - canReadAllObjectRecords: true, - canUpdateAllObjectRecords: true, - canSoftDeleteAllObjectRecords: true, - canDestroyAllObjectRecords: false, -}; -``` +export const DEFAULT_FUNCTION_ROLE_UNIVERSAL_IDENTIFIER = + 'b648f87b-1d26-4961-b974-0908fd991061'; -The `universalIdentifier` of this role is automatically wired into `application.config.ts` as `functionRoleUniversalIdentifier`. In other words: - -* **role.config.ts** defines what the default function role can do. -* **application.config.ts** points to that role so your functions inherit its permissions. - -As you move beyond the initial scaffold, you should tighten this role and make it explicit about what it can access. A more production-ready role might look closer to: - -```typescript -import { PermissionFlag, type RoleConfig } from 'twenty-sdk'; - -export const functionRole: RoleConfig = { - universalIdentifier: '', +export default defineRole({ + universalIdentifier: DEFAULT_FUNCTION_ROLE_UNIVERSAL_IDENTIFIER, label: 'Default function role', description: 'Default role for function Twenty client', canReadAllObjectRecords: false, @@ -363,41 +445,41 @@ export const functionRole: RoleConfig = { canUpdateFieldValue: false, }, ], - permissionFlags: ['APPLICATIONS'], -}; + permissionFlags: [PermissionFlag.APPLICATIONS], +}); ``` -Notes: +このロールの `universalIdentifier` は、`application.config.ts` で `functionRoleUniversalIdentifier` として参照されます。 言い換えると: -* Start from the scaffolded role, then progressively restrict it following least‑privilege. -* Replace the `objectPermissions` and `fieldPermissions` with the objects/fields your functions need. -* `permissionFlags` control access to platform-level capabilities. Keep them minimal; add only what you need. -* See a working example in the Hello World app: [`packages/twenty-apps/hello-world/src/roles/function-role.ts`](https://github.com/twentyhq/twenty/blob/main/packages/twenty-apps/hello-world/src/roles/function-role.ts). +* **\*.role.ts** は、デフォルトの関数ロールで可能な操作を定義します。 +* **application.config.ts** でそのロールを指定することで、関数はその権限を継承します。 -### Serverless function config and entrypoint +注記: -Each function exports a main handler and a config describing its triggers. You can mix multiple trigger types. +* スキャフォルドされたロールから開始し、最小権限の原則に従って段階的に制限してください。 +* `objectPermissions` と `fieldPermissions` を、関数に必要なオブジェクト/フィールドに置き換えてください。 +* `permissionFlags` はプラットフォームレベルの機能へのアクセスを制御します。 最小限に保ち、必要なものだけを追加してください。 +* 動作例は Hello World アプリにあります: [packages/twenty-apps/hello-world/src/roles/function-role.ts](https://github.com/twentyhq/twenty/blob/main/packages/twenty-apps/hello-world/src/roles/function-role.ts)。 + +### サーバーレス関数の設定とエントリポイント + +各関数ファイルは、ハンドラーと任意のトリガーを含む設定を `defineFunction()` でエクスポートします。 自動検出のために `*.function.ts` のファイルサフィックスを使用します。 ```typescript -// src/actions/create-new-post-card.ts -import type { - FunctionConfig, - DatabaseEventPayload, - ObjectRecordCreateEvent, - CronPayload, -} from 'twenty-sdk'; -import Twenty, { type Person } from '../generated'; +// src/app/createPostCard.function.ts +import { defineFunction } from 'twenty-sdk'; +import type { DatabaseEventPayload, ObjectRecordCreateEvent, CronPayload, RoutePayload } from 'twenty-sdk'; +import Twenty, { type Person } from '../../generated'; -// main handler can accept parameters from route, cron, or database events -export const main = async ( +const handler = async ( params: - | { name?: string } + | RoutePayload | DatabaseEventPayload> | CronPayload, ) => { const client = new Twenty(); // generated typed client - const name = 'name' in params - ? params.name ?? process.env.DEFAULT_RECIPIENT_NAME ?? 'Hello world' + const name = 'name' in params.queryStringParameters + ? params.queryStringParameters.name ?? process.env.DEFAULT_RECIPIENT_NAME ?? 'Hello world' : 'Hello world'; const result = await client.mutation({ @@ -410,14 +492,15 @@ export const main = async ( return result; }; -export const config: FunctionConfig = { - universalIdentifier: '', +export default defineFunction({ + universalIdentifier: 'e56d363b-0bdc-4d8a-a393-6f0d1c75bdcf', name: 'create-new-post-card', timeoutSeconds: 2, + handler, triggers: [ // Public HTTP route trigger '/s/post-card/create' { - universalIdentifier: '', + universalIdentifier: 'c9f84c8d-b26d-40d1-95dd-4f834ae5a2c6', type: 'route', path: '/post-card/create', httpMethod: 'GET', @@ -425,39 +508,137 @@ export const config: FunctionConfig = { }, // Cron trigger (CRON pattern) { - universalIdentifier: '', + universalIdentifier: 'dd802808-0695-49e1-98c9-d5c9e2704ce2', type: 'cron', pattern: '0 0 1 1 *', }, // Database event trigger { - universalIdentifier: '', + universalIdentifier: '203f1df3-4a82-4d06-a001-b8cf22a31156', type: 'databaseEvent', - eventName: 'person.created', + eventName: 'person.updated', + updatedFields: ['name'], }, ], +}); +``` + +一般的なトリガーの種類: + +* **route**: `/s/` エンドポイント配下で、HTTP パスとメソッドで関数を公開します: + +> 例: `path: '/post-card/create',` -> `/s/post-card/create` で呼び出し + +* **cron**: CRON 式を使用してスケジュールで関数を実行します。 +* **databaseEvent**: ワークスペースのオブジェクトのライフサイクルイベントで実行されます。 イベント操作が `updated` の場合、監視する特定のフィールドを `updatedFields` 配列で指定できます。 未定義または空のままにすると、任意の更新でも関数がトリガーされます。 + +> 例: `person.updated` + +注記: + +* `triggers` 配列は任意です。 トリガーのない関数は、他の関数から呼び出されるユーティリティ関数として使用できます。 +* 1 つの関数で複数のトリガータイプを組み合わせることができます。 + +### ルートトリガーのペイロード + + + **破壊的変更(v1.16、2026年1月):** ルートトリガーのペイロード形式が変更されました。 v1.16 以前は、クエリパラメーター、パスパラメーター、および body がペイロードとして直接送信されていました。 v1.16 以降は、それらは構造化された `RoutePayload` オブジェクト内にネストされます。 + + **v1.16 以前:** + + ```typescript + const handler = async (params) => { + const { param1, param2 } = params; // Direct access + }; + ``` + + **v1.16 以降:** + + ```typescript + const handler = async (event: RoutePayload) => { + const { param1, param2 } = event.body; // Access via .body + const { queryParam } = event.queryStringParameters; + const { id } = event.pathParameters; + }; + ``` + + **既存の関数を移行するには:** ハンドラーで、params オブジェクトから直接ではなく、`event.body`、`event.queryStringParameters`、または `event.pathParameters` から分割代入するように更新してください。 + + +ルートトリガーが関数を呼び出すと、AWS HTTP API v2 形式に準拠した `RoutePayload` オブジェクトを受け取ります。 型を `twenty-sdk` からインポートします: + +```typescript +import { defineFunction, type RoutePayload } from 'twenty-sdk'; + +const handler = async (event: RoutePayload) => { + // Access request data + const { headers, queryStringParameters, pathParameters, body } = event; + + // HTTP method and path are available in requestContext + const { method, path } = event.requestContext.http; + + return { message: 'Success' }; }; ``` -Common trigger types: +`RoutePayload` 型は次の構造になっています: -* route: Exposes your function on an HTTP path and method **under the `/s/` endpoint**: +| プロパティ | タイプ | 説明 | +| ---------------------------- | ------------------------------------- | ---------------------------------------------------------- | +| `headers` | `Record` | HTTP ヘッダー (`forwardedRequestHeaders` に列挙されたもののみ) | +| `queryStringParameters` | `Record` | クエリ文字列パラメーター (複数の値はカンマで連結) | +| `pathParameters` | `Record` | ルートパターンから抽出されたパスパラメーター (例: `/users/:id` → `{ id: '123' }`) | +| `本文` | `object \| null` | 解析済みのリクエストボディ (JSON) | +| `isBase64Encoded` | `ブール型` | body が base64 エンコードされているかどうか | +| `requestContext.http.method` | `string` | HTTP メソッド (GET, POST, PUT, PATCH, DELETE) | +| `requestContext.http.path` | `string` | 生のリクエストパス | -> e.g. `path: '/post-card/create',` -> call on `/s/post-card/create` +### HTTP ヘッダーの転送 -* cron: Runs your function on a schedule using a CRON expression. -* databaseEvent: Runs on workspace object lifecycle events +デフォルトでは、セキュリティ上の理由から、受信リクエストの HTTP ヘッダーはサーバーレス関数に**渡されません**。 特定のヘッダーにアクセスするには、`forwardedRequestHeaders` 配列に明示的に列挙してください: -> e.g. `person.created` +```typescript +export default defineFunction({ + universalIdentifier: 'e56d363b-0bdc-4d8a-a393-6f0d1c75bdcf', + name: 'webhook-handler', + handler, + triggers: [ + { + universalIdentifier: 'c9f84c8d-b26d-40d1-95dd-4f834ae5a2c6', + type: 'route', + path: '/webhook', + httpMethod: 'POST', + isAuthRequired: false, + forwardedRequestHeaders: ['x-webhook-signature', 'content-type'], + }, + ], +}); +``` -You can create new functions in two ways: +ハンドラー内で、これらのヘッダーにアクセスできます: -* **Scaffolded**: Run `yarn create-entity --path ` and choose the option to add a new function. This generates a starter file under `` with a `main` handler and a `config` block similar to the example above. -* **Manual**: Create a new file and export `main` and `config` yourself, following the same pattern. +```typescript +const handler = async (event: RoutePayload) => { + const signature = event.headers['x-webhook-signature']; + const contentType = event.headers['content-type']; -### Generated typed client + // Validate webhook signature... + return { received: true }; +}; +``` -Run yarn generate to create a local typed client in generated/ based on your workspace schema. Use it in your functions: + + ヘッダー名は小文字に正規化されます。 小文字のキーを使用してアクセスしてください (例: `event.headers['content-type']`)。 + + +新しい関数は次の 2 通りで作成できます: + +* **スキャフォルド**: `yarn app:create-entity` を実行し、新しい関数を追加するオプションを選択します。 これにより、ハンドラーと設定を備えたスターターファイルが生成されます。 +* **手動**: 新しい `*.function.ts` ファイルを作成し、同じパターンで `defineFunction()` を使用します。 + +### 生成された型付きクライアント + +ワークスペースのスキーマに基づき、generated/ にローカルの型付きクライアントを作成するには yarn app:generate を実行します。 関数内で使用します: ```typescript import Twenty from './generated'; @@ -466,34 +647,34 @@ const client = new Twenty(); const { me } = await client.query({ me: { id: true, displayName: true } }); ``` -The client is re-generated by `yarn generate`. Re-run after changing your objects and `yarn sync` or when onboarding to a new workspace. +このクライアントは `yarn app:generate` によって再生成されます。 オブジェクトを変更して `yarn app:sync` した後、または新しいワークスペースにオンボードする際には再実行してください。 -#### Runtime credentials in serverless functions +#### サーバーレス関数における実行時認証情報 -When your function runs on Twenty, the platform injects credentials as environment variables before your code executes: +関数が Twenty 上で実行されると、コードが実行される前に、プラットフォームが認証情報を環境変数として注入します: -* `TWENTY_API_URL`: Base URL of the Twenty API your app targets. -* `TWENTY_API_KEY`: Short‑lived key scoped to your application’s default function role. +* `TWENTY_API_URL`: アプリが対象とする Twenty API のベース URL。 +* `TWENTY_API_KEY`: アプリケーションのデフォルト関数ロールにスコープされた短命のキー。 -Notes: +ノート: -* You do not need to pass URL or API key to the generated client. It reads `TWENTY_API_URL` and `TWENTY_API_KEY` from process.env at runtime. -* The API key’s permissions are determined by the role referenced in your `application.config.ts` via `functionRoleUniversalIdentifier`. This is the default role used by serverless functions of your application. -* Applications can define roles to follow least‑privilege. Grant only the permissions your functions need, then point `functionRoleUniversalIdentifier` to that role’s universal identifier. +* 生成されたクライアントに URL や API キーを渡す必要はありません。 実行時に process.env から `TWENTY_API_URL` と `TWENTY_API_KEY` を読み取ります。 +* API キーの権限は、`application.config.ts` で `functionRoleUniversalIdentifier` によって参照されるロールによって決まります。 これは、アプリケーションのサーバーレス関数で使用されるデフォルトのロールです。 +* アプリケーションは、最小権限の原則に従うロールを定義できます。 関数に必要な権限のみを付与し、`functionRoleUniversalIdentifier` をそのロールのユニバーサル識別子に指定してください。 -### Hello World example +### Hello World の例 -Explore a minimal, end-to-end example that demonstrates objects, functions, and multiple triggers [here](https://github.com/twentyhq/twenty/tree/main/packages/twenty-apps/hello-world): +オブジェクト、関数、複数のトリガーを示す最小のエンドツーエンド例は[こちら](https://github.com/twentyhq/twenty/tree/main/packages/twenty-apps/hello-world)をご覧ください。 -## Manual setup (without the scaffolder) +## 手動セットアップ(スキャフォルダーなし) -While we recommend using `create-twenty-app` for the best getting-started experience, you can also set up a project manually. Do not install the CLI globally. Instead, add `twenty-sdk` as a local dependency and wire scripts in your package.json: +最適な導入体験のために `create-twenty-app` の使用を推奨しますが、手動でプロジェクトをセットアップすることもできます。 CLI をグローバルにインストールしないでください。 代わりに、`twenty-sdk` をローカル依存関係として追加し、package.json にスクリプトを設定します: ```bash filename="Terminal" yarn add -D twenty-sdk ``` -Then add scripts like these: +次のようなスクリプトを追加します: ```json filename="package.json" { @@ -510,13 +691,13 @@ Then add scripts like these: } ``` -Now you can run the same commands via Yarn, e.g. `yarn dev`, `yarn sync`, etc. +これで Yarn 経由で同じコマンド(例:`yarn app:dev`、`yarn app:sync` など)を実行できます。 -## Troubleshooting +## トラブルシューティング -* Authentication errors: run `yarn auth` and ensure your API key has the required permissions. -* Cannot connect to server: verify the API URL and that the Twenty server is reachable. -* Types or client missing/outdated: run `yarn generate` and then `yarn dev`. -* Dev mode not syncing: ensure `yarn dev` is running and that changes are not ignored by your environment. +* 認証エラー: `yarn auth:login` を実行し、API キーに必要な権限があることを確認してください。 +* サーバーに接続できません: API URL と、Twenty サーバーに到達可能であることを確認してください。 +* 型やクライアントがない/古い: `yarn app:generate` を実行してから `yarn app:dev` を実行してください。 +* 開発モードで同期されない: `yarn app:dev` が実行中であり、環境によって変更が無視されていないことを確認してください。 -Discord Help Channel: https://discord.com/channels/1130383047699738754/1130386664812982322 +Discord ヘルプチャンネル: https://discord.com/channels/1130383047699738754/1130386664812982322 diff --git a/packages/twenty-docs/l/ja/developers/extend/capabilities/webhooks.mdx b/packages/twenty-docs/l/ja/developers/extend/capabilities/webhooks.mdx index 6c2180e07c..6929d0c156 100644 --- a/packages/twenty-docs/l/ja/developers/extend/capabilities/webhooks.mdx +++ b/packages/twenty-docs/l/ja/developers/extend/capabilities/webhooks.mdx @@ -1,44 +1,44 @@ --- title: Webhooks -description: Receive real-time notifications when events occur in your CRM. +description: CRM でイベントが発生したときにリアルタイム通知を受信します。 --- import { VimeoEmbed } from '/snippets/vimeo-embed.mdx'; -Webhooks push data to your systems in real-time when events occur in Twenty — no polling required. Use them to keep external systems in sync, trigger automations, or send alerts. +ウェブフックは、Twenty でイベントが発生したときに、ポーリング不要でリアルタイムにお使いのシステムへデータをプッシュします。 外部システムとの同期を保ち、オートメーションをトリガーしたり、アラートを送信したりするために使用できます。 -## Create a Webhook +## Webhookを作成 -1. Go to **Settings → APIs & Webhooks → Webhooks** -2. Click **+ Create webhook** -3. Enter your webhook URL (must be publicly accessible) -4. Click **Save** +1. **Settings → APIs & Webhooks → Webhooks**に移動 +2. **+ Webhookを作成**をクリック +3. ウェブフックの URL を入力(外部からアクセス可能である必要があります) +4. **保存**をクリック -The webhook activates immediately and starts sending notifications. +ウェブフックは直ちに有効化され、通知の送信を開始します。 - + -### Manage Webhooks +### Webhookを管理 -**Edit**: Click the webhook → Update URL → **Save** +**編集**: ウェブフックをクリック → URL を更新 → **保存** -**Delete**: Click the webhook → **Delete** → Confirm +**削除**: ウェブフックをクリック → **削除** → 確認 -## Events +## イベント -Twenty sends webhooks for these event types: +Twenty は次のイベントタイプに対してウェブフックを送信します。 -| Event | Example | -| ------------------ | ---------------------------------------------------------- | -| **Record Created** | `person.created`, `company.created`, `note.created` | -| **Record Updated** | `person.updated`, `company.updated`, `opportunity.updated` | -| **Record Deleted** | `person.deleted`, `company.deleted` | +| イベント | 例 | +| ----------- | ---------------------------------------------------------- | +| **レコードの作成** | `person.created`, `company.created`, `note.created` | +| **レコードの更新** | `person.updated`, `company.updated`, `opportunity.updated` | +| **レコードの削除** | `person.deleted`, `company.deleted` | -All event types are sent to your webhook URL. Event filtering may be added in future releases. +すべてのイベントタイプはウェブフックの URL に送信されます。 イベントのフィルタリングは将来のリリースで追加される可能性があります。 -## Payload Format +## ペイロード形式 -Each webhook sends an HTTP POST with a JSON body: +各ウェブフックは JSON ボディを含む HTTP POST を送信します。 ```json { @@ -55,35 +55,35 @@ Each webhook sends an HTTP POST with a JSON body: } ``` -| Field | Description | -| ----------- | ------------------------------------------------ | -| `event` | What happened (e.g., `person.created`) | -| `data` | The full record that was created/updated/deleted | -| `timestamp` | When the event occurred (UTC) | +| フィールド | 説明 | +| --------- | --------------------------- | +| `イベント` | 何が起きたか(例: `person.created`) | +| `データ` | 作成/更新/削除された完全なレコード | +| `タイムスタンプ` | イベントが発生した時刻(UTC) | - Respond with a **2xx HTTP status** (200-299) to acknowledge receipt. Non-2xx responses are logged as delivery failures. + 受信を確認するために、**2xx HTTP ステータス**(200~299)で応答してください。 2xx 以外の応答は配信失敗として記録されます。 -## Webhook Validation +## ウェブフックの検証 -Twenty signs each webhook request for security. Validate signatures to ensure requests are authentic. +Twenty はセキュリティのために各ウェブフックリクエストに署名します。 リクエストが正当であることを確認するために署名を検証してください。 -### Headers +### ヘッダー -| Header | Description | -| ---------------------------- | --------------------- | -| `X-Twenty-Webhook-Signature` | HMAC SHA256 signature | -| `X-Twenty-Webhook-Timestamp` | Request timestamp | +| ヘッダー | 説明 | +| ---------------------------- | -------------- | +| `X-Twenty-Webhook-Signature` | HMAC SHA256 署名 | +| `X-Twenty-Webhook-Timestamp` | リクエストのタイムスタンプ | -### Validation Steps +### 検証手順 -1. Get the timestamp from `X-Twenty-Webhook-Timestamp` -2. Create the string: `{timestamp}:{JSON payload}` -3. Compute HMAC SHA256 using your webhook secret -4. Compare with `X-Twenty-Webhook-Signature` +1. `X-Twenty-Webhook-Timestamp` からタイムスタンプを取得 +2. 次の文字列を作成: `{timestamp}:{JSON payload}` +3. ウェブフックシークレットを使用して HMAC SHA256 を計算 +4. `X-Twenty-Webhook-Signature` と比較 -### Example (Node.js) +### 例(Node.js) ```javascript const crypto = require("crypto"); @@ -101,12 +101,12 @@ const expectedSignature = crypto const isValid = expectedSignature === req.headers["x-twenty-webhook-signature"]; ``` -## Webhooks vs Workflows +## ウェブフック vs ワークフロー -| Method | Direction | Use Case | -| ---------------------------- | --------- | ---------------------------------------------------------- | -| **Webhooks** | OUT | Automatically notify external systems of any record change | -| **Workflow + HTTP Request** | OUT | Send data out with custom logic (filters, transformations) | -| **Workflow Webhook Trigger** | IN | Receive data into Twenty from external systems | +| メソッド | 方向 | ユースケース | +| ----------------------- | --- | --------------------------- | +| **ウェブフック** | OUT | あらゆるレコード変更を外部システムへ自動通知 | +| **ワークフロー + HTTP リクエスト** | OUT | カスタムロジック(フィルター、変換)でデータを外部送信 | +| **ワークフローのウェブフックトリガー** | IN | 外部システムから Twenty にデータを受信 | -For receiving external data, see [Set Up a Webhook Trigger](/l/ja/user-guide/workflows/how-tos/connect-to-other-tools/set-up-a-webhook-trigger). +外部データの受信については、[Webhook トリガーを設定](/l/ja/user-guide/workflows/how-tos/connect-to-other-tools/set-up-a-webhook-trigger)を参照してください。 diff --git a/packages/twenty-docs/l/ja/developers/extend/extend.mdx b/packages/twenty-docs/l/ja/developers/extend/extend.mdx index 2f973d8002..c9f7a840c1 100644 --- a/packages/twenty-docs/l/ja/developers/extend/extend.mdx +++ b/packages/twenty-docs/l/ja/developers/extend/extend.mdx @@ -1,34 +1,34 @@ --- -title: Extend -description: Extend Twenty's functionality with APIs, webhooks, and custom apps. +title: 拡張 +description: API、Webhook、カスタムアプリで Twenty の機能を拡張できます。 --- AI -## Overview +## 概要 -Twenty is designed to be extensible. Use our APIs, webhooks, and app framework to integrate with your existing tools and build custom functionality. +Twenty は拡張性を念頭に設計されています。 当社の API、Webhook、アプリフレームワークを使用して既存のツールと統合し、カスタム機能を構築できます。 -## What You Can Do +## 現在できること -* **APIs**: Query and modify your CRM data programmatically using REST or GraphQL -* **Webhooks**: Receive real-time notifications when events occur in Twenty -* **Apps**: Build custom applications that extend Twenty's capabilities - Coming soon! +* **API**: REST または GraphQL を使用して、プログラムから CRM データをクエリおよび変更します。 +* **ウェブフック**: Twenty でイベントが発生したときにリアルタイム通知を受信します。 +* **アプリ**: Twenty の機能を拡張するカスタムアプリケーションを構築 - 近日公開! -## Getting Started +## 始めに - - Connect to Twenty programmatically + + プログラムから Twenty に接続 - - Get notified of events in real-time + + イベントの通知をリアルタイムで受け取る - - Build customizations as code (Alpha) + + カスタマイズをコードとして構築(アルファ版) diff --git a/packages/twenty-docs/l/ja/developers/introduction.mdx b/packages/twenty-docs/l/ja/developers/introduction.mdx index 7bc187d2d1..3f257bc250 100644 --- a/packages/twenty-docs/l/ja/developers/introduction.mdx +++ b/packages/twenty-docs/l/ja/developers/introduction.mdx @@ -1,5 +1,5 @@ --- -title: Getting Started +title: 始めに description: Welcome to Twenty Developer Documentation, your resources for extending, self-hosting, and contributing to Twenty. --- diff --git a/packages/twenty-docs/l/ja/developers/self-host/capabilities/cloud-providers.mdx b/packages/twenty-docs/l/ja/developers/self-host/capabilities/cloud-providers.mdx index 809388612a..d5e2db0b91 100644 --- a/packages/twenty-docs/l/ja/developers/self-host/capabilities/cloud-providers.mdx +++ b/packages/twenty-docs/l/ja/developers/self-host/capabilities/cloud-providers.mdx @@ -1,45 +1,46 @@ --- -title: Other methods +title: その他の方法 --- - This document is maintained by the community. It might contain issues. + このドキュメントはコミュニティによって管理されています。 問題を含む可能性があります。 + 問題を含む可能性があります。 -## Kubernetes via Terraform and Manifests +## Terraformとマニフェストを通したKubernetes -Community-led documentation for Kubernetes deployment is available [here](https://github.com/twentyhq/twenty/tree/main/packages/twenty-docker/k8s) +Kubernetesデプロイメントに関するコミュニティ主導のドキュメントは[こちら](https://github.com/twentyhq/twenty/tree/main/packages/twenty-docker/k8s)です。 ### Coolify -Deploy Twenty on servers using Coolify. (official image on Coolify will be available soon) +Coolifyを使用してサーバーにTwentyをデプロイします。 (Coolify上の公式イメージは近日公開予定です) (Coolify上の公式イメージは近日公開予定です) -[Coolify documentation](https://coolify.io/docs/get-started/introduction) +[Coolifyのドキュメント](https://coolify.io/docs/get-started/introduction) ### EasyPanel -Deploy Twenty on EasyPanel with the community maintained template below. +以下のコミュニティ維持テンプレートを使用して、EasyPanelにTwentyをデプロイします。 -[Deploy on EasyPanel](https://easypanel.io/docs/templates/twenty) +以下のコミュニティ維持テンプレートを使用して、EasyPanelにTwentyをデプロイします。 ### Elest.io -Deploy Twenty on servers with Elest.io using link below. +以下のリンクを使用して、Elest.ioにTwentyをサーバー上にデプロイします。 -[Deploy on Elest.io](https://elest.io/open-source/twenty) +[Elest.ioにデプロイする](https://elest.io/open-source/twenty) -### Twenty on Railway +### Railway上のTwenty -Deploy Twenty on Railway with the community maintained template below. +以下のコミュニティ維持テンプレートを使用して、RailwayにTwentyをデプロイします。 -[![Deploy on Railway](https://railway.com/button.svg)](https://railway.com/deploy/nAL3hA) +[![Railwayにデプロイする](https://railway.com/button.svg)](https://railway.com/deploy/nAL3hA) -### Twenty on Sealos +### Sealos上のTwenty -Deploy Twenty on Sealos with the community maintained template below. +以下のコミュニティがメンテナンスしているテンプレートを使用して、SealosにTwentyをデプロイします。 -[![Deploy on Sealos](https://sealos.io/Deploy-on-Sealos.svg)](https://sealos.io/products/app-store/twenty) +[![Sealosにデプロイする](https://sealos.io/Deploy-on-Sealos.svg)](https://sealos.io/products/app-store/twenty) -## Others +## その他 -Please feel free to Open a PR to add more Cloud Provider options. +もっと多くのクラウドプロバイダーオプションを追加するために、PRを自由に作成してください。 diff --git a/packages/twenty-docs/l/ja/developers/self-host/capabilities/docker-compose.mdx b/packages/twenty-docs/l/ja/developers/self-host/capabilities/docker-compose.mdx index 1c59a9b1f0..44b1de451b 100644 --- a/packages/twenty-docs/l/ja/developers/self-host/capabilities/docker-compose.mdx +++ b/packages/twenty-docs/l/ja/developers/self-host/capabilities/docker-compose.mdx @@ -1,253 +1,253 @@ --- -title: 1-Click w/ Docker Compose +title: 1-クリック w/ Docker Compose --- - Docker containers are for production hosting or self-hosting, for the contribution please check the [Local Setup](/l/ja/developers/contribute/capabilities/local-setup). + Dockerコンテナは本番ホスティングまたはセルフホスティング用です。貢献するには、[ローカルセットアップ](/l/ja/developers/contribute/capabilities/local-setup)を確認してください。 -## Overview +## 概要 -This guide provides step-by-step instructions to install and configure the Twenty application using Docker Compose. The aim is to make the process straightforward and prevent common pitfalls that could break your setup. +このガイドは、Docker Composeを使用してTwentyアプリケーションをインストールおよび構成するためのステップバイステップの手順を提供します。 プロセスを簡単にし、設定を破壊する可能性のある一般的な落とし穴を防止することが目的です。 プロセスを簡単にし、設定を破壊する可能性のある一般的な落とし穴を防止することが目的です。 プロセスを簡単にし、設定を破壊する可能性のある一般的な落とし穴を防止することが目的です。 プロセスを簡単にし、設定を破壊する可能性のある一般的な落とし穴を防止することが目的です。 -**Important:** Only modify settings explicitly mentioned in this guide. Altering other configurations may lead to issues. +**重要:** このガイドで明示的に言及されている設定のみを変更してください。 他の構成を変更すると、問題が発生する可能性があります。 他の構成を変更すると、問題が発生する可能性があります。 他の構成を変更すると、問題が発生する可能性があります。 -See docs [Setup Environment Variables](/l/ja/developers/self-host/capabilities/setup) for advanced configuration. All environment variables must be declared in the docker-compose.yml file at the server and / or worker level depending on the variable. +高度な構成については、[環境変数の設定](/l/ja/developers/self-host/capabilities/setup)を参照してください。 高度な構成については、[環境変数の設定](https://docs.twenty.com/l/ja/developers/self-hosting/setup)を参照してください。 高度な構成については、[環境変数の設定](https://docs.twenty.com/l/ja/developers/self-hosting/setup)を参照してください。 すべての環境変数は、サーバーレベルまたはワーカーレベルでdocker-compose.ymlファイルに宣言する必要があります。 -## System Requirements +## システム要件 -* RAM: Ensure your environment has at least 2GB of RAM. Insufficient memory can cause processes to crash. -* Docker & Docker Compose: Make sure both are installed and up-to-date. +* RAM: 環境に最低2GBのRAMがあることを確認してください。 メモリが不足するとプロセスがクラッシュすることがあります。 メモリが不足するとプロセスがクラッシュすることがあります。 メモリが不足するとプロセスがクラッシュすることがあります。 メモリが不足するとプロセスがクラッシュすることがあります。 メモリが不足するとプロセスがクラッシュすることがあります。 メモリが不足するとプロセスがクラッシュすることがあります。 メモリが不足するとプロセスがクラッシュすることがあります。 +* Docker & Docker Compose: 両方がインストールされ、最新であることを確認してください。 -## Option 1: One-line script +## オプション 1: ワンラインスクリプト -Install the latest stable version of Twenty with a single command: +単一のコマンドで最新版のTwentyをインストールします: ```bash bash <(curl -sL https://raw.githubusercontent.com/twentyhq/twenty/main/packages/twenty-docker/scripts/install.sh) ``` -To install a specific version or branch: +特定のバージョンまたはブランチをインストールするには: ```bash VERSION=vx.y.z BRANCH=branch-name bash <(curl -sL https://raw.githubusercontent.com/twentyhq/twenty/main/packages/twenty-docker/scripts/install.sh) ``` -* Replace x.y.z with the desired version number. -* Replace branch-name with the name of the branch you want to install. +* x.y.zを希望するバージョン番号に置き換えます。 +* branch-nameをインストールしたいブランチの名前に置き換えます。 -## Option 2: Manual steps +## オプション 2: 手動の手順 -Follow these steps for a manual setup. +マニュアルセットアップには、これらの手順に従ってください。 -### Step 1: Set Up the Environment File +### ステップ 1: 環境ファイルを設定 -1. **Create the .env File** +1. **.env ファイルを作成** - Copy the example environment file to a new .env file in your working directory: + 例の環境ファイルを作業ディレクトリに新しい.envファイルとしてコピーします: ```bash curl -o .env https://raw.githubusercontent.com/twentyhq/twenty/refs/heads/main/packages/twenty-docker/.env.example ``` -2. **Generate Secret Tokens** +2. **シークレットトークンを生成** - Run the following command to generate a unique random string: + ユニークなランダム文字列を生成するには、次のコマンドを実行します: ```bash openssl rand -base64 32 ``` - **Important:** Keep this value secret / do not share it. + **重要:** この値を秘密にしてください/共有しないでください。 -3. **Update the `.env`** +3. **`.env`を更新** - Replace the placeholder value in your .env file with the generated token: + 生成したトークンで.envファイルのプレースホルダー値を置き換えます: ```ini APP_SECRET=first_random_string ``` -4. **Set the Postgres Password** +4. **Postgres パスワードを設定** - Update the `PG_DATABASE_PASSWORD` value in the .env file with a strong password without special characters. + 特殊文字を含まない強力なパスワードで、.envファイルの`PG_DATABASE_PASSWORD`値を更新します。 ```ini PG_DATABASE_PASSWORD=my_strong_password ``` -### Step 2: Obtain the Docker Compose File +### ステップ 2: Docker Compose ファイルを取得 -Download the `docker-compose.yml` file to your working directory: +作業ディレクトリに`docker-compose.yml`ファイルをダウンロードします: ```bash curl -o docker-compose.yml https://raw.githubusercontent.com/twentyhq/twenty/refs/heads/main/packages/twenty-docker/docker-compose.yml ``` -### Step 3: Launch the Application +### ステップ 3: アプリケーションを起動 -Start the Docker containers: +Dockerコンテナを開始します: ```bash docker compose up -d ``` -### Step 4: Access the Application +### ステップ 4: アプリケーションにアクセス -If you host twentyCRM on your own computer, open your browser and navigate to [http://localhost:3000](http://localhost:3000). +自分のコンピュータでtwentyCRMをホストしている場合は、ブラウザを開いて[http://localhost:3000](http://localhost:3000)にアクセスします。 -If you host it on a server, check that the server is running and that everything is ok with +サーバーでホストしている場合、サーバーが稼働していてすべてが正常であるかを確認してください ```bash curl http://localhost:3000 ``` -## Configuration +## 構成 -### Expose Twenty to External Access +### Twentyを外部アクセスに公開 -By default, Twenty runs on `localhost` at port `3000`. To access it via an external domain or IP address, you need to configure the `SERVER_URL` in your `.env` file. +デフォルトでは、Twentyはポート`3000`で`localhost`上で動作します。 外部ドメインまたはIPアドレス経由でアクセスするには、`.env`ファイルで`SERVER_URL`を構成する必要があります。 外部ドメインまたはIPアドレス経由でアクセスするには、`.env`ファイルで`SERVER_URL`を構成する必要があります。 -#### Understanding `SERVER_URL` +#### `SERVER_URL`の理解 -* **Protocol:** Use `http` or `https` depending on your setup. - * Use `http` if you haven't set up SSL. - * Use `https` if you have SSL configured. -* **Domain/IP:** This is the domain name or IP address where your application is accessible. -* **Port:** Include the port number if you're not using the default ports (`80` for `http`, `443` for `https`). +* **プロトコル:** 設定に応じて`http`または`https`を使用します。 + * SSLを設定していない場合は`http`を使用します。 + * SSLを構成済みの場合は`https`を使用します。 +* **ドメイン/IP:** これは、アプリケーションがアクセス可能なドメイン名またはIPアドレスです。 +* **ポート:** デフォルトのポート(`http`は`80`、`https`は`443`)以外を使用している場合、ポート番号を含めます。 -### SSL Requirements +### SSL 要件 -SSL (HTTPS) is required for certain browser features to work properly. While these features might work during local development (as browsers treat localhost differently), a proper SSL setup is needed when hosting Twenty on a regular domain. +SSL(HTTPS)は、特定のブラウザ機能が正しく動作するために必要です。 SSL(HTTPS)は、特定のブラウザ機能が正しく動作するために必要です。 SSL(HTTPS)は、特定のブラウザ機能が正しく動作するために必要です。 これらの機能は、ローカル開発中に動作するかもしれませんが(ブラウザがlocalhostを異なる扱い方をするため)、Twentyを通常のドメインでホスティングする場合、適切なSSLの設定が必要です。 -For example, the clipboard API might require a secure context - some features like copy buttons throughout the application might not work without HTTPS enabled. +たとえば、クリップボードAPIは安全なコンテキストが必要かもしれません - アプリケーション全体でのコピー ボタンのような機能は、HTTPSが有効でないと動作しないかもしれません。 -We strongly recommend setting up Twenty behind a reverse proxy with SSL termination for optimal security and functionality. +最適なセキュリティと機能のために、SSL終了を備えたリバースプロキシの背後にTwentyを設定することを強くお勧めします。 -#### Configuring `SERVER_URL` +#### `SERVER_URL`の構成 -1. **Determine Your Access URL** - * **Without Reverse Proxy (Direct Access):** +1. **アクセスURLを特定する** + * **リバースプロキシがない場合(直接アクセス):** - If you're accessing the application directly without a reverse proxy: + リバースプロキシなしでアプリケーションに直接アクセスする場合: ```ini SERVER_URL=http://your-domain-or-ip:3000 ``` - * **With Reverse Proxy (Standard Ports):** + * **リバースプロキシを使用する場合(標準ポート):** - If you're using a reverse proxy like Nginx or Traefik and have SSL configured: + NginxやTraefikのようなリバースプロキシを使用し、SSLを構成している場合: ```ini SERVER_URL=https://your-domain-or-ip ``` - * **With Reverse Proxy (Custom Ports):** + * **リバースプロキシを使用する場合(カスタムポート):** - If you're using non-standard ports: + 標準以外のポートを使用している場合: ```ini SERVER_URL=https://your-domain-or-ip:custom-port ``` -2. **Update the `.env` File** +2. **.env ファイルを更新** - Open your `.env` file and update the `SERVER_URL`: + .env`ファイルを開き、`SERVER_URL\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\`を更新します: ```ini SERVER_URL=http(s)://your-domain-or-ip:your-port ``` - **Examples:** + **例:** - * Direct access without SSL: + * SSLなしの直接アクセス: ```ini SERVER_URL=http://123.45.67.89:3000 ``` - * Access via domain with SSL: + * ドメイン経由でSSLを使用してアクセス: ```ini SERVER_URL=https://mytwentyapp.com ``` -3. **Restart the Application** +3. **アプリケーションを再起動** - For changes to take effect, restart the Docker containers: + 変更を反映するために、Dockerコンテナを再起動します: ```bash docker compose down docker compose up -d ``` -#### Considerations +#### 考慮事項 -* **Reverse Proxy Configuration:** +* **リバースプロキシ構成:** - Ensure your reverse proxy forwards requests to the correct internal port (`3000` by default). Configure SSL termination and any necessary headers. + リバースプロキシが正しい内部ポート(デフォルトでは`3000`)にリクエストを転送することを確認してください。 SSL終端と必要なヘッダーを設定します。 SSL終端と必要なヘッダーを設定します。 SSL終端と必要なヘッダーを設定します。 -* **Firewall Settings:** +* **ファイアウォール設定:** - Open necessary ports in your firewall to allow external access. + 外部アクセスを許可するためにファイアウォールで必要なポートを開けます。 -* **Consistency:** +* **一貫性:** - The `SERVER_URL` must match how users access your application in their browsers. + `SERVER_URL`は、ユーザーがブラウザでアプリケーションにアクセスする方法と一致する必要があります。 -#### Persistence +#### 永続性 -* **Data Volumes:** +* **データボリューム:** - The Docker Compose configuration uses volumes to persist data for the database and server storage. + Docker Compose 構成では、データベースとサーバーストレージのデータを永続化するためにボリュームを使用します。 -* **Stateless Environments:** +* **ステートレス環境:** - If deploying to a stateless environment (e.g., certain cloud services), configure external storage to persist data. + ステートレス環境(例: 一部のクラウドサービス)に展開する場合、データを永続化するために外部ストレージを設定します。 -## Backup and Restore +## バックアップと復元 -Regular backups protect your CRM data from loss. +定期的なバックアップは、CRM データを損失から保護します。 -### Create a Database Backup +### データベースのバックアップを作成 ```bash docker exec twenty-postgres pg_dump -U postgres twenty > backup_$(date +%Y%m%d).sql ``` -### Automate Daily Backups +### 日次バックアップを自動化 -Add to your crontab (`crontab -e`): +crontab に追加 (`crontab -e`): ```bash 0 2 * * * docker exec twenty-postgres pg_dump -U postgres twenty > /backups/twenty_$(date +\%Y\%m\%d).sql ``` -### Restore from Backup +### バックアップから復元 -1. Stop the application: +1. アプリケーションを停止します: ```bash docker compose stop twenty-server twenty-front ``` -2. Restore the database: +2. データベースを復元します: ```bash docker exec -i twenty-postgres psql -U postgres twenty < backup_20240115.sql ``` -3. Restart services: +3. サービスの再起動: ```bash docker compose up -d ``` -### Backup Best Practices +### バックアップのベストプラクティス -* **Test restores regularly** — verify backups actually work -* **Store backups off-site** — use cloud storage (S3, GCS, etc.) -* **Encrypt sensitive data** — protect backups with encryption -* **Retain multiple copies** — keep daily, weekly, and monthly backups +* **復元を定期的にテスト** — バックアップが実際に機能することを確認 +* **バックアップをオフサイトに保管** — クラウドストレージ (S3, GCS など) を使用 +* **機密データを暗号化** — バックアップを暗号化で保護 +* **複数のコピーを保持** — 日次・週次・月次のバックアップを保持 -## Troubleshooting +## トラブルシューティング -If you encounter any problem, check [Troubleshooting](/l/ja/developers/self-host/capabilities/troubleshooting) for solutions. +問題が発生した場合は、[トラブルシューティング](/l/ja/developers/self-host/capabilities/troubleshooting)を確認して解決策を見つけてください。 diff --git a/packages/twenty-docs/l/ja/developers/self-host/capabilities/setup.mdx b/packages/twenty-docs/l/ja/developers/self-host/capabilities/setup.mdx index adfd285e70..972b7903a4 100644 --- a/packages/twenty-docs/l/ja/developers/self-host/capabilities/setup.mdx +++ b/packages/twenty-docs/l/ja/developers/self-host/capabilities/setup.mdx @@ -1,146 +1,148 @@ --- -title: Setup +title: セットアップ --- -# Configuration Management +# 構成管理 - **First time installing?** Follow the [Docker Compose installation guide](/l/ja/developers/self-host/capabilities/docker-compose) to get Twenty running, then return here for configuration. + **初めてインストールしますか?** [Docker Compose インストールガイド](/l/ja/developers/self-host/capabilities/docker-compose)に従ってTwentyを起動し、その後はここに戻り構成してください。 -Twenty offers **two configuration modes** to suit different deployment needs: +Twentyは、異なる展開ニーズに合わせて**2つの構成モード**を提供します: -**Admin panel access:** Only users with admin privileges (`canAccessFullAdminPanel: true`) can access the configuration interface. +**管理パネルアクセス:** 管理者権限を持つユーザーだけが (`canAccessFullAdminPanel: true`) 構成インターフェースにアクセスできます。 -## 1. Admin Panel Configuration (Default) +## 1. 管理パネル構成(デフォルト) ```bash IS_CONFIG_VARIABLES_IN_DB_ENABLED=true # default ``` -**Most configuration happens through the UI** after installation: +**ほとんどの構成は、インストール後にUIを通じて行われます。** -1. Access your Twenty instance (usually `http://localhost:3000`) -2. Go to **Settings / Admin Panel / Configuration Variables** -3. Configure integrations, email, storage, and more -4. Changes take effect immediately (within 15 seconds for multi-container deployments) +1. Twentyインスタンスにアクセスしてください (通常は `http://localhost:3000`) +2. **設定 / 管理パネル / 構成変数**に移動 +3. 統合、メール、ストレージなどを構成します +4. 変更はすぐに(マルチコンテナ展開の場合、15秒以内に)効果が出ます。 - **Multi-Container Deployments:** When using database configuration (`IS_CONFIG_VARIABLES_IN_DB_ENABLED=true`), both server and worker containers read from the same database. Admin panel changes affect both automatically, eliminating the need to duplicate environment variables between containers (except for infrastructure variables). + **マルチコンテナ展開:** データベース構成を使用する場合 (`IS_CONFIG_VARIABLES_IN_DB_ENABLED=true`)、サーバーとワーカーコンテナの両方が同じデータベースから読み込みます。 管理パネルの変更は両方に自動的に影響し、コンテナ間で環境変数を重複させる必要がなくなります(インフラストラクチャの変数を除く)。 + 管理パネルの変更は両方に自動的に影響し、コンテナ間で環境変数を重複させる必要がなくなります(インフラストラクチャの変数を除く)。 -**What you can configure through the admin panel:** +**管理パネルを通じて構成できること:** -* **Authentication** - Google/Microsoft OAuth, password settings -* **Email** - SMTP settings, templates, verification -* **Storage** - S3 configuration, local storage paths -* **Integrations** - Gmail, Google Calendar, Microsoft services -* **Workflow & Rate Limiting** - Execution limits, API throttling -* **And much more...** +* **認証** - Google/Microsoft OAuth、パスワード設定 +* **メール** - SMTP設定、テンプレート、検証 +* **ストレージ** - S3構成、ローカルストレージパス +* **統合** - Gmail、Googleカレンダー、Microsoftサービス +* **ワークフローとレート制限** - 実行制限、APIスロットリング +* **さらに多くのこと...** -![Admin Panel Configuration Variables](/images/user-guide/setup/admin-panel-config-variables.png) +![管理パネル構成変数](/images/user-guide/setup/admin-panel-config-variables.png) - Each variable is documented with descriptions in your admin panel at **Settings → Admin Panel → Configuration Variables**. - Some infrastructure settings like database connections (`PG_DATABASE_URL`), server URLs (`SERVER_URL`), and app secrets (`APP_SECRET`) can only be configured via `.env` file. + 各変数は、**設定 → 管理パネル → 構成変数** で説明付きでドキュメント化されています。 + 各変数は、**設定 → 管理パネル → 構成変数** で説明付きでドキュメント化されています。 + データベース接続 (`PG_DATABASE_URL`)、サーバーURL (`SERVER_URL`)、アプリの秘密キー (`APP_SECRET`) など、一部のインフラ設定は `.env` ファイルを介してのみ構成可能です。 - [Complete technical reference →](https://github.com/twentyhq/twenty/blob/main/packages/twenty-server/src/engine/core-modules/twenty-config/config-variables.ts) + [ 完全な技術リファレンス →](https://github.com/twentyhq/twenty/blob/main/packages/twenty-server/src/engine/core-modules/twenty-config/config-variables.ts) -## 2. Environment-Only Configuration +## 2. 環境のみの構成 ```bash IS_CONFIG_VARIABLES_IN_DB_ENABLED=false ``` -**All configuration managed through `.env` files:** +**すべての構成が `.env` ファイルで管理されます:** -1. Set `IS_CONFIG_VARIABLES_IN_DB_ENABLED=false` in your `.env` file -2. Add all configuration variables to your `.env` file -3. Restart containers for changes to take effect -4. Admin panel will show current values but cannot modify them +1. `.env` ファイル内で `IS_CONFIG_VARIABLES_IN_DB_ENABLED=false` を設定 +2. すべての構成変数を `.env` ファイルに追加 +3. 変更を有効にするためにコンテナを再起動してください +4. 管理パネルは現在の値を表示しますが、修正はできません -## Multi-Workspace Mode +## マルチワークスペースモード -By default, Twenty runs in **single-workspace mode** — ideal for most self-hosted deployments where you need one CRM instance for your organization. +デフォルトでは、Twenty は**シングルワークスペースモード**で動作します—組織向けに 1 つの CRM インスタンスが必要な多くのセルフホスト型デプロイメントに最適です。 -### Single-Workspace Mode (Default) +### シングルワークスペースモード(デフォルト) ```bash IS_MULTIWORKSPACE_ENABLED=false # default ``` -* One workspace per Twenty instance -* First user automatically becomes admin with full privileges (`canImpersonate` and `canAccessFullAdminPanel`) -* New signups are disabled after the first workspace is created -* Simple URL structure: `https://your-domain.com` +* Twenty の各インスタンスにつき 1 つのワークスペース +* 最初のユーザーは自動的にフル権限の管理者になります(`canImpersonate` と `canAccessFullAdminPanel`) +* 最初のワークスペース作成後は新規サインアップが無効になります +* シンプルな URL 構造: `https://your-domain.com` -### Enabling Multi-Workspace Mode +### マルチワークスペースモードの有効化 ```bash IS_MULTIWORKSPACE_ENABLED=true DEFAULT_SUBDOMAIN=app # default value ``` -Enable multi-workspace mode for SaaS-like deployments where multiple independent teams need their own workspaces on the same Twenty instance. +同一の Twenty インスタンス上で複数の独立したチームがそれぞれのワークスペースを必要とする、SaaS のようなデプロイメント向けにマルチワークスペースモードを有効にします。 -**Key differences from single-workspace mode:** +**シングルワークスペースモードとの主な違い:** -* Multiple workspaces can be created on the same instance -* Each workspace gets its own subdomain (e.g., `sales.your-domain.com`, `marketing.your-domain.com`) -* Users sign up and log in at `{DEFAULT_SUBDOMAIN}.your-domain.com` (e.g., `app.your-domain.com`) -* No automatic admin privileges — first user in each workspace is a regular user -* Workspace-specific settings like subdomain and custom domain become available in workspace settings +* 同一インスタンス上に複数のワークスペースを作成できます +* 各ワークスペースに専用のサブドメインが割り当てられます(例: `sales.your-domain.com`、`marketing.your-domain.com`) +* ユーザーは `{DEFAULT_SUBDOMAIN}.your-domain.com` でサインアップおよびログインします(例: `app.your-domain.com`) +* 管理者権限は自動付与されません—各ワークスペースの最初のユーザーは一般ユーザーです +* サブドメインやカスタムドメインなどのワークスペース固有の設定がワークスペース設定で利用可能になります - **Environment-only setting:** `IS_MULTIWORKSPACE_ENABLED` can only be configured via `.env` file and requires a restart. It cannot be changed through the admin panel. + **環境専用の設定:** `IS_MULTIWORKSPACE_ENABLED` は `.env` ファイルでのみ設定でき、再起動が必要です。 管理パネルからは変更できません。 -### DNS Configuration for Multi-Workspace +### マルチワークスペース向けの DNS 構成 -When using multi-workspace mode, configure your DNS with a wildcard record to allow dynamic subdomain creation: +マルチワークスペースモードを使用する場合、動的なサブドメイン作成を可能にするために、ワイルドカードレコードで DNS を構成してください: ``` *.your-domain.com -> your-server-ip ``` -This enables automatic subdomain routing for new workspaces without manual DNS configuration. +これにより、手動の DNS 構成なしで新規ワークスペースへのサブドメインルーティングが自動化されます。 -### Restricting Workspace Creation +### ワークスペース作成の制限 -In multi-workspace mode, you may want to limit who can create new workspaces: +マルチワークスペースモードでは、新しいワークスペースを作成できるユーザーを制限したい場合があります: ```bash IS_WORKSPACE_CREATION_LIMITED_TO_SERVER_ADMINS=true ``` -When enabled, only users with `canAccessFullAdminPanel` can create additional workspaces. Users can still create their first workspace during initial signup. +有効にすると、`canAccessFullAdminPanel` を持つユーザーのみが追加のワークスペースを作成できます。 初回サインアップ時には、ユーザーは引き続き最初のワークスペースを作成できます。 -## Gmail & Google Calendar Integration +## Gmail & Googleカレンダー統合 -### Create Google Cloud Project +### Google Cloudプロジェクトを作成 -1. Go to [Google Cloud Console](https://console.cloud.google.com/) -2. Create a new project or select existing one -3. Enable these APIs: +1. [Google Cloud Console](https://console.cloud.google.com/) にアクセス +2. 新しいプロジェクトを作成するか既存のプロジェクトを選択 +3. 以下のAPIを有効にします: * [Gmail API](https://console.cloud.google.com/apis/library/gmail.googleapis.com) -* [Google Calendar API](https://console.cloud.google.com/apis/library/calendar-json.googleapis.com) +* [GoogleカレンダーAPI](https://console.cloud.google.com/apis/library/calendar-json.googleapis.com) * [People API](https://console.cloud.google.com/apis/library/people.googleapis.com) -### Configure OAuth +### OAuthの構成 -1. Go to [Credentials](https://console.cloud.google.com/apis/credentials) -2. Create OAuth 2.0 Client ID -3. Add these redirect URIs: - * `https://{your-domain}/auth/google/redirect` (for SSO) - * `https://{your-domain}/auth/google-apis/get-access-token` (for integrations) +1. [資格情報](https://console.cloud.google.com/apis/credentials)にアクセス +2. OAuth 2.0 クライアントIDを作成 +3. 次のリダイレクトURIを追加: + * `https://{your-domain}/auth/google/redirect` (SSO用) + * `https://{your-domain}/auth/google-apis/get-access-token` (統合用) -### Configure in Twenty +### Twentyで構成 -1. Go to **Settings → Admin Panel → Configuration Variables** -2. Find the **Google Auth** section -3. Set these variables: +1. **設定 → 管理パネル → 構成変数** に移動 +2. **Google Auth** セクションを見つけます +3. 次の変数を設定: * `MESSAGING_PROVIDER_GMAIL_ENABLED=true` * `CALENDAR_PROVIDER_GOOGLE_ENABLED=true` * `AUTH_GOOGLE_CLIENT_ID={client-id}` @@ -149,35 +151,35 @@ When enabled, only users with `canAccessFullAdminPanel` can create additional wo * `AUTH_GOOGLE_APIS_CALLBACK_URL=https://{your-domain}/auth/google-apis/get-access-token` - **Environment-only mode:** If you set `IS_CONFIG_VARIABLES_IN_DB_ENABLED=false`, add these variables to your `.env` file instead. + **環境専用モード:** `IS_CONFIG_VARIABLES_IN_DB_ENABLED=false` を設定した場合、これらの変数を `.env` ファイルに追加してください。 -**Required scopes** (automatically configured): -[See relevant source code](https://github.com/twentyhq/twenty/blob/main/packages/twenty-server/src/engine/core-modules/auth/utils/get-google-apis-oauth-scopes.ts#L4-L10) +**必要なスコープ** (自動的に構成される): +[関連ソースコードを見る](https://github.com/twentyhq/twenty/blob/main/packages/twenty-server/src/engine/core-modules/auth/utils/get-google-apis-oauth-scopes.ts#L4-L10) * `https://www.googleapis.com/auth/calendar.events` * `https://www.googleapis.com/auth/gmail.readonly` * `https://www.googleapis.com/auth/profile.emails.read` -### If your app is in test mode +### アプリがテストモードの場合 -If your app is in test mode, you will need to add test users to your project. +アプリがテストモードの場合、プロジェクトにテストユーザーを追加する必要があります。 -Under [OAuth consent screen](https://console.cloud.google.com/apis/credentials/consent), add your test users to the "Test users" section. +[OAuth 同意画面](https://console.cloud.google.com/apis/credentials/consent)で、「テストユーザー」セクションにテストユーザーを追加してください。 -## Microsoft 365 Integration +## Microsoft 365 統合 - Users must have a [Microsoft 365 Licence](https://admin.microsoft.com/Adminportal/Home) to be able to use the Calendar and Messaging API. They will not be able to sync their account on Twenty without one. + カレンダーおよびメッセージングAPIを使用するためには、[Microsoft 365 ライセンス](https://admin.microsoft.com/Adminportal/Home)が必要です。 They will not be able to sync their account on Twenty without one. それがない場合、Twenty でアカウントを同期できません。 -### Create a project in Microsoft Azure +### Microsoft Azureでプロジェクトを作成 -You will need to create a project in [Microsoft Azure](https://portal.azure.com/#view/Microsoft_AAD_IAM/AppGalleryBladeV2) and get the credentials. +[Microsoft Azure](https://portal.azure.com/#view/Microsoft_AAD_IAM/AppGalleryBladeV2)でプロジェクトを作成し、資格情報を取得してください。 -### Enable APIs +### APIを有効にする -On Microsoft Azure Console enable the following APIs in "Permissions": +Microsoft Azureコンソールで"権限"の欄で以下のAPIを有効にします: * Microsoft Graph: Mail.ReadWrite * Microsoft Graph: Mail.Send @@ -188,20 +190,20 @@ On Microsoft Azure Console enable the following APIs in "Permissions": * Microsoft Graph: profile * Microsoft Graph: offline_access -Note: "Mail.ReadWrite" and "Mail.Send" are only mandatory if you want to send emails using our workflow actions. You can use "Mail.Read" instead if you only want to receive emails. +注: "Mail.ReadWrite" と "Mail.Send" は、ワークフローアクションを使用してメールを送信する場合に必須です。 メールを受信するだけの場合は、"Mail.Read"を使用できます。 メールを受信するだけの場合は、"Mail.Read"を使用できます。 メールを受信するだけの場合は、"Mail.Read"を使用できます。 -### Authorized redirect URIs +### 認証されたリダイレクトURI -You need to add the following redirect URIs to your project: +プロジェクトに次のリダイレクトURIを追加する必要があります: -* `https://{your-domain}/auth/microsoft/redirect` if you want to use Microsoft SSO +* `https://{your-domain}/auth/microsoft/redirect` マイクロソフトSSO を使用する場合 * `https://{your-domain}/auth/microsoft-apis/get-access-token` -### Configure in Twenty +### Twentyで構成 -1. Go to **Settings → Admin Panel → Configuration Variables** -2. Find the **Microsoft Auth** section -3. Set these variables: +1. **設定 → 管理パネル → 構成変数** に移動 +2. **Microsoft Auth** セクションを見つけます +3. 次の変数を設定: * `MESSAGING_PROVIDER_MICROSOFT_ENABLED=true` * `CALENDAR_PROVIDER_MICROSOFT_ENABLED=true` * `AUTH_MICROSOFT_ENABLED=true` @@ -211,32 +213,32 @@ You need to add the following redirect URIs to your project: * `AUTH_MICROSOFT_APIS_CALLBACK_URL=https://{your-domain}/auth/microsoft-apis/get-access-token` - **Environment-only mode:** If you set `IS_CONFIG_VARIABLES_IN_DB_ENABLED=false`, add these variables to your `.env` file instead. + **環境専用モード:** `IS_CONFIG_VARIABLES_IN_DB_ENABLED=false` を設定した場合、これらの変数を `.env` ファイルに追加してください。 -### Configure scopes +### スコープを構成 -[See relevant source code](https://github.com/twentyhq/twenty/blob/main/packages/twenty-server/src/engine/core-modules/auth/utils/get-microsoft-apis-oauth-scopes.ts#L2-L9) +[関連ソースコードを見る](https://github.com/twentyhq/twenty/blob/main/packages/twenty-server/src/engine/core-modules/auth/utils/get-microsoft-apis-oauth-scopes.ts#L2-L9) * 'openid' -* 'email' -* 'profile' +* 'メール' +* 'プロフィール' * 'offline_access' * 'Mail.ReadWrite' * 'Mail.Send' * 'Calendars.Read' -### If your app is in test mode +### アプリがテストモードの場合 -If your app is in test mode, you will need to add test users to your project. +アプリがテストモードの場合、プロジェクトにテストユーザーを追加する必要があります。 -Add your test users to the "Users and groups" section. +「ユーザーとグループ」セクションにテストユーザーを追加してください。 -## Background Jobs for Calendar & Messaging +## カレンダーとメッセージングのバックグラウンドジョブ -After configuring Gmail, Google Calendar, or Microsoft 365 integrations, you need to start the background jobs that sync data. +Gmail、Googleカレンダー、またはMicrosoft 365統合を構成した後、データを同期するバックグラウンドジョブを開始する必要があります。 -Register the following recurring jobs in your worker container: +次の定期ジョブをワーカーコンテナに登録してください: ```bash # from your worker container @@ -249,15 +251,15 @@ yarn command:prod cron:calendar:ongoing-stale yarn command:prod cron:workflow:automated-cron-trigger ``` -## Email Configuration +## メール設定 -1. Go to **Settings → Admin Panel → Configuration Variables** -2. Find the **Email** section -3. Configure your SMTP settings: +1. **設定 → 管理パネル → 構成変数** に移動 +2. **メール** セクションを見つけます +3. SMTP設定を構成: - You will need to provision an [App Password](https://support.google.com/accounts/answer/185833). + [アプリパスワード](https://support.google.com/accounts/answer/185833)を準備する必要があります。 * EMAIL_DRIVER=smtp * EMAIL_SMTP_HOST=smtp.gmail.com @@ -267,7 +269,7 @@ yarn command:prod cron:workflow:automated-cron-trigger - Keep in mind that if you have 2FA enabled, you will need to provision an [App Password](https://support.microsoft.com/en-us/account-billing/manage-app-passwords-for-two-step-verification-d6dc8c6d-4bf7-4851-ad95-6d07799387e9). + 2FAを有効にしている場合、[アプリパスワード](https://support.microsoft.com/en-us/account-billing/manage-app-passwords-for-two-step-verification-d6dc8c6d-4bf7-4851-ad95-6d07799387e9)を準備する必要があります。 * EMAIL_DRIVER=smtp * EMAIL_SMTP_HOST=smtp.office365.com @@ -277,11 +279,11 @@ yarn command:prod cron:workflow:automated-cron-trigger - **smtp4dev** is a fake SMTP email server for development and testing. + **smtp4dev** は開発とテストのためのフェイクSMTPメールサーバーです。 - * Run the smtp4dev image: `docker run --rm -it -p 8090:80 -p 2525:25 rnwood/smtp4dev` - * Access the smtp4dev ui here: [http://localhost:8090](http://localhost:8090) - * Set the following variables: + * smtp4devイメージを実行: `docker run --rm -it -p 8090:80 -p 2525:25 rnwood/smtp4dev` + * smtp4dev UIにアクセス: [http://localhost:8090](http://localhost:8090) + * 次の変数を設定: * EMAIL_DRIVER=smtp * EMAIL_SMTP_HOST=localhost * EMAIL_SMTP_PORT=2525 @@ -289,5 +291,49 @@ yarn command:prod cron:workflow:automated-cron-trigger - **Environment-only mode:** If you set `IS_CONFIG_VARIABLES_IN_DB_ENABLED=false`, add these variables to your `.env` file instead. + **環境専用モード:** `IS_CONFIG_VARIABLES_IN_DB_ENABLED=false` を設定した場合、これらの変数を `.env` ファイルに追加してください。 + +## サーバーレス関数 + +Twenty は、ワークフローやカスタムロジックのためのサーバーレス関数をサポートします。 実行環境は、`SERVERLESS_TYPE` 環境変数で設定されます。 + + + **セキュリティに関する注意:** ローカルのサーバーレスドライバー(`SERVERLESS_TYPE=LOCAL`)は、ホスト上の Node.js プロセス内でサンドボックスなしにコードを直接実行します。 開発では、信頼できるコードにのみ使用してください。 信頼できないコードを扱う本番デプロイでは、`SERVERLESS_TYPE=LAMBDA` または `SERVERLESS_TYPE=DISABLED` の使用を強く推奨します。 + + +### 利用可能なドライバー + +| ドライバー | 環境変数 | ユースケース | セキュリティレベル | +| ------ | -------------------------- | ----------------- | --------------- | +| 無効 | `SERVERLESS_TYPE=DISABLED` | サーバーレス関数を完全に無効化する | 該当なし | +| ローカル | `SERVERLESS_TYPE=LOCAL` | 開発および信頼できる環境 | 低(サンドボックスなし) | +| Lambda | `SERVERLESS_TYPE=LAMBDA` | 信頼できないコードを扱う本番環境 | 高(ハードウェアレベルの分離) | + +### 推奨構成 + +**開発向け:** + +```bash +SERVERLESS_TYPE=LOCAL # default +``` + +**本番向け(AWS):** + +```bash +SERVERLESS_TYPE=LAMBDA +SERVERLESS_LAMBDA_REGION=us-east-1 +SERVERLESS_LAMBDA_ROLE=arn:aws:iam::123456789:role/your-lambda-role +SERVERLESS_LAMBDA_ACCESS_KEY_ID=your-access-key +SERVERLESS_LAMBDA_SECRET_ACCESS_KEY=your-secret-key +``` + +**サーバーレス関数を無効化するには:** + +```bash +SERVERLESS_TYPE=DISABLED +``` + + + `SERVERLESS_TYPE=DISABLED` を使用している場合、サーバーレス関数を実行しようとするとエラーが返されます。 これは、サーバーレス関数の機能なしで Twenty を実行したい場合に便利です。 + diff --git a/packages/twenty-docs/l/ja/developers/self-host/capabilities/troubleshooting.mdx b/packages/twenty-docs/l/ja/developers/self-host/capabilities/troubleshooting.mdx index d2187aedac..0e2a94959f 100644 --- a/packages/twenty-docs/l/ja/developers/self-host/capabilities/troubleshooting.mdx +++ b/packages/twenty-docs/l/ja/developers/self-host/capabilities/troubleshooting.mdx @@ -1,26 +1,27 @@ --- -title: Troubleshooting +title: トラブルシューティング --- -## Troubleshooting +## トラブルシューティング -If you encounter any problem while setting up environment for development, upgrading your instance or self-hosting, -here are some solutions for common problems. +開発環境のセットアップ、バージョンアップまたはセルフホスティング中に問題が発生した場合、こちらによくある問題の解決策を示しています。 -### Self-hosting +### セルフホスティング -#### First install results in `password authentication failed for user "postgres"` +#### 初回インストールに`ユーザー "postgres" のパスワード認証失敗`と表示される -🚨 **IMPORTANT: This solution is ONLY for fresh installations** 🚨 -If you have an existing Twenty instance with production data, **DO NOT** follow these steps as they will permanently delete your database! +🚨 **重要: この解決策は新規インストールの場合のみ適用されます** 🚨 +すでに稼働中のTwentyインスタンスに本番データがある場合、これらの手順に従うとデータベースが完全に削除されますので、絶対に従わないでください。 -While installing Twenty for the first time, you might want to change the default database password. -The password you set during the first installation becomes permanently stored in the database volume. If you later try to change this password in your configuration without removing the old volume, you'll get authentication errors because the database is still using the original password. +Twentyを初めてインストールする際には、デフォルトのデータベースパスワードを変更する必要があるかもしれません。 +初回インストール時に設定されたパスワードはデータベースボリュームに永久に保存されます。 後になってこのパスワードを構成で変更しようとしても、古いボリュームを削除しない限り認証エラーが発生します。データベースが元のパスワードを使用しているためです。 +初回インストール時に設定されたパスワードはデータベースボリュームに永久に保存されます。 後になってこのパスワードを構成で変更しようとしても、古いボリュームを削除しない限り認証エラーが発生します。データベースが元のパスワードを使用しているためです。 +初回インストール時に設定されたパスワードはデータベースボリュームに永久に保存されます。 後になってこのパスワードを構成で変更しようとしても、古いボリュームを削除しない限り認証エラーが発生します。データベースが元のパスワードを使用しているためです。 -⚠️ WARNING: Following steps will PERMANENTLY DELETE all database data! ⚠️ -Only proceed if this is a fresh installation with no important data. +⚠️ 警告: 以下のステップを実行すると、データベース内のすべてのデータが完全に削除されます! ⚠️ +これは重要なデータのない新規インストールの場合のみ進めてください。 -In order to update the `PG_DATABASE_PASSWORD` you need to: +`PG_DATABASE_PASSWORD`を更新するには、以下が必要です: ```sh # Update the PG_DATABASE_PASSWORD in .env @@ -28,33 +29,35 @@ docker compose down --volumes docker compose up -d ``` -#### CR line breaks found [Windows] +#### CR行区切り[Windows]が見つかる -This is due to the line break characters of Windows and the git configuration. Try running: +これはWindowsの改行文字とgit構成のためです。 次を実行してみてください: 次を実行してみてください: 次を実行してみてください: ``` git config --global core.autocrlf false ``` -Then delete the repository and clone it again. +その後、リポジトリを削除して再クローンします。 -#### Missing metadata schema +#### メタデータスキーマが見つかりません -During Twenty installation, you need to provision your postgres database with the right schemas, extensions, and users. -If you're successful in running this provisioning, you should have `default` and `metadata` schemas in your database. -If you don't, make sure you don't have more than one postgres instance running on your computer. +Twentyのインストール中に、postgresデータベースを適切なスキーマ、拡張、およびユーザーで準備する必要があります。 +この準備がうまくいけば、あなたのデータベースに`default`と`metadata`スキーマがあるはずです。 +そうでない場合は、同じコンピュータ上で複数のpostgresインスタンスを実行していないことを確認してください。 +この準備がうまくいけば、あなたのデータベースに`default`と`metadata`スキーマがあるはずです。 +そうでない場合は、同じコンピュータ上で複数のpostgresインスタンスを実行していないことを確認してください。 -#### Cannot find module 'twenty-emails' or its corresponding type declarations. +#### モジュール'twenty-emails' またはその対応する型宣言が見つかりません。 -You have to build the package `twenty-emails` before running the initialization of the database with `npx nx run twenty-emails:build` +データベースの初期化を実行する前に`npx nx run twenty-emails:build`でtwenty-emailsパッケージをビルドする必要があります。 -#### Missing twenty-x package +#### twenty-xパッケージが見つかりません -Make sure to run yarn in the root directory and then run `npx nx server:dev twenty-server`. If this still doesn't work try building the missing package manually. +ルートディレクトリでyarnを実行し、その後 `npx nx server:dev twenty-server`を実行してください。 それでも動作しない場合は、足りないパッケージを手動でビルドしてみてください。 それでも動作しない場合は、足りないパッケージを手動でビルドしてみてください。 それでも動作しない場合は、足りないパッケージを手動でビルドしてみてください。 -#### Lint on Save not working +#### 保存時のLintが機能しない -This should work out of the box with the eslint extension installed. If this doesn't work try adding this to your vscode setting (on the dev container scope): +eslint拡張子がインストールされている場合、これは標準設定で動作するはずです。 eslint拡張子がインストールされている場合、これは標準設定で動作するはずです。 もしこれが機能しない場合、vscode設定で以下を追加してみてください(開発コンテナ範囲内で)。 ``` "editor.codeActionsOnSave": { @@ -64,85 +67,88 @@ This should work out of the box with the eslint extension installed. If this doe } ``` -#### While running `npx nx start` or `npx nx start twenty-front`, Out of memory error is thrown +#### `npx nx start` または `npx nx start twenty-front` 実行中にメモリエラーが発生 -In `packages/twenty-front/.env` uncomment `VITE_DISABLE_TYPESCRIPT_CHECKER=true` to disable background checks thus reducing amount of needed RAM. +`packages/twenty-front/.env`で`VITE_DISABLE_TYPESCRIPT_CHECKER=true` と `VITE_DISABLE_ESLINT_CHECKER=true` をコメント解除して、バックグラウンドチェックを無効化し、必要なRAMの量を減らします。 -**If it does not work:** -Run only the services you need, instead of `npx nx start`. For instance, if you work on the server, run only `npx nx worker twenty-server` +**うまくいかない場合:** +`npx nx start` の代わりに、必要なサービスだけを実行してください。 例えば、サーバーで作業している場合は、`npx nx worker twenty-server` のみを実行してください。 -**If it does not work:** -If you tried to run only `npx nx run twenty-server:start` on WSL and it's failing with the below memory error: +**うまくいかない場合:** +WSL 上で `npx nx run twenty-server:start` だけを実行しようとして、以下のメモリエラーで失敗する場合: `FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory` -Workaround is to execute below command in terminal or add it in .bashrc profile to get setup automatically: +以下のコマンドをターミナルで実行するか、.bashrcプロファイルに追加して自動セットアップします: `export NODE_OPTIONS="--max-old-space-size=8192"` -The --max-old-space-size=8192 flag sets an upper limit of 8GB for the Node.js heap; usage scales with application demand. -Reference: https://stackoverflow.com/questions/56982005/where-do-i-set-node-options-max-old-space-size-2048 +\--max-old-space-size=8192 フラグはNode.jsヒープの上限を8GBに設定します; 使用量はアプリケーションの要求に応じてスケールします。 +参考: https://stackoverflow.com/questions/56982005/where-do-i-set-node-options-max-old-space-size-2048 +参考: https://stackoverflow.com/questions/56982005/where-do-i-set-node-options-max-old-space-size-2048 +参考: https://stackoverflow.com/questions/56982005/where-do-i-set-node-options-max-old-space-size-2048 -**If it does not work:** -Investigate which processes are taking you most of your machine RAM. At Twenty, we noticed that some VScode extensions were taking a lot of RAM so we temporarily disable them. +**うまくいかない場合:** +マシンの RAM を最も消費しているプロセスを調査してください。 **これが機能しない場合:**\ +あなたのマシンのRAMを最も使用しているプロセスを調査してください。 Twentyでは、一部のVScode拡張機能が多くのRAMを使用していることに気付き、一時的に無効化しました。 -**If it does not work:** -Restart your machine helps to clean up ghost processes. +**うまくいかない場合:** +マシンを再起動すると、ゴーストプロセスのクリーンアップに役立ちます。 -#### While running `npx nx start` there are weird [0] and [1] in logs +#### `npx nx start`を実行中にログに謎の[0]や[1]が表示される -That's expected as command `npx nx start` is running more commands under the hood +`npx nx start`コマンドが複数のコマンドを裏で実行しているため、これは予想された挙動です。 -#### No emails are sent +#### メールが送信されない -Most of the time, it's because the `worker` is not running in the background. Try to run +ほとんどの場合、バックグラウンドで`worker`が動作していないのが原因です。 実行してみてください 実行してみてください 実行してみてください ``` npx nx worker twenty-server ``` -#### Cannot connect my Microsoft 365 account +#### Microsoft 365アカウントに接続できない -Most of the time, it's because your admin has not enabled the Microsoft 365 Licence for your account. Check [https://admin.microsoft.com/](https://admin.microsoft.com/Adminportal/Home). +ほとんどの場合、管理者があなたのアカウントのMicrosoft 365ライセンスを有効化していないことが原因です。 [https://admin.microsoft.com/](https://admin.microsoft.com/Adminportal/Home)を確認してください。 [https://admin.microsoft.com/](https://admin.microsoft.com/Adminportal/Home)を確認してください。 [https://admin.microsoft.com/](https://admin.microsoft.com/Adminportal/Home)を確認してください。 -If you have an error code `AADSTS50020`, it probably means that you are using a personal Microsoft account. This is not supported yet. More info [here](https://learn.microsoft.com/fr-fr/troubleshoot/entra/entra-id/app-integration/error-code-aadsts50020-user-account-identity-provider-does-not-exist) +エラーコード`AADSTS50020`を受け取った場合、おそらく個人のMicrosoftアカウントを使用しています。 これはまだサポートされていません。 エラーコード`AADSTS50020`を受け取った場合、おそらく個人のMicrosoftアカウントを使用しています。 これはまだサポートされていません。 エラーコード`AADSTS50020`を受け取った場合、おそらく個人のMicrosoftアカウントを使用しています。 これはまだサポートされていません。 詳細は[こちら](https://learn.microsoft.com/fr-fr/troubleshoot/entra/entra-id/app-integration/error-code-aadsts50020-user-account-identity-provider-does-not-exist) -#### While running `yarn` warnings appear in console +#### `yarn`実行中の警告がコンソールに表示される -Warnings are informing about pulling additional dependencies which aren't explicitly stated in `package.json`, so as long as no breaking error appears, everything should work as expected. +警告は、`package.json`に明示的に記載されていない追加依存関係の取得を伝えており、破損するエラーがない限り、すべてが期待通りに動作するはずです。 -#### When user accesses login page, error about unauthorized user trying to access workspace appears in logs +#### ログインページにアクセスした際、未認証ユーザーの作業スペースへのアクセスに関するエラーがログに表示される -That's expected as user is unauthorized when logged out since its identity is not verified. +これは予想された挙動で、ログアウト中のユーザーはアイデンティティが確認されていないため未認証です。 -#### How to check if your worker is running? +#### ワーカーが稼働しているかどうかを確認するには? -* Go to [webhook-test.com](https://webhook-test.com/) and copy **Your Unique Webhook URL**. +* [webhook-test.com](https://webhook-test.com/)にアクセスし、**Your Unique Webhook URL**をコピーします。
- Webhook test + Webhookテスト
-* Open your Twenty app, navigate to `/settings`, and enable the **Advanced** toggle at the bottom left of the screen. -* Create a new webhook. -* Paste **Your Unique Webhook URL** in the **Endpoint Url** field in Twenty. Set the **Filters** to `Companies` and `Created`. +* Twentyアプリを開き、`/settings`に移動し、画面左下の**Advanced**トグルを有効にします。 +* 新しいWebhookを作成します。 +* **Your Unique Webhook URL**をTwentyの**Endpoint Url**フィールドに貼り付けます。 **Filters**を`Companies`と`Created`に設定します。
- Webhook settings + Webhook設定
-* Go to `/objects/companies` and create a new company record. -* Return to [webhook-test.com](https://webhook-test.com/) and check if a new **POST request** has been received. +* `/objects/companies`にアクセスし、新しい企業レコードを作成します。 +* [webhook-test.com](https://webhook-test.com/)に戻り、新しい**POSTリクエスト**が受信されたか確認します。
- Webhook test result + Webhookテスト結果
-* If a **POST request** is received, your worker is running successfully. Otherwise, you need to troubleshoot your worker. +* **POSTリクエスト**が受信された場合、あなたのワーカーは正常に稼働しています。 そうでない場合は、ワーカーのトラブルシューティングが必要です。 -#### Front-end fails to start and returns error TS5042: Option 'project' cannot be mixed with source files on a command line +#### フロントエンドが起動に失敗し、エラーTS5042: オプション'プロジェクト'はコマンドライン上でソースファイルと一緒に使用できません -Comment out checker plugin in `packages/twenty-ui/vite-config.ts` like in example below +例のように`packages/twenty-ui/vite-config.ts`内のチェッカープラグインをコメントアウトします ``` plugins: [ @@ -166,62 +172,62 @@ plugins: [ ], ``` -#### Admin panel not accessible +#### 管理パネルにアクセスできない -Run `UPDATE core."user" SET "canAccessFullAdminPanel" = TRUE WHERE email = 'you@yourdomain.com';` in database container to get access to admin panel. +adminパネルにアクセスするには、データベースコンテナで`UPDATE core."user" SET "canAccessFullAdminPanel" = TRUE WHERE email = 'you@yourdomain.com';`を実行します。 -### 1-click Docker compose +### 1クリックでDocker構成 -#### Unable to Log In +#### ログインできない -If you can't log in after setup: +セットアップ後にログインできない場合: -1. Run the following commands: +1. 次のコマンドを実行してください: ```bash docker exec -it twenty-server-1 yarn docker exec -it twenty-server-1 npx nx database:reset --configuration=no-seed ``` -2. Restart the Docker containers: +2. Dockerコンテナを再起動してください: ```bash docker compose down docker compose up -d ``` -Note the database:reset command will completely erase your database and recreate it from scratch. +database:resetコマンドはデータベースを完全に消去し、最初から再構築します。 -#### Connection Issues Behind a Reverse Proxy +#### リバースプロキシの背後での接続問題 -If you're running Twenty behind a reverse proxy and experiencing connection issues: +リバースプロキシの背後でTwentyを実行し、接続問題が発生している場合: -1. **Verify SERVER_URL:** +1. **SERVER_URLの確認:** - Ensure `SERVER_URL` in your `.env` file matches your external access URL, including `https` if SSL is enabled. + `.env`ファイルの`SERVER_URL`が外部アクセスURLと一致するようにし、SSLが有効なら`https`を含めます。 -2. **Check Reverse Proxy Settings:** +2. **リバースプロキシ設定の確認:** - * Confirm that your reverse proxy is correctly forwarding requests to the Twenty server. - * Ensure headers like `X-Forwarded-For` and `X-Forwarded-Proto` are properly set. + * リバースプロキシがTwentyサーバーへのリクエストを正しく転送していることを確認してください。 + * `X-Forwarded-For`や`X-Forwarded-Proto`といったヘッダーが正しく設定されていることを確認してください。 -3. **Restart Services:** +3. **サービスの再起動:** - After making changes, restart both the reverse proxy and Twenty containers. + 変更を行った後に、リバースプロキシとTwentyコンテナの両方を再起動します。 -#### Error when uploading an image - permission denied +#### 画像のアップロード時にエラー - アクセス許可が拒否されました -Switching the data folder ownership on the host from root to another user and group resolves this problem. +ホストでのデータフォルダの所有権をrootから他のユーザーとグループに切り替えると、この問題が解決されます。 -## Getting Help +## サポートを受ける -If you encounter issues not covered in this guide: +このガイドにカバーされていない問題がある場合: -* Check Logs: +* ログを確認: - View container logs for error messages: + コンテナログを表示してエラーメッセージを確認します: ```bash docker compose logs ``` -* Community Support: +* コミュニティサポート: - Reach out to the [Twenty community](https://github.com/twentyhq/twenty/issues) or [support channels](https://discord.gg/cx5n4Jzs57) for assistance. + [Twentyコミュニティ](https://github.com/twentyhq/twenty/issues)または[サポートチャンネル](https://discord.gg/cx5n4Jzs57)に連絡してサポートを受けてください。 diff --git a/packages/twenty-docs/l/ja/developers/self-host/capabilities/upgrade-guide.mdx b/packages/twenty-docs/l/ja/developers/self-host/capabilities/upgrade-guide.mdx index 03a53f5685..7907875c96 100644 --- a/packages/twenty-docs/l/ja/developers/self-host/capabilities/upgrade-guide.mdx +++ b/packages/twenty-docs/l/ja/developers/self-host/capabilities/upgrade-guide.mdx @@ -1,40 +1,40 @@ --- -title: Upgrade guide +title: アップグレードガイド --- -## General guidelines +## 一般ガイドライン -**Always make sure to back up your database before starting the upgrade process** by running `docker exec -it {db_container_name_or_id} pg_dumpall -U {postgres_user} > databases_backup.sql`. +**アップグレードプロセスを開始する前に、必ずデータベースのバックアップを作成してください**。以下のコマンドを実行します:`docker exec -it {db_container_name_or_id} pg_dumpall -U {postgres_user} > databases_backup.sql`. -To restore backup, run `cat databases_backup.sql | docker exec -i {db_container_name_or_id} psql -U {postgres_user}`. +バックアップを復元するには、次のコマンドを実行します:`cat databases_backup.sql | docker exec -i {db_container_name_or_id} psql -U {postgres_user}`. -If you used Docker Compose, follow these steps: +Docker Composeを使用している場合、次の手順に従います: -1. In a terminal, on the host where Twenty is running, turn off Twenty: `docker compose down` +1. Twentyを実行しているホスト上のターミナルで、Twentyを停止します:`docker compose down` -2. Upgrade the version by changing the `TAG` value in the .env file near your docker-compose. ( We recommend consuming `major.minor` version such as `v0.53` ) +2. docker-compose近くにある.envファイルの`TAG`値を変更してバージョンをアップグレードします。 ( `v0.53` のように `major.minor` バージョンを使用することをお勧めします ) ( `v0.53` のように `major.minor` バージョンを使用することをお勧めします ) ( `v0.53` のように `major.minor` バージョンを使用することをお勧めします ) -3. Bring Twenty back online with `docker compose up -d` +3. `docker compose up -d` でTwentyを再起動します。 -If you want to upgrade your instance by few versions, e.g. from v0.33.0 to v0.35.0, you have to upgrade your instance sequentially, in this example from v0.33.0 to v0.34.0, then from v0.34.0 to v0.35.0. +例えば、v0.33.0 から v0.35.0 に数バージョンアップグレードしたい場合は、インスタンスを順次アップグレードする必要があります。この例では、まず v0.33.0 から v0.34.0 、次に v0.34.0から v0.35.0 にアップグレードします。 -**Make sure that after each upgraded version you have non-corrupted backup.** +**各アップグレードしたバージョンの後に壊れていないバックアップを必ず確認してください。** -## Version-specific upgrade steps +## バージョン固有のアップグレード手順 ## v1.0 -Hello Twenty v1.0! 🎉 +こんにちは、Twenty v1.0! 🎉 ## v0.60 -### Performance Enhancements +### パフォーマンス向上 -All interactions with the metadata API have been optimized for better performance, particularly for object metadata manipulation and workspace creation operations. +メタデータ API とのすべてのやり取りは、特にオブジェクトのメタデータ操作およびワークスペース作成の処理において、パフォーマンス向上のために最適化されました。 -We've refactored our caching strategy to prioritize cache hits over database queries when possible, significantly improving the performance of metadata API operations. +キャッシング戦略を見直し、可能な場合はデータベースクエリよりもキャッシュヒットを優先するようにしました。これにより、メタデータAPIオペレーションのパフォーマンスが大幅に向上しました。 -If you encounter any runtime issues after upgrading, you may need to flush your cache to ensure it's synchronized with the latest changes. Run this command in your twenty-server container: +アップグレード後にランタイムの問題が発生した場合は、キャッシュをフラッシュして最新の変更と同期させる必要があるかもしれません。 twenty-serverコンテナ内で次のコマンドを実行します: twenty-serverコンテナ内で次のコマンドを実行します: ```bash yarn command:prod cache:flush @@ -42,113 +42,118 @@ yarn command:prod cache:flush ### v0.55 -Upgrade your Twenty instance to use v0.55 image +Twentyインスタンスをv0.55イメージにアップグレードします。 -You don't need to run any command anymore, the new image will automatically care about running all required migrations. +もうコマンドを実行する必要はありません。新しいイメージがすべての必要な移行を自動的に行います。 -### `User does not have permission` error +### `User does not have permission` エラー -If you encounter authorization errors on most requests after upgrading, you may need to flush your cache to recompute the latest permissions. +アップグレード後にほとんどの要求で承認エラーが発生した場合は、キャッシュをフラッシュして最新の権限を再計算する必要があるかもしれません。 -In your `twenty-server` container, run: +あなたの `twenty-server` コンテナ内で次のコマンドを実行します: ```bash yarn command:prod cache:flush ``` -This issue is specific to this Twenty version and should not be required for future upgrades. +この問題は特定のTwentyバージョンに固有であり、今後のアップグレードでは不要なはずです。 ### v0.54 -Since version `0.53`, no manual actions needed. +バージョン `0.53` 以降、手動の操作は必要ありません。 -#### Metadata schema deprecation +#### メタデータスキーマ廃止 -We've merged the `metadata` schema into the `core` one to simplify data retrieval from `TypeORM`. -We have merged the `migrate` command step within the `upgrade` command. We do not recommend running `migrate` manually within any of your server/worker containers. +データの取得を簡素化するために、`metadata` スキーマを `core` スキーマにマージしました。 +`upgrade` コマンド内の `migrate` コマンドステップを統合しました。 サーバーまたはワーカーコンテナ内で `migrate` を手動で実行することはお勧めしません。 -### Since v0.53 +### v0.53以降 -Starting from `0.53`, upgrade is programmatically done within the `DockerFile`, this means from now on, you shouldn't have to run any command manually anymore. +`0.53` 以降、アップグレードは `DockerFile` 内でプログラム的に行われます。これはつまり、これ以降は手動でコマンドを実行する必要がないことを意味します。 -Make sure to keep upgrading your instance sequentially, without skipping any major version (e.g. `0.43.3` to `0.44.0` is allowed, but `0.43.1` to `0.45.0` isn't), else could lead to workspace version desynchronization that could result in runtime error and missing functionality. +メジャーバージョンを飛ばさずに順次インスタンスをアップグレードし続けることを確認してください(e.g. `0.43.3`から`0.44.0`へのアップグレードは許可されていますが、`0.43.1`から`0.45.0`へのアップグレードはできません)。そうしないと、ワークスペースのバージョンが同期しないことが原因でランタイムエラーや機能の欠如が発生する可能性があります。 -To check if a workspace has been correctly migrated you can review its version in database in `core.workspace` table. +ワークスペースが正しく移行されたかを確認するには、データベース内の `core.workspace` テーブル内でそのバージョンを確認できます。 -It should always be in the range of your current Twenty's instance `major.minor` version, you can view your instance version in the admin panel (at `/settings/admin-panel`, accessible if your user has `canAccessFullAdminPanel` property set to true in the database) or by running `echo $APP_VERSION` in your `twenty-server` container. +それは常にあなたの現在のTwentyのインスタンスの `major.minor` バージョンの範囲内である必要があります。あなたのインスタンスバージョンは、管理パネル( `/settings/admin-panel` にあり、データベース内でユーザーが `canAccessFullAdminPanel` プロパティを持っている場合にアクセス可能)にまたは `twenty-server` コンテナ内で `echo $APP_VERSION` を実行することで確認できます。 -To fix a desynchronized workspace version, you will have to upgrade from the corresponding twenty's version following related upgrade guide sequentially and so on until it reaches desired version. +非同期化されたワークスペースバージョンを修正するには、対応するTwentyのバージョンから関連するアップグレードガイドに従って順次アップグレードし、それが目的のバージョンに到達するまで続ける必要があります。 -#### `auditLog` removal +#### `auditLog` の削除 -We've removed the auditLog standard object, which means your backup size might be significantly reduced after this migration. +監査ログ標準オブジェクトを削除しました。これにより、この移行後のバックアップサイズが大幅に縮小する可能性があります。 -### v0.51 to v0.52 +### v0.51からv0.52 -Upgrade your Twenty instance to use v0.52 image +Twentyインスタンスをv0.52イメージにアップグレードします。 ``` yarn database:migrate:prod yarn command:prod upgrade ``` -#### I have a workspace blocked in version between `0.52.0` and `0.52.6` +#### 私は `0.52.0` と `0.52.6` の間のバージョンでブロックされたワークスペースを持っています。 -Unfortunately `0.52.0` and `0.52.6` have been completely removed from dockerHub. -You will have to manually update your workspace version to `0.51.0` in database and upgrade using twenty version `0.52.11` following its just above upgrade guide. +残念ながら、`0.52.0` と `0.52.6` はdockerHubから完全に削除されました。 +残念ながら、`0.52.0` と `0.52.6` はdockerHubから完全に削除されました。 +データベースでワークスペースバージョンを手動で `0.51.0` に更新し、twentyバージョン `0.52.11` を使用して、その直上のアップグレードガイドに従ってアップグレードする必要があります。 +残念ながら、`0.52.0` と `0.52.6` はdockerHubから完全に削除されました。 +データベースでワークスペースバージョンを手動で `0.51.0` に更新し、twentyバージョン `0.52.11` を使用して、その直上のアップグレードガイドに従ってアップグレードする必要があります。 -### v0.50 to v0.51 +### v0.50からv0.51 -Upgrade your Twenty instance to use v0.51 image +Twentyインスタンスをv0.51イメージにアップグレードします。 ``` yarn database:migrate:prod yarn command:prod upgrade ``` -### v0.44.0 to v0.50.0 +### v0.44.0からv0.50.0 -Upgrade your Twenty instance to use v0.50.0 image +Twentyインスタンスをv0.50.0イメージにアップグレードします。 ``` yarn database:migrate:prod yarn command:prod upgrade ``` -#### Docker-compose.yml mutation +#### Docker-compose.ymlの変更 -This version includes a `docker-compose.yml` mutation to give `worker` service access to the `server-local-data` volume. -Please update your local `docker-compose.yml` with [v0.50.0 docker-compose.yml](https://github.com/twentyhq/twenty/blob/v0.50.0/packages/twenty-docker/docker-compose.yml) +このバージョンには、`worker` サービスが `server-local-data` ボリュームにアクセスできるようにするための `docker-compose.yml` の変更が含まれています。 +ローカルの `docker-compose.yml` を[v0.50.0 docker-compose.yml](https://github.com/twentyhq/twenty/blob/v0.50.0/packages/twenty-docker/docker-compose.yml)に更新してください。 +ローカルの `docker-compose.yml` を[v0.50.0 docker-compose.yml](https://github.com/twentyhq/twenty/blob/v0.50.0/packages/twenty-docker/docker-compose.yml)に更新してください。 +ローカルの `docker-compose.yml` を[v0.50.0 docker-compose.yml](https://github.com/twentyhq/twenty/blob/v0.50.0/packages/twenty-docker/docker-compose.yml)に更新してください。 -### v0.43.0 to v0.44.0 +### v0.43.0からv0.44.0 -Upgrade your Twenty instance to use v0.44.0 image +Twentyインスタンスをv0.44.0イメージにアップグレードします。 ``` yarn database:migrate:prod yarn command:prod upgrade ``` -### v0.42.0 to v0.43.0 +### v0.42.0からv0.43.0 -Upgrade your Twenty instance to use v0.43.0 image +Twentyインスタンスをv0.43.0イメージにアップグレードします。 ``` yarn database:migrate:prod yarn command:prod upgrade ``` -In this version, we have also switched to postgres:16 image in docker-compose.yml. +本バージョンでは、`docker-compose.yml`において`postgres:16`イメージへの切り替えも行いました。 -#### (Option 1) Database migration +#### ( オプション 1 ) データベース移行 -Keeping the existing postgres-spilo image is fine, but you will have to freeze the version in your docker-compose.yml to be 0.43.0. +既存のpostgres-spiloイメージを保持するのは問題ありませんが、docker-compose.ymlでバージョンを0.43.0に固定する必要があります。 -#### (Option 2) Database migration +#### ( オプション 2 ) データベース移行 -If you want to migrate your database to the new postgres:16 image, please follow these steps: +データベースを新しいpostgres:16イメージに移行したい場合は、次の手順に従ってください: -1. Dump your database from the old postgres-spilo container +1. 古いpostgres-spiloコンテナからデータベースをダンプします。 ``` docker exec -it twenty-db-1 sh @@ -157,11 +162,11 @@ exit docker cp twenty-db-1:/home/postgres/databases_backup.sql . ``` -Make sure your dump file is not empty. +ダンプファイルが空でないことを確認してください。 -2. Upgrade your docker-compose.yml to use postgres:16 image as in the [docker-compose.yml](https://raw.githubusercontent.com/twentyhq/twenty/main/packages/twenty-docker/docker-compose.yml) file. +2. docker-compose.ymlを、新しいpostgres:16イメージを使用するようにアップグレードします。[docker-compose.yml](https://raw.githubusercontent.com/twentyhq/twenty/main/packages/twenty-docker/docker-compose.yml)を参照してください。 -3. Restore the database to the new postgres:16 container +3. データベースを新しいpostgres:16コンテナへ復元します。 ``` docker cp databases_backup.sql twenty-db-1:/databases_backup.sql @@ -170,86 +175,90 @@ psql -U {YOUR_POSTGRES_USER} -d {YOUR_POSTGRES_DB} -f databases_backup.sql exit ``` -### v0.41.0 to v0.42.0 +### v0.41.0からv0.42.0 -Upgrade your Twenty instance to use v0.42.0 image +Twentyインスタンスをv0.42.0イメージにアップグレードします。 ``` yarn database:migrate:prod yarn command:prod upgrade-0.42 ``` -**Environment Variables** +**環境変数** -* Removed: `FRONT_PORT`, `FRONT_PROTOCOL`, `FRONT_DOMAIN`, `PORT` -* Added: `FRONTEND_URL`, `NODE_PORT`, `MAX_NUMBER_OF_WORKSPACES_DELETED_PER_EXECUTION`, `MESSAGING_PROVIDER_MICROSOFT_ENABLED`, `CALENDAR_PROVIDER_MICROSOFT_ENABLED`, `IS_MICROSOFT_SYNC_ENABLED` +* 削除: `FRONT_PORT`, `FRONT_PROTOCOL`, `FRONT_DOMAIN`, `PORT` +* 追加: `FRONTEND_URL`, `NODE_PORT`, `MAX_NUMBER_OF_WORKSPACES_DELETED_PER_EXECUTION`, `MESSAGING_PROVIDER_MICROSOFT_ENABLED`, `CALENDAR_PROVIDER_MICROSOFT_ENABLED`, `IS_MICROSOFT_SYNC_ENABLED` -### v0.40.0 to v0.41.0 +### v0.40.0からv0.41.0 -Upgrade your Twenty instance to use v0.41.0 image +Twentyインスタンスをv0.41.0イメージにアップグレードします。 ``` yarn database:migrate:prod yarn command:prod upgrade-0.41 ``` -**Environment Variables** +**環境変数** -* Removed: `AUTH_MICROSOFT_TENANT_ID` +* 削除: `AUTH_MICROSOFT_TENANT_ID` -### v0.35.0 to v0.40.0 +### v0.35.0からv0.40.0 -Upgrade your Twenty instance to use v0.40.0 image +Twentyインスタンスをv0.40.0イメージにアップグレードします。 ``` yarn database:migrate:prod yarn command:prod upgrade-0.40 ``` -**Environment Variables** +**環境変数** -* Added: `IS_EMAIL_VERIFICATION_REQUIRED`, `EMAIL_VERIFICATION_TOKEN_EXPIRES_IN`, `WORKFLOW_EXEC_THROTTLE_LIMIT`, `WORKFLOW_EXEC_THROTTLE_TTL` +* 追加: `IS_EMAIL_VERIFICATION_REQUIRED`, `EMAIL_VERIFICATION_TOKEN_EXPIRES_IN`, `WORKFLOW_EXEC_THROTTLE_LIMIT`, `WORKFLOW_EXEC_THROTTLE_TTL` -### v0.34.0 to v0.35.0 +### v0.34.0からv0.35.0 -Upgrade your Twenty instance to use v0.35.0 image +Twentyインスタンスをv0.35.0イメージにアップグレードします。 ``` yarn database:migrate:prod yarn command:prod upgrade-0.35 ``` -The `yarn database:migrate:prod` command will apply the migrations to the database structure (core and metadata schemas) -The `yarn command:prod upgrade-0.35` takes care of the data migration of all workspaces. +`yarn database:migrate:prod` コマンドはデータベース構造(コアおよびメタデータスキーマ)の移行を適用します +`yarn command:prod upgrade-0.35` はすべてのワークスペースのデータ移行を行います。 -**Environment Variables** +**環境変数** -* We replaced `ENABLE_DB_MIGRATIONS` with `DISABLE_DB_MIGRATIONS` (default value is now `false`, you probably don't have to set anything) +* `ENABLE_DB_MIGRATIONS` を `DISABLE_DB_MIGRATIONS` に置き換えました(デフォルト値は`false`で、設定する必要はないと思われます) -### v0.33.0 to v0.34.0 +### v0.33.0からv0.34.0 -Upgrade your Twenty instance to use v0.34.0 image +Twentyインスタンスをv0.34.0イメージにアップグレードします。 ``` yarn database:migrate:prod yarn command:prod upgrade-0.34 ``` -The `yarn database:migrate:prod` command will apply the migrations to the database structure (core and metadata schemas) -The `yarn command:prod upgrade-0.34` takes care of the data migration of all workspaces. +`yarn database:migrate:prod` コマンドはデータベース構造(コアおよびメタデータスキーマ)の移行を適用します +`yarn command:prod upgrade-0.34` はすべてのワークスペースのデータ移行を行います。 -**Environment Variables** +**環境変数** -* Removed: `FRONT_BASE_URL` -* Added: `FRONT_DOMAIN`, `FRONT_PROTOCOL`, `FRONT_PORT` +* 削除: `FRONT_BASE_URL` +* 追加: `FRONT_DOMAIN`, `FRONT_PROTOCOL`, `FRONT_PORT` -We have updated the way we handle the frontend URL. -You can now set the frontend URL using the `FRONT_DOMAIN`, `FRONT_PROTOCOL` and `FRONT_PORT` variables. -If FRONT_DOMAIN is not set, the frontend URL will fall back to `SERVER_URL`. +フロントエンドURLの取り扱いを更新しました。 +フロントエンドURLの取り扱いを更新しました。 +フロントエンドURLの取り扱いを更新しました。 +フロントエンドURLは、`FRONT_DOMAIN`、`FRONT_PROTOCOL`、`FRONT_PORT` 変数を使用して設定できます。 +FRONT_DOMAIN が設定されていない場合、フロントエンドURLは `SERVER_URL` に戻されます。 +FRONT_DOMAIN が設定されていない場合、フロントエンドURLは `SERVER_URL` に戻されます。 +FRONT_DOMAIN が設定されていない場合、フロントエンドURLは `SERVER_URL` に戻されます。 -### v0.32.0 to v0.33.0 +### v0.32.0からv0.33.0 -Upgrade your Twenty instance to use v0.33.0 image +Twentyインスタンスをv0.33.0イメージにアップグレードします。 ``` yarn command:prod cache:flush @@ -257,68 +266,75 @@ yarn database:migrate:prod yarn command:prod upgrade-0.33 ``` -The `yarn command:prod cache:flush` command will flush the Redis cache. -The `yarn database:migrate:prod` command will apply the migrations to the database structure (core and metadata schemas) -The `yarn command:prod upgrade-0.33` takes care of the data migration of all workspaces. +`yarn command:prod cache:flush` コマンドはRedisキャッシュをフラッシュします。 +`yarn database:migrate:prod` コマンドはデータベース構造(コアおよびメタデータスキーマ)の移行を適用します +`yarn command:prod upgrade-0.33` はすべてのワークスペースのデータ移行を行います。 +`yarn database:migrate:prod` コマンドはデータベースへの移行を適用します。 +"`yarn command:prod workspace:sync-metadata -f` コマンドは、標準オブジェクトの定義をメタデータテーブルに同期し、既存のワークスペースに必要な移行を適用します。" +The `yarn command:prod upgrade-0.22` command will apply specific data transformations to adapt to the new object defaultRequestInstrumentationOptions. -Starting from this version, twenty-postgres image for DB became deprecated and twenty-postgres-spilo is used instead. -If you want to keep using twenty-postgres image, simply replace `twentycrm/twenty-postgres:${TAG}` with `twentycrm/twenty-postgres` in docker-compose.yml. +このバージョンから、DB用のtwenty-postgresイメージは廃止され、twenty-postgres-spiloが代わりに使用されるようになりました。 +このバージョンから、DB用のtwenty-postgresイメージは廃止され、twenty-postgres-spiloが代わりに使用されるようになりました。 +このバージョンから、DB用のtwenty-postgresイメージは廃止され、twenty-postgres-spiloが代わりに使用されるようになりました。 +twenty-postgresイメージを使い続けたい場合は、docker-compose.yml内の`twentycrm/twenty-postgres:${TAG}`を`twentycrm/twenty-postgres`に置き換えるだけで済みます。 -### v0.31.0 to v0.32.0 +### v0.31.0からv0.32.0 -Upgrade your Twenty instance to use v0.32.0 image +Twentyインスタンスをv0.32.0イメージにアップグレードします。 -**Schema and data migration** +**スキーマとデータ移行** ``` yarn database:migrate:prod yarn command:prod upgrade-0.32 ``` -The `yarn database:migrate:prod` command will apply the migrations to the database structure (core and metadata schemas) -The `yarn command:prod upgrade-0.32` takes care of the data migration of all workspaces. +`yarn database:migrate:prod` コマンドはデータベース構造(コアおよびメタデータスキーマ)の移行を適用します +`yarn command:prod upgrade-0.32` はすべてのワークスペースのデータ移行を行います。 -**Environment Variables** +**環境変数** -We have updated the way we handle the Redis connection. +Redis接続の取り扱いを更新しました。 -* Removed: `REDIS_HOST`, `REDIS_PORT`, `REDIS_USERNAME`, `REDIS_PASSWORD` -* Added: `REDIS_URL` +* 削除: `REDIS_HOST`, `REDIS_PORT`, `REDIS_USERNAME`, `REDIS_PASSWORD` +* 追加: `REDIS_URL` -Update your `.env` file to use the new `REDIS_URL` variable instead of the individual Redis connection parameters. +個々のRedis接続パラメーターの代わりに、新しい `REDIS_URL` 変数を使用するように `.env` ファイルを更新してください。 -We have also simplified the way we handle the JWT tokens. +JWTトークンの取り扱いも簡素化しました。 -* Removed: `ACCESS_TOKEN_SECRET`, `LOGIN_TOKEN_SECRET`, `REFRESH_TOKEN_SECRET`, `FILE_TOKEN_SECRET` -* Added: `APP_SECRET` +* 削除: `ACCESS_TOKEN_SECRET`, `LOGIN_TOKEN_SECRET`, `REFRESH_TOKEN_SECRET`, `FILE_TOKEN_SECRET` +* 追加: `APP_SECRET` -Update your `.env` file to use the new `APP_SECRET` variable instead of the individual tokens secrets (you can use the same secret as before or generate a new random string) +個々のトークンシークレットの代わりに、新しい `APP_SECRET` 変数を使用するように `.env` ファイルを更新してください(以前と同じシークレットを使用するか、新しいランダム文字列を生成して使用することができます) -**Connected Account** +**接続アカウント** -If you are using connected account to synchronize your Google emails and calendars, you will need to activate the [People API](https://developers.google.com/people) on your Google Admin console. +Googleメールとカレンダーを同期するために接続されたアカウントを使用する場合は、Google管理コンソールで[People API](https://developers.google.com/people)をアクティブにする必要があります。 -### v0.30.0 to v0.31.0 +### v0.30.0からv0.31.0 -Upgrade your Twenty instance to use v0.31.0 image +Twentyインスタンスをv0.31.0イメージにアップグレードします。 -**Schema and data migration**: +**スキーマとデータ移行**: ``` yarn database:migrate:prod yarn command:prod upgrade-0.31 ``` -The `yarn database:migrate:prod` command will apply the migrations to the database structure (core and metadata schemas) -The `yarn command:prod upgrade-0.31` takes care of the data migration of all workspaces. +`yarn database:migrate:prod` コマンドはデータベース構造(コアおよびメタデータスキーマ)の移行を適用します +`yarn command:prod upgrade-0.31` はすべてのワークスペースのデータ移行を行います。 -### v0.24.0 to v0.30.0 +### v0.24.0からv0.30.0 -Upgrade your Twenty instance to use v0.30.0 image +Twentyインスタンスをv0.30.0イメージにアップグレードします。 -**Breaking change**: -To enhance performances, Twenty now requires redis cache to be configured. We have updated our [docker-compose.yml](https://raw.githubusercontent.com/twentyhq/twenty/main/packages/twenty-docker/docker-compose.yml) to reflect this. -Make sure to update your configuration and to update your environment variables accordingly: +**破壊的な変更**: +パフォーマンスを向上させるために、TwentyはRedisキャッシュの設定を必要とするようになりました。 これを反映した[docker-compose.yml](https://raw.githubusercontent.com/twentyhq/twenty/main/packages/twenty-docker/docker-compose.yml)を更新しました。 +構成を更新し、環境変数を適切に更新してください: +構成を更新し、環境変数を適切に更新してください: +構成を更新し、環境変数を適切に更新してください: ``` REDIS_HOST={your-redis-host} @@ -326,49 +342,50 @@ REDIS_PORT={your-redis-port} CACHE_STORAGE_TYPE=redis ``` -**Schema and data migration**: +**スキーマとデータ移行**: ``` yarn database:migrate:prod yarn command:prod upgrade-0.30 ``` -The `yarn database:migrate:prod` command will apply the migrations to the database structure (core and metadata schemas) -The `yarn command:prod upgrade-0.30` takes care of the data migration of all workspaces. +`yarn database:migrate:prod` コマンドはデータベース構造(コアおよびメタデータスキーマ)の移行を適用します +`yarn command:prod upgrade-0.30` はすべてのワークスペースのデータ移行を行います。 -### v0.23.0 to v0.24.0 +### v0.23.0からv0.24.0 -Upgrade your Twenty instance to use v0.24.0 image +Twentyインスタンスをv0.24.0イメージにアップグレードします。 -Run the following commands: +次のコマンドを実行してください: ``` yarn database:migrate:prod yarn command:prod upgrade-0.24 ``` -The `yarn database:migrate:prod` command will apply the migrations to the database structure (core and metadata schemas) -The `yarn command:prod upgrade-0.24` takes care of the data migration of all workspaces. +`yarn database:migrate:prod` コマンドはデータベース構造(コアおよびメタデータスキーマ)の移行を適用します +`yarn command:prod upgrade-0.24` はすべてのワークスペースのデータ移行を行います。 -### v0.22.0 to v0.23.0 +### v0.22.0からv0.23.0 -Upgrade your Twenty instance to use v0.23.0 image +Twentyインスタンスをv0.23.0イメージにアップグレードします。 -Run the following commands: +次のコマンドを実行してください: ``` yarn database:migrate:prod yarn command:prod upgrade-0.23 ``` -The `yarn database:migrate:prod` command will apply the migrations to the Database. -The `yarn command:prod upgrade-0.23` takes care of the data migration, including transferring activities to tasks/notes. +`yarn database:migrate:prod` コマンドはデータベースへの移行を適用します。 +`yarn command:prod upgrade-0.23` は、アクティビティをタスク/ノートに移行するなど、データ移行を担当します。 +`yarn command:prod upgrade-0.23` は、アクティビティをタスク/ノートに移行するなど、データ移行を担当します。 -### v0.21.0 to v0.22.0 +### v0.21.0からv0.22.0 -Upgrade your Twenty instance to use v0.22.0 image +Twentyインスタンスをv0.22.0イメージにアップグレードします。 -Run the following commands: +次のコマンドを実行してください: ``` yarn database:migrate:prod @@ -376,6 +393,7 @@ yarn command:prod workspace:sync-metadata -f yarn command:prod upgrade-0.22 ``` -The `yarn database:migrate:prod` command will apply the migrations to the Database. -The `yarn command:prod workspace:sync-metadata -f` command will sync the definition of standard objects to the metadata tables and apply to required migrations to existing workspaces. -The `yarn command:prod upgrade-0.22` command will apply specific data transformations to adapt to the new object defaultRequestInstrumentationOptions. +`yarn database:migrate:prod` コマンドはデータベースへの移行を適用します。 +`yarn command:prod upgrade-0.23` は、アクティビティをタスク/ノートに移行するなど、データ移行を担当します。 +"`yarn command:prod workspace:sync-metadata -f` コマンドは、標準オブジェクトの定義をメタデータテーブルに同期し、既存のワークスペースに必要な移行を適用します。" +`yarn command:prod upgrade-0.22` コマンドは、新しいオブジェクトの defaultRequestInstrumentationOptions に適合させるため、特定のデータ変換を適用します。 diff --git a/packages/twenty-docs/l/ja/developers/self-host/self-host.mdx b/packages/twenty-docs/l/ja/developers/self-host/self-host.mdx index 79b6d060df..6e0fb43fa5 100644 --- a/packages/twenty-docs/l/ja/developers/self-host/self-host.mdx +++ b/packages/twenty-docs/l/ja/developers/self-host/self-host.mdx @@ -1,30 +1,30 @@ --- -title: Self-Host -description: Deploy and manage Twenty on your own infrastructure. +title: セルフホスト +description: 独自のインフラで Twenty をデプロイして管理できます。 --- AI -## Overview +## 概要 -Twenty can be self-hosted on your own infrastructure, giving you full control over your data and deployment. +Twenty は独自のインフラでセルフホストでき、データとデプロイを完全に制御できます。 -## Why Self-Host? +## なぜセルフホスト? -* **Data ownership**: Keep all CRM data on your own servers -* **Compliance**: Meet regulatory requirements for data residency -* **Customization**: Full access to modify and extend the platform +* **データの所有権**: すべての CRM データを自社サーバー上に保持 +* **コンプライアンス**: データ所在地に関する規制要件を満たす +* **カスタマイズ**: プラットフォームの変更および拡張に対するフルアクセス -## Getting Started +## 始めに - Quick setup with Docker + Docker でのクイックセットアップ - - Deploy on AWS, GCP, or Azure + + AWS、GCP、または Azure にデプロイ diff --git a/packages/twenty-docs/l/ja/navigation.json b/packages/twenty-docs/l/ja/navigation.json index 8096fbf4ac..7070d9ffc4 100644 --- a/packages/twenty-docs/l/ja/navigation.json +++ b/packages/twenty-docs/l/ja/navigation.json @@ -1,72 +1,72 @@ { "tabs": { "userGuide": { - "label": "User Guide", + "label": "ユーザーガイド", "groups": { "discoverTwenty": { - "label": "Discover Twenty", + "label": "Twenty を知る", "groups": { "gettingStartedCapabilities": { - "label": "Capabilities" + "label": "機能" }, "gettingStartedHowTos": { - "label": "How-Tos" + "label": "ハウツー" } } }, "dataModel": { - "label": "Data Model", + "label": "データモデル", "groups": { "dataModelCapabilities": { - "label": "Capabilities" + "label": "機能" }, "dataModelHowTos": { - "label": "How-Tos" + "label": "ハウツー" } } }, "dataMigration": { - "label": "Data Migration", + "label": "データ移行", "groups": { "dataMigrationCapabilities": { - "label": "Capabilities" + "label": "機能" }, "dataMigrationHowTos": { - "label": "How-Tos" + "label": "ハウツー" } } }, "calendarEmails": { - "label": "Calendar & Emails", + "label": "カレンダーとメール", "groups": { "calendarEmailsCapabilities": { - "label": "Capabilities" + "label": "機能" }, "calendarEmailsHowTos": { - "label": "How-Tos" + "label": "ハウツー" } } }, "workflows": { - "label": "Workflows", + "label": "ワークフロー", "groups": { "workflowsCapabilities": { - "label": "Capabilities" + "label": "機能" }, "workflowsHowTos": { - "label": "How-Tos", + "label": "ハウツー", "groups": { "crmAutomations": { - "label": "CRM Automations" + "label": "CRM の自動化" }, "connectToOtherTools": { - "label": "Connect to Other Tools" + "label": "他のツールと連携" }, "advancedConfigurations": { - "label": "Advanced Configurations" + "label": "高度な設定" }, "needMoreHelp": { - "label": "Need More Help" + "label": "さらにヘルプが必要な場合" } } } @@ -76,122 +76,122 @@ "label": "AI", "groups": { "aiCapabilities": { - "label": "Capabilities" + "label": "機能" }, "aiHowTos": { - "label": "How-Tos" + "label": "ハウツー" } } }, "viewsPipelines": { - "label": "Views & Pipelines", + "label": "ビューとパイプライン", "groups": { "viewsPipelinesCapabilities": { - "label": "Capabilities" + "label": "機能" }, "viewsPipelinesHowTos": { - "label": "How-Tos" + "label": "ハウツー" } } }, "dashboards": { - "label": "Dashboards", + "label": "ダッシュボード", "groups": { "dashboardsCapabilities": { - "label": "Capabilities" + "label": "機能" }, "dashboardsHowTos": { - "label": "How-Tos" + "label": "ハウツー" } } }, "permissionsAccess": { - "label": "Permissions & Access", + "label": "権限とアクセス", "groups": { "permissionsAccessCapabilities": { - "label": "Capabilities" + "label": "機能" }, "permissionsAccessHowTos": { - "label": "How-Tos" + "label": "ハウツー" } } }, "billing": { - "label": "Billing", + "label": "請求", "groups": { "billingCapabilities": { - "label": "Capabilities" + "label": "機能" }, "billingHowTos": { - "label": "How-Tos" + "label": "ハウツー" } } }, "settings": { - "label": "Settings", + "label": "設定", "groups": { "settingsCapabilities": { - "label": "Capabilities" + "label": "機能" }, "settingsHowTos": { - "label": "How-Tos" + "label": "ハウツー" } } } } }, "developers": { - "label": "Developers", + "label": "開発者", "groups": { "developersGroup": { - "label": "Developers" + "label": "開発者" }, "extend": { - "label": "Extend", + "label": "拡張", "groups": { "extendCapabilities": { - "label": "Capabilities" + "label": "機能" } } }, "selfHost": { - "label": "Self-Host", + "label": "セルフホスト", "groups": { "selfHostCapabilities": { - "label": "Capabilities" + "label": "機能" } } }, "contribute": { - "label": "Contribute", + "label": "貢献", "groups": { "contributeCapabilities": { - "label": "Capabilities", + "label": "機能", "groups": { "frontendDevelopment": { - "label": "Frontend Development", + "label": "フロントエンド開発", "groups": { "twentyUi": { "label": "Twenty UI", "groups": { "display": { - "label": "Display" + "label": "表示" }, "feedback": { - "label": "Feedback" + "label": "フィードバック" }, "input": { - "label": "Input" + "label": "入力" }, "navigation": { - "label": "Navigation" + "label": "ナビゲーション" } } } } }, "backendDevelopment": { - "label": "Backend Development" + "label": "バックエンド開発" } } } diff --git a/packages/twenty-docs/l/ja/twenty-ui/display/app-tooltip.mdx b/packages/twenty-docs/l/ja/twenty-ui/display/app-tooltip.mdx index 4e620eedc7..5520b12b8d 100644 --- a/packages/twenty-docs/l/ja/twenty-ui/display/app-tooltip.mdx +++ b/packages/twenty-docs/l/ja/twenty-ui/display/app-tooltip.mdx @@ -1,16 +1,16 @@ --- -title: App Tooltip +title: アプリツールチップ image: /images/user-guide/tips/light-bulb.png --- - Header + ヘッダー -A brief message that displays additional information when a user interacts with an element. +ユーザーが要素とやり取りするときに追加情報を表示する短いメッセージ。 - + ```jsx import { AppTooltip } from "@/ui/display/tooltip/AppTooltip"; @@ -37,27 +37,27 @@ A brief message that displays additional information when a user interacts with ``` - - | Props | Type | Description | - | ---------------- | ---------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | - | className | string | Optional CSS class for additional styling | - | anchorSelect | CSS selector | Selector for the tooltip anchor (the element that triggers the tooltip) | - | content | string | The content you want to display within the tooltip | - | delayHide | number | The delay in seconds before hiding the tooltip after the cursor leaves the anchor | - | offset | number | The offset in pixels for positioning the tooltip | - | noArrow | boolean | If `true`, hides the arrow on the tooltip | - | isOpen | boolean | If `true`, the tooltip is open by default | - | place | `PlacesType` string from `react-tooltip` | Specifies the placement of the tooltip. Values include `bottom`, `left`, `right`, `top`, `top-start`, `top-end`, `right-start`, `right-end`, `bottom-start`, `bottom-end`, `left-start`, and `left-end` | - | positionStrategy | `PositionStrategy` string from `react-tooltip` | Position strategy for the tooltip. Has two values: `absolute` and `fixed` | + + | プロパティ | タイプ | 説明 | + | ---------------- | --------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------- | + | className | string | 追加のスタイリング用のオプションのCSSクラス | + | anchorSelect | CSSセレクタ | ツールチップのアンカー(ツールチップをトリガーする要素)のセレクタ | + | content | string | ツールチップ内に表示したいコンテンツ | + | delayHide | 数 | アンカーからカーソルが離れた後、ツールチップを非表示にする前の遅延(秒) | + | offset | 数 | ツールチップの位置を決めるためのオフセット(ピクセル) | + | noArrow | ブール型 | `true`の場合、ツールチップの矢印を非表示にします | + | isOpen | ブール型 | `true`の場合、ツールチップはデフォルトで開かれています | + | place | `react-tooltip`からの`PlacesType`文字列 | ツールチップの配置を指定します。 値は`bottom`、`left`、`right`、`top`、`top-start`、`top-end`、`right-start`、`right-end`、`bottom-start`、`bottom-end`、`left-start`、`left-end`などがあります | + | positionStrategy | `react-tooltip`からの`PositionStrategy`文字列 | ツールチップの位置戦略。 2つの値があります: `absolute` と `fixed` | -## Overflowing Text with Tooltip +## ツールチップを伴うオーバーフローテキスト -Handles overflowing text and displays a tooltip when the text overflows. +オーバーフローテキストを処理し、テキストがオーバーフローしたときにツールチップを表示します。 - + ```jsx import { OverflowingTextWithTooltip } from 'twenty-ui/display'; @@ -70,9 +70,9 @@ Handles overflowing text and displays a tooltip when the text overflows. ``` - - | Props | Type | Description | - | ----- | ------ | ------------------------------------------------------------ | - | text | string | The content you want to display in the overflowing text area | + + | プロパティ | タイプ | 説明 | + | ----- | ------ | -------------------------- | + | テキスト | string | オーバーフローテキストエリア内に表示したいコンテンツ | diff --git a/packages/twenty-docs/l/ja/twenty-ui/display/checkmark.mdx b/packages/twenty-docs/l/ja/twenty-ui/display/checkmark.mdx index ef84d5c2d5..2dfeb29077 100644 --- a/packages/twenty-docs/l/ja/twenty-ui/display/checkmark.mdx +++ b/packages/twenty-docs/l/ja/twenty-ui/display/checkmark.mdx @@ -1,16 +1,16 @@ --- -title: Checkmark -image: /images/user-guide/tasks/tasks_header.png +title: チェックマーク +image: '""' --- - Header + ヘッダー -Represents a successful or completed action. +成功したまたは完了したアクションを示します。 - + ```jsx import { Checkmark } from 'twenty-ui/display'; @@ -20,17 +20,17 @@ Represents a successful or completed action. ``` - - Extends `React.ComponentPropsWithoutRef<'div'>` and accepts all the props of a regular `div` element. + + `div` 要素の全てのプロパティを受け取る他、`React.ComponentPropsWithoutRef<'div'>`を拡張します。 -## Animated Checkmark +## アニメーション付きチェックマーク -Represents a checkmark icon with the added feature of animation. +アニメーション機能を追加したチェックマークアイコンを示します。 - + ```jsx import { AnimatedCheckmark } from 'twenty-ui/display'; @@ -47,12 +47,12 @@ Represents a checkmark icon with the added feature of animation. ``` - - | Props | Type | Description | Default | - | ----------- | ------- | ------------------------------------------- | ----------- | - | isAnimating | boolean | Controls whether the checkmark is animating | false | - | color | string | Color of the checkmark | | - | duration | number | The duration of the animation in seconds | 0.5 seconds | - | size | number | The size of the checkmark | 28 pixels | + + | プロパティ | タイプ | 説明 | デフォルト | + | ---------- | ------ | --------------------- | ------ | + | アニメーションの有無 | ブール型 | チェックマークのアニメーションを制御します | 偽 | + | カラー | string | チェックマークの色 | | + | 継続時間 | 数 | アニメーションの持続時間(秒) | 0.5秒 | + | サイズ | 数 | チェックマークのサイズ | 28ピクセル | diff --git a/packages/twenty-docs/l/ja/twenty-ui/display/chip.mdx b/packages/twenty-docs/l/ja/twenty-ui/display/chip.mdx index ded2fd1c77..0796f8fe54 100644 --- a/packages/twenty-docs/l/ja/twenty-ui/display/chip.mdx +++ b/packages/twenty-docs/l/ja/twenty-ui/display/chip.mdx @@ -1,16 +1,16 @@ --- -title: Chip +title: チップ image: /images/user-guide/github/github-header.png --- - Header + ヘッダー -A visual element that you can use as a clickable or non-clickable container with a label, optional left and right components, and various styling options to display labels and tags. +ラベル、オプションの左および右コンポーネント、さまざまなスタイルオプションを使用してラベルやタグを表示するクリック可能または非クリック可能なコンテナとして使用できるビジュアル要素。 - + ```jsx import { Chip } from 'twenty-ui/components'; @@ -33,22 +33,22 @@ A visual element that you can use as a clickable or non-clickable container with ``` - - | Props | Type | Description | - | ------------ | ------------------------ | -------------------------------------------------------------------------------------------- | - | linkToEntity | string | The link to the entity | - | entityId | string | The unique identifier for the entity | - | name | string | The name of the entity | - | pictureUrl | string | s picture", | - | avatarType | Avatar Type | The type of avatar you want to display. Has two options: `rounded` and `squared` | - | variant | `EntityChipVariant` enum | Variant of the entity chip you want to display. Has two options: `regular` and `transparent` | - | LeftIcon | IconComponent | A React component representing an icon. Displayed on the left side of the chip | + + | プロパティ | タイプ | 説明 | + | ------------ | ----------------------- | -------------------------------------------------------- | + | linkToEntity | string | エンティティへのリンク | + | entityId | string | エンティティの一意識別子 | + | 名前 | string | エンティティの名前 | + | pictureUrl | string | 写真", | + | avatarType | アバタータイプ | 表示したいアバターのタイプ。 オプションは2つ:`rounded` と `squared` | + | バリアント | `EntityChipVariant` 列挙型 | 表示したいエンティティチップのバリアント。 オプションは2つ:`regular` と `transparent` | + | 左アイコン | アイコンコンポーネント | アイコンを表す React コンポーネント。 チップの左側に表示されます | -## Examples +## 例 -### Transparent Disabled Chip +### 透明無効チップ ```jsx import { Chip } from 'twenty-ui/components'; @@ -73,7 +73,7 @@ export const MyComponent = () => {
-### Disabled Chip with Tooltip +### ツールチップ付き無効チップ ```jsx import { Chip } from "twenty-ui/components"; @@ -95,12 +95,12 @@ export const MyComponent = () => { }; ``` -## Entity Chip +## エンティティチップ -A Chip-like element to display information about an entity. +エンティティに関する情報を表示するチップ風の要素。 - + ```jsx import { BrowserRouter as Router } from 'react-router-dom'; import { IconTwentyStar } from 'twenty-ui/display'; @@ -124,15 +124,15 @@ A Chip-like element to display information about an entity. ``` - - | Props | Type | Description | - | ------------ | ------------------------ | -------------------------------------------------------------------------------------------- | - | linkToEntity | string | The link to the entity | - | entityId | string | The unique identifier for the entity | - | name | string | The name of the entity | - | pictureUrl | string | s picture", | - | avatarType | Avatar Type | The type of avatar you want to display. Has two options: `rounded` and `squared` | - | variant | `EntityChipVariant` enum | Variant of the entity chip you want to display. Has two options: `regular` and `transparent` | - | LeftIcon | IconComponent | A React component representing an icon. Displayed on the left side of the chip | + + | プロパティ | タイプ | 説明 | + | ------------ | ----------------------- | -------------------------------------------------------- | + | linkToEntity | string | エンティティへのリンク | + | entityId | string | エンティティの一意識別子 | + | 名前 | string | エンティティの名前 | + | pictureUrl | string | 写真", | + | avatarType | アバタータイプ | 表示したいアバターのタイプ。 オプションは2つ:`rounded` と `squared` | + | バリアント | `EntityChipVariant` 列挙型 | 表示したいエンティティチップのバリアント。 オプションは2つ:`regular` と `transparent` | + | 左アイコン | アイコンコンポーネント | アイコンを表す React コンポーネント。 チップの左側に表示されます | diff --git a/packages/twenty-docs/l/ja/twenty-ui/display/icons.mdx b/packages/twenty-docs/l/ja/twenty-ui/display/icons.mdx index 2d73154c8d..db9dafe5b7 100644 --- a/packages/twenty-docs/l/ja/twenty-ui/display/icons.mdx +++ b/packages/twenty-docs/l/ja/twenty-ui/display/icons.mdx @@ -1,20 +1,20 @@ --- -title: Icons +title: アイコン image: /images/user-guide/objects/objects.png --- - Header + ヘッダー -A list of icons used throughout our app. +アプリ全体で使用されるアイコンの一覧。 ## Tabler Icons -We use Tabler icons for React throughout the app. +アプリ全体で React 向けの Tabler Icons を使用しています。 - +
``` @@ -22,8 +22,8 @@ We use Tabler icons for React throughout the app. ```
- - You can import each icon as a component. Here's an example: + + 各アイコンをコンポーネントとしてインポートできます。 例はこちら:
@@ -36,25 +36,25 @@ We use Tabler icons for React throughout the app. ```
- - | Props | Type | Description | Default | - | ------ | ------ | ------------------------------------------ | ------------ | - | size | number | The height and width of the icon in pixels | 24 | - | color | string | The color of the icons | currentColor | - | stroke | number | The stroke width of the icon in pixels | 2 | + + | プロパティ | タイプ | 説明 | デフォルト | + | ----- | ------ | ------------------- | ------------ | + | サイズ | 数 | アイコンの高さと幅(ピクセル単位) | 24 | + | カラー | string | アイコンの色 | currentColor | + | ストローク | 数 | アイコンのストローク幅(ピクセル単位) | 2 |
-## Custom Icons +## カスタムアイコン -In addition to Tabler icons, the app also uses some custom icons. +Tablerアイコンに加えて、アプリにはいくつかのカスタムアイコンも使用されています。 -### Icon Address Book +### アイコンアドレス帳 -Displays an address book icon. +アドレス帳のアイコンを表示します。 - + ```jsx import { IconAddressBook } from 'twenty-ui/display'; @@ -64,10 +64,10 @@ Displays an address book icon. ``` - - | Props | Type | Description | Default | - | ------ | ------ | ------------------------------------------ | ------- | - | size | number | The height and width of the icon in pixels | 24 | - | stroke | number | The stroke width of the icon in pixels | 2 | + + | プロパティ | タイプ | 説明 | デフォルト | + | ----- | --- | ------------------- | ----- | + | サイズ | 数 | アイコンの高さと幅(ピクセル単位) | 24 | + | ストローク | 数 | アイコンのストローク幅(ピクセル単位) | 2 | diff --git a/packages/twenty-docs/l/ja/twenty-ui/display/soon-pill.mdx b/packages/twenty-docs/l/ja/twenty-ui/display/soon-pill.mdx index 56ace0bae7..6a1095d876 100644 --- a/packages/twenty-docs/l/ja/twenty-ui/display/soon-pill.mdx +++ b/packages/twenty-docs/l/ja/twenty-ui/display/soon-pill.mdx @@ -4,10 +4,10 @@ image: /images/user-guide/kanban-views/kanban.png --- - Header + ヘッダー -A small badge or "pill" to indicate something is coming soon. +近日公開を示す小さなバッジ(ピル)です。 ```jsx import { SoonPill } from "@/ui/display/pill/components/SoonPill"; diff --git a/packages/twenty-docs/l/ja/twenty-ui/display/tag.mdx b/packages/twenty-docs/l/ja/twenty-ui/display/tag.mdx index a2226c88d4..76dd8c1e7a 100644 --- a/packages/twenty-docs/l/ja/twenty-ui/display/tag.mdx +++ b/packages/twenty-docs/l/ja/twenty-ui/display/tag.mdx @@ -1,16 +1,16 @@ --- -title: Tag +title: タグ image: /images/user-guide/table-views/table.png --- - Header + ヘッダー -Component to visually categorize or label content. +コンテンツを視覚的に分類またはラベル付けするためのコンポーネント。 - + ```jsx import { Tag } from "@/ui/display/tag/components/Tag"; @@ -19,20 +19,20 @@ Component to visually categorize or label content. console.log("click")} + text="緊急" + onClick={() => console.log("クリック")} /> ); }; ``` - - | Props | Type | Description | - | --------- | -------- | --------------------------------------------------------------------------------------------------------------------------- | - | className | string | Optional name for additional styling | - | color | string | Color of the tag. Options include: `green`, `turquoise`, `sky`, `blue`, `purple`, `pink`, `red`, `orange`, `yellow`, `gray` | - | text | string | The content of the tag | - | onClick | function | Optional function called when a user clicks on the tag | + + | プロパティ | タイプ | 説明 | + | --------- | ------ | ------------------------------------------------------------------------------ | + | className | string | 追加のスタイリングのための任意の名前 | + | カラー | string | タグの色。 オプションは次のとおりです: `緑`, `トルコ石`, `空`, `青`, `紫`, `ピンク`, `赤`, `オレンジ`, `黄`, `灰色` | + | テキスト | string | タグの内容 | + | onClick | 関数 | ユーザーがタグをクリックすると呼び出される任意の関数 | diff --git a/packages/twenty-docs/l/ja/twenty-ui/input.mdx b/packages/twenty-docs/l/ja/twenty-ui/input.mdx index 2da701caf5..2283178d8b 100644 --- a/packages/twenty-docs/l/ja/twenty-ui/input.mdx +++ b/packages/twenty-docs/l/ja/twenty-ui/input.mdx @@ -1,8 +1,8 @@ --- -title: Input +title: 入力 image: /images/user-guide/tips/light-bulb.png --- - Header + ヘッダー diff --git a/packages/twenty-docs/l/ja/twenty-ui/input/block-editor.mdx b/packages/twenty-docs/l/ja/twenty-ui/input/block-editor.mdx index 9943fa5f5d..e4538b01f1 100644 --- a/packages/twenty-docs/l/ja/twenty-ui/input/block-editor.mdx +++ b/packages/twenty-docs/l/ja/twenty-ui/input/block-editor.mdx @@ -1,16 +1,16 @@ --- -title: Block Editor +title: ブロックエディター image: /images/user-guide/api/api.png --- - Header + ヘッダー -Uses a block-based rich text editor from [BlockNote](https://www.blocknotejs.org/) to allow users to edit and view blocks of content. +ブロックベースのリッチテキストエディター[BlockNote](https://www.blocknotejs.org/)を使用して、ユーザーがコンテンツのブロックを編集および表示できるようにします。 - + ```jsx import { useBlockNote } from "@blocknote/react"; import { BlockEditor } from "@/ui/input/editor/components/BlockEditor"; @@ -23,9 +23,9 @@ Uses a block-based rich text editor from [BlockNote](https://www.blocknotejs.org ``` - - | Props | Type | Description | - | ------ | ----------------- | ------------------------------------------ | - | editor | `BlockNoteEditor` | The block editor instance or configuration | + + | プロパティ | タイプ | 説明 | + | ----- | ----------------- | -------------------- | + | エディター | `BlockNoteEditor` | ブロックエディターインスタンスまたは構成 | diff --git a/packages/twenty-docs/l/ja/twenty-ui/input/buttons.mdx b/packages/twenty-docs/l/ja/twenty-ui/input/buttons.mdx index 1c53eb1816..aa52901152 100644 --- a/packages/twenty-docs/l/ja/twenty-ui/input/buttons.mdx +++ b/packages/twenty-docs/l/ja/twenty-ui/input/buttons.mdx @@ -1,18 +1,18 @@ --- -title: Buttons +title: ボタン image: /images/user-guide/views/filter.png --- - Header + ヘッダー -A list of buttons and button groups used throughout the app. +アプリ全体で使用されるボタンおよびボタングループの一覧。 -## Button +## ボタン - + ```jsx import { Button } from "@/ui/input/button/components/Button"; @@ -21,7 +21,7 @@ A list of buttons and button groups used throughout the app.