TDD Coding:模仿 react-network 自动显示在线/离线 UIs

@JimmyLv 2017-11-14 15:12:20发表于 JimmyLv/jimmylv.github.io

项目纵向拆分

https://github.com/reacttraining/react-network

<Network render={({ online }) =>
    <p>You are online: {online ? 'Yep' : 'Nope'}.</p>
  }/>

这是一道好题目,主要是因为:

  • 涉及到外部依赖(fetch),即需要 mock/stub/spy 等
  • 明显的 if-else branch,罗列 case 穷尽可能性,比如网速区间
  • UI 显示可以作为选题扩展,即不用 string 而是 ReactNode
  • 很显然的 renderProps 实践,可对比 HOC 实现

⓵ 定义目标和原则

⓶ 展望结果(OKRs)

⓷ 头脑风暴(发散)

⓸ 组织整理(收敛)

⓹ 明确「下一步行动」