Skip to content

第三篇:架构篇

定义产品的「怎么构建」


概述

架构篇回答四个核心问题:

  1. 用什么技术?技术选型
  2. 整体怎么组织?系统架构
  3. 页面怎么跳转?导航系统
  4. 数据怎么管理?状态管理

章节导航

第七章:技术选型

定义技术栈及选型理由。

要点

  • React 19 + Vite 7:现代前端框架
  • TanStack 全家桶:状态管理统一方案
  • shadcn/ui + Tailwind CSS 4:组件与样式

第八章:系统架构

定义分层架构和模块划分。

要点

  • UI 层、状态层、服务层、平台层
  • 模块化设计,职责清晰
  • 依赖注入,便于测试

第九章:导航系统

定义 Stackflow 导航配置。

要点

  • 栈式导航,原生体验
  • Activity 模式,参数传递
  • URL 同步,支持 hash 路由

第十章:状态管理

定义 TanStack Store/Query 使用方案。

要点

  • 本地状态:TanStack Store
  • 服务端状态:TanStack Query
  • 状态持久化策略

第十四章:Amount 类型系统

定义类型安全的货币金额处理方案。

要点

  • Amount 不可变类型,携带 decimals 和 symbol 元数据
  • 工厂方法:fromRaw()、fromFormatted()、zero()
  • 精确算术操作,避免 JavaScript 浮点数精度问题
  • 序列化/反序列化支持

本篇来源

本篇内容主要来源于 TDD.md(技术设计文档)。


下一篇

完成架构篇后,继续阅读 第四篇:服务篇,了解服务层设计。

Released under the MIT License.