用途
本阶段用于实现实际的前端界面，并将其与后端 API 集成。具体包括：使用设计系统组件开发各个页面、管理客户端状态、调用后端 API、处理加载与错误状态。
主要能力
页面实现
开发每个屏幕页面，产出页面组件（pages）、功能组件（features）和 API 调用钩子（hooks）。
集中式 API 客户端架构
采用三层结构：
- UI 组件层（pages、features、hooks）
- Service 层（按领域划分的 API 调用函数，如 authService、productService、orderService）
- API Client 层（通用设置、拦截器、错误处理，如 apiClient）
集中式客户端的优势：统一错误处理逻辑、自动注入认证令牌、标准化响应格式、端点变更时单点管理、便于测试与 mock 替换。
Service 层模式
按领域拆分服务文件，例如 auth.service.ts、product.service.ts、order.service.ts，每个服务仅使用 apiClient。
错误处理
提供全局错误处理器，按错误码分类处理：认证错误重定向、权限错误提示、网络错误提示、表单验证错误交由表单处理。同时提供 ApiError 类，包含 isValidationError、isAuthError、isForbiddenError、isNotFoundError 等判断方法。
客户端-服务端类型共享
提供三种方式：共享包（Monorepo）、从 API 规范自动生成类型、tRPC / GraphQL CodeGen 自动推断。
API 集成模式
支持基础 fetch 模式、React Query 模式、SWR 模式。
状态管理指南
- 服务端状态（API 数据）→ React Query / SWR
- 客户端状态（UI 状态）→ useState / useReducer
- 全局状态（认证等）→ Context / Zustand
- 表单状态 → React Hook Form
零脚本 QA
通过日志验证 UI 行为，例如登录流程的日志输出。
使用方式
本阶段遵循 PDCA 循环：
- Plan：定义要实现的屏幕/功能
- Design：组件结构、状态管理设计
- Do：UI 实现 + API 集成
- Check：零脚本 QA
- Act：修复缺陷并进入 Phase 7
按级别应用：
- Starter：仅静态 UI（无 API 集成）
- Dynamic：完整集成
- Enterprise：完整集成 + 优化
适用场景
适用于需要将前端界面与后端接口对接的开发项目，尤其是采用 React 生态、需要统一 API 调用规范和错误处理机制的前端工程。
限制
资料未提供具体的收费、价格、平台限制等信息。