第五题:ShoppingCart 购物车
现在,终极大 boss 来了!你将要实现一个电商网站的 ShoppingCart 购物车,用于商品购买时的计算和结账,以及 B 端后台的商品管理(上架/下架),包 含用户登陆。
- 1.掌握由外到内的前端测试驱动开发节奏;
- 2.熟练掌握多维度的测试覆盖及其测试重点
- 3.刻意练习前端组件拆分与单向数据流管理
- 4.至少练习 3 遍 CommentBox 组件开发
- 5.能在 1 小时内完成 CommentBox 题目
力求掌握:
- 以终为始:每次编码明确需求目标,明晰用户行为验收路径;
- 任务分解:实例化需求产出测试用例,框定需求范围减少浪费;
- 自动化测试:让机器给予你最及时的反馈,提供功能回归保障;
- 持续重构:调整程序代码改善软件的质量、性能,快速响应变化。
4 小时
总时长 | 任务 1 | 任务 2 | 任务 3 | 任务 4 |
任务 | 任务分解 - 驱动组件树拆分 | 综合应用 - 驱动组件接口设计 | 综合应用 - 驱动数据流管理 | 综合应用 - 驱动组件样式开发 |
4h | 1h | 1h | 1h | 1h |
- 从需求出发 BDD,ATDD,SpecByExample, UserStory
- 完整的 TDD 实例,完成页面 UI 拆分和组件开发,Visual Testing
- 多种用户角色参与,全流程的「商品管理 + 购物车购买」测试路径
- 建立在充分覆盖且运行快速的自动化测试基础上的持续集成/持续交付
- 私人收藏 React Hook 模板代码

React Hook Snippets