ddd-architect

---

name: ddd-architect description: Ensure code follows DDD architecture and DAL separation for both frontend and backend. Triggers: DDD, arch, 架構, 新功能, 新模組, new feature, scaffold, 骨架, domain, layer, 分層, structure, 結構, backend, frontend, React, Vue, Python, TypeScript, 前端, 後端, component, 元件. version: 2.1.0 category: architecture compatibility:

• claude-code
• github-copilot
• vscode
• codex-cli dependencies: [] allowed-tools:
• read_file
• write_file
• create_file
• create_directory
• list_dir
• grep_search
• semantic_search

---

DDD 架構輔助技能

描述

確保前後端程式碼遵循 DDD 架構與 DAL 分離原則。

觸發條件

• 「建立新功能」「新增模組」
• 「架構檢查」
• 建立新檔案時自動檢查
• 「前端架構」「後端架構」

法規依據

• 憲法：CONSTITUTION.md 第 1、2 條
• 子法：.github/bylaws/ddd-architecture.md

---

🔧 後端 DDD 結構 (Python/Go/Rust)

新功能腳手架

當建立新功能時，自動生成 DDD 結構：

「新增 Order 領域」

生成：
src/
├── Domain/
│   ├── Entities/Order.py
│   ├── ValueObjects/OrderId.py
│   ├── Aggregates/OrderAggregate.py
│   └── Repositories/IOrderRepository.py
├── Application/
│   ├── UseCases/CreateOrder.py
│   └── DTOs/OrderDTO.py
└── Infrastructure/
    └── Persistence/Repositories/OrderRepository.py

層級職責

層級	職責	可依賴
Domain	業務規則、Entity、Value Object	無外部依賴
Application	Use Case、DTO、編排	Domain
Infrastructure	Repository 實作、外部 API	Domain
Presentation	API、CLI、UI	Application

---

⚛️ 前端 DDD 結構 (React/Vue)

React 專案結構

「新增 User 管理功能 (React)」

生成：
src/
├── domain/
│   ├── models/
│   │   └── User.ts              # Entity 類型定義
│   ├── types/
│   │   └── UserTypes.ts         # Value Object 類型
│   └── rules/
│       └── userValidation.ts    # 純業務規則（無框架依賴）
│
├── application/
│   ├── hooks/
│   │   └── useUser.ts           # 業務邏輯 Hook
│   ├── stores/
│   │   └── userStore.ts         # 狀態管理 (Zustand/Redux)
│   └── services/
│       └── UserService.ts       # 應用服務（編排）
│
├── infrastructure/
│   ├── api/
│   │   └── userApi.ts           # API Client (fetch/axios)
│   ├── storage/
│   │   └── userStorage.ts       # LocalStorage/SessionStorage
│   └── adapters/
│       └── userAdapter.ts       # API Response → Domain Model
│
└── presentation/
    ├── components/
    │   └── UserCard.tsx         # UI 元件
    ├── pages/
    │   └── UserListPage.tsx     # 頁面
    └── layouts/
        └── UserLayout.tsx       # 佈局

Vue 3 專案結構

「新增 Product 管理功能 (Vue)」

生成：
src/
├── domain/
│   ├── models/
│   │   └── Product.ts
│   ├── types/
│   │   └── ProductTypes.ts
│   └── rules/
│       └── productValidation.ts
│
├── application/
│   ├── composables/
│   │   └── useProduct.ts        # Composition API
│   ├── stores/
│   │   └── productStore.ts      # Pinia Store
│   └── services/
│       └── ProductService.ts
│
├── infrastructure/
│   ├── api/
│   │   └── productApi.ts
│   └── adapters/
│       └── productAdapter.ts
│
└── presentation/
    ├── components/
    │   └── ProductCard.vue
    ├── views/
    │   └── ProductListView.vue
    └── layouts/
        └── ProductLayout.vue

前端層級對照

層級	React	Vue 3	職責
Domain	models/, types/, rules/	同左	純 TypeScript，無框架
Application	hooks/, stores/	composables/, stores/	業務邏輯封裝
Infrastructure	api/, adapters/	同左	外部服務對接
Presentation	components/, pages/	components/, views/	UI 元件

---

🔍 架構違規檢查

後端違規

偵測並警告：

• ❌ Domain 層導入 Infrastructure
• ❌ 直接在 Domain 操作資料庫
• ❌ Application 層直接操作資料庫
• ❌ Repository 實作放在 Domain 層

前端違規

偵測並警告：

• ❌ Domain 層導入 React/Vue（應為純 TypeScript）
• ❌ 元件直接呼叫 API（應透過 hooks/composables）
• ❌ 將業務邏輯寫在元件內
• ❌ API Response 直接用於 UI（應經過 adapter 轉換）

依賴方向驗證

✅ Presentation → Application → Domain
✅ Infrastructure → Domain (實作介面)
❌ Domain → Infrastructure
❌ Domain → Application
❌ Domain → React/Vue/框架

---

📋 檢查範本

後端輸出

🏗️ DDD 架構檢查 (Backend)

✅ 依賴方向正確
✅ DAL 正確分離
⚠️ 警告：
  - src/Domain/Services/UserService.py:15
    導入了 Infrastructure 模組

建議：
  將資料庫操作移至 Repository

前端輸出

🏗️ DDD 架構檢查 (Frontend - React)

✅ Domain 層無框架依賴
✅ API 呼叫正確封裝於 infrastructure/
⚠️ 警告：
  - src/presentation/components/UserCard.tsx:23
    直接呼叫 fetch()，應使用 useUser hook

建議：
  將 API 呼叫移至 src/application/hooks/useUser.ts

---

🎯 快速生成指令

「建立後端 Order 領域」    → 生成 Python DDD 結構
「建立前端 User 功能」     → 詢問 React/Vue，生成對應結構
「架構檢查」               → 掃描全專案違規
「前端架構檢查」           → 僅掃描前端