docs: 增加设计理念的阐述

ProtoTeam · Aug 3, 2020 · 408dac4 · 408dac4
1 parent 3cff75a
commit 408dac4
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 6 deletions.
diff --git a/README.md b/README.md
@@ -18,13 +18,42 @@
 一个从蚂蚁数据平台孵化出的前端 SPA 框架，她专为开发复杂 web 应用而生。
 在蚂蚁内部，我们喜欢叫她 KOP（King Of Prediction），而在外部，我们将其命名为 redux-with-domain，这样更能见名知意一些。
 
-## 特性
+## 设计理念
 
 1. 领域驱动设计
+![ddd](https://lark-assets-prod-aliyun.oss-cn-hangzhou.aliyuncs.com/yuque/0/2020/jpeg/154392/1596438400628-resources/1567026/jpg/b23d804c-8068-4537-8a7b-c57c2d511095.jpeg?OSSAccessKeyId=LTAI4GGhPJmQ4HWCmhDAn4F5&Expires=1596440419&Signature=YHBKG6U5%2BuxdQ%2FiHUdtqPKD10QM%3D)
+
+    领域驱动是为了提升架构的稳定性，在展开之前，先介绍一下概念：
+
+    1. 领域即应用软件的问题域，问题域一旦确定，边界与最优解随之确定。
+    2. 领域知识即业务流程与规则。
+    3. 而领域模型则是对领域知识的严格组织和选择性的抽象。
+
+    在传统的前端开发流程中，前端和业务之间是通过视觉稿来联系的，一个需求对应一个视觉稿，视觉稿的变更即代表了需求的变更，随之带来大量的修改成本，像组件UI，业务逻辑和状态管理等，在这种模式下存在 2 个问题：
+    - 视觉稿与真实的业务诉求存在偏差，开发者没法理解真实的业务需求，很难触及用户的真实痛点
+    - 见山便是山的开发方式，很难沉淀出稳定的功能结构，容易产生历史包袱，从而复杂度不易收敛
+
+    而领域驱动设计的开发流程，会先由业务专家和开发团队根据领域知识与业务期望从问题域中抽象出稳定的领域模型，
+    因为领域模型是现实世界中业务的映射，所以天然与UI无关。
+    有了稳定的模型，再去搭建上层的业务逻辑，不易受到需求的冲击。
+    而这时，组件层只需实现视觉稿与和组装业务逻辑，可以有很高的灵活性。
+    并且因为数据层与逻辑层的稳定，多端适配和数据同步的问题也很容易得到解决。
 
 2. 状态分层
+![layer](https://lark-assets-prod-aliyun.oss-cn-hangzhou.aliyuncs.com/yuque/0/2020/jpeg/154392/1596438432465-resources/1567026/jpg/07f756a8-83bd-45e2-bf67-db721f59c151.jpeg?OSSAccessKeyId=LTAI4GGhPJmQ4HWCmhDAn4F5&Expires=1596440235&Signature=ZUXEUR4iHgzxOFWOQqHs%2FdHbRHs%3D)
+状态分层为了解决 3 类问题：
+    1. view ：视图组件不再通用，出现大量雷同的组件，复用性降低
+    2. state ：redux体系下随着迭代的进行，中间状态不断膨胀，导致复杂度无法收敛
+    3. control： 业务逻辑分散，随着人员更替，模块定位不再清晰，模块边界逐渐模糊
+
+    通过区分视图状态和数据状态，由 page Module 负责页面级别的状态，承担组装与调度功能模块的职责，contianer Module 聚焦于功能模块内部的状态管理，而 domain Module 则单独处理业务数据的状态，通过分层的拆解，页面整体的复杂度不会再随迭代的进行而膨胀。
 
 ## demos
+基于 BI 为原型开发的 redux-with-domain 例子。演示了如何使用 redux-with-domain 解决复杂前端项目的架构问题。
+[simple-BI](./examples/simple-BI)
+
+## api
+
 
 ## License
 [MIT](https://tldrlegal.com/license/mit-license)
diff --git a/examples/simple-BI/README.md b/examples/simple-BI/README.md
@@ -9,8 +9,3 @@ npm i
 npm run start
 // 自动打开 localhost:3000
 ```
-
-注意：如果是本地 redux-with-domain 时，启动之后出现 invalid hooks 的报错，需要在 kop 项目下 link 这里的 React。
-比如，假设 redux-with-domain 和 example 同级： `tnpm link ../kop-example/examples/simple-BI/node_modules/react`
-
-如果提示babel的版本问题，请删除根目录下的 node_module， 回到 sinple-BI 下重试