Bookshelf 项目剖析

Bookshelf 书架也许跟你的真实业务场景比较接近，而且我这儿特意为你搭了一个移动端的脚手架。这个项目会涵盖典型的 CRUD 操作，期望你通过 TDD 的方式，重新思考什么是前端开发的最佳实践和撸码节奏。

TDD生命周期（TDD Lifecycle）

业务功能

用例即规范（SbE）

这是一个典型的用例即规范(Specification by example)示例，测试用例就是需求说明，下面我将通过用户故事的方式为你列举所有的需求功能点。

用户故事 1：书架首页（list + filter）

作为一名读者，我想在进入首页时看到最新推荐的十本书，从而我能更方便挑选当前最受欢迎的书籍。

作为一名读者，我能在首页点击标签对书籍种类进行筛选，从而我可以根据自己感兴趣的主题挑选书籍。

用户故事 2：书籍详情（detail）

作为一名读者，我想点击书籍封面进入书籍详情页，从而我能更详细得查看书籍内容及其评论列表。

用户故事 3：添加推荐（add）

作为一名用户，我想有一个添加推荐的表单页面，从而我能为别的读者推荐我认为对别人有帮助的书籍。

用户故事 4：推荐列表（list）

作为一名用户，我能看到某个分类下所有推荐书目，从而我能根据分类找到所有相关的书籍。

用户故事 5：我要评论（add）

作为一名读者，我想在书籍详情页进行评论，从而我能够表达我对这本书的喜欢或者更多情感上的表达。

用户故事 6：评论排行榜（list）

作为一名读者，我想看到书籍详情页的评论点赞排行，从而我能够更快找出有价值的评论以供参考。

技能要求

1. 使用 Pact 编写契约测试，驱动 API 接口设计

2. 使用 Cypress 编写 E2E 测试，驱动出组件拆分

3. 使用 Jest 编写 Redux 数据流测试，合理解耦状态管理

4. 使用 Testing Library 编写组件单元测试，驱动组件接口设计

5. 使用 Storybook 验证组件样式，根据反馈快速调整 UI Stories

6. 保持！刻意练习的节奏，重复练习！

任务拆解

本项目分为 4 个任务：

• 任务 1：API 契约测试

• 任务 2：组件化与数据流管理

• 任务 3：Redux 数据流测试

• 任务 4：简化 Redux 项目结构