文章目录
从设计稿开始
我们需要有一个返回 JSON 的 API（后端支持），以及设计师提供的组件设计稿。
将设计好的 UI 划分为组件层级
首先，你需要在设计稿上用方框圈出每一个组件（包括它们的子组件），并且以合适的名称命名。
然后，把这些组件描述为更加清晰的层级，比如父子或者兄弟节点。
组件划分的标准：
- 你可以将组件当作一种函数或者是对象来考虑，根据单一功能原则来判定组件的范围。
- UI组件结构一般会与API提供的 JSON 数据模型一一对应。
- 组件的划分并不存在唯一的结果，根据个人偏好进行合理的划分即可。
用已有的数据模型渲染一个不包含交互功能的 UI
你可以自上而下或者自下而上构建应用：
自上而下意味着首先编写层级较高的组件，当你的应用比较简单时，使用自上而下的方式更方便。
自下而上意味着从最基本的组件开始编写，对于较为大型的项目来说，自下而上地构建，并同时为低层组件编写测试是更加简单的方式。
为UI添加交互功能
需要使用 JS 和 数据状态 来实现UI变动、数据模型变动等交互功能。
实例
https://zh-hans.reactjs.org/docs/thinking-in-react.html
