11.项目设计 12项目流程
2020-04-16 11:11:02 0 举报AI智能生成
项目设计 项目流程
作者其他创作
大纲/内容
第11章 项目设计
11-1 面试为何会考察组件和状态设计
组件和状态设计
面试要求
1. 框架（Vue React）的使用（和高级特性）是必要条件 <br>2. 能独立负责项目？还是需要别人带着？——考察设计能力<br>3. 面试必考（二面/三面），场景题
考察重点
1. 数据驱动视图<br>2. 状态：数据结构设计（React-state Vue-data）<br>3. 视图：组件结构和拆分
回顾面试题
1. React设计todolist(组件结构，redux state数据结构)<br>2. Vue设计购物车（组件结构 ，vuex state数据结构）
11-2 状态设计的思路和要点<br>11-3 组件设计的思路和要点<br>11-4 React实现TodoList代码演示<br>11-5 组件设计和状态设计的总结<br>
React实现Todo List
1. state数据结构设计<br>2. 组件设计（拆分、组合）和组件通讯<br>3. 代码演示
设计原型图
state数据结构设计
设计原则
1. 用数据描述所有的内容<br>2. 数据要结构化，易于程序操作（遍历、查找）<br>3. 数据要可扩展，以便增加新的功能
每个数据都要有一个id,<br>并且id不能重复
组件设计
设计原则
1. 从功能上拆分层次<br>2. 尽量让组件原子化<br>3. 容器组件（只管理数据）& UI组件（只显示视图）
红色，容器组件<br>绿色，显示<br>
代码演示
容器组件App
定义状态List<br>以及List如何新增、如何删除、如何切换完成状态
Input
负责把新输入的内容回传给App
List
负责把list列表渲染出来<br>列表的每一项交给ListItem渲染
ListItem
切换完成状态和删除，调用外层传给它的方法即可
总结
1. state数据结构设计<br>2. 组件设计 组件通讯<br>3. 结合redux
11-6 Vue实现购物车-你将如何设计<br>11-7 Vue实现购物车data如何设计<br>11-8 Vue实现购物车-组件设计和代码演<br>11-9 结合vuex实现购物车<br>
Vue实现购物车
1. data数据结构设计<br>2. 组件设计和组件通讯<br>3. 代码演示
设计原型图
data数据结构设计
1. 数据描述所有的内容<br>2. 数据要结构化，易于程序操作（遍历、查找）<br>3. 数据要可扩展，以便增加新的功能
组件设计
1. 从功能上拆分层次<br>2. 尽量让组件原子化<br>3. 容器组件（只管理数据）& UI组件（只显示视图）
代码演示
容器组件index.vue<br>
index.vue
管理所有的数据以及数据的变化，<br>怎么加入购物车，<br>怎么删除购物车的条目
产品列表组件<br>ProductionList<br>
index.vue
index.vue
渲染产品列表
ProductionItem.vue
ProductionItem.vue<br>
渲染商品条目<br>调用父类的方法，加入购物车
购物车列表组件<br>CartList<br>
index.vue
index.vue
渲染购物车列表
重新合并list数据（使用id将ProductionList和CartList中的商品关联起来）<br>计算购物车总金额
CartItem.vue
<br>调用父类方法，增加或者减少购物车中商品的数量
vuex实现购物车<br>
https://github.com/vuejs/vuex/tree/dev/examples/shopping-cart
目录结构
目录结构
数据结构设计
内容太长，看git代码吧。。。<br>体会一下使用vuex和不适用vuex实现购物车时，组件设计、数据管理的差异<br><br>
11-10 状态设计和组件设计的考点总结
第12章 项目流程
12-1 面试为何会考察项目流程
项目流程
1. 项目分多人、多角色参与<br>2. 项目分多阶段<br>3. 项目需要计划和执行
为什么考察项目流程
1. 确定你真正参加过实际项目（而不是个人项目、毕业设计等）<br>2. 确定你能真正解决项目的问题<br>3. 看你能否独立承担起一个项目（作为项目负责人）
看几个面试题
1. PM想再项目开发过程中增加需求，该怎么办?<br>2. 项目即将延期了，该怎么办？<br>3. 你将如何保证项目质量？
如何讲解
1. 项目的所有角色<br>2. 项目的全流程<br>3. 各个阶段中的常见问题
12-2 和前端开发相关的项目角色有哪些
项目角色
1. PM 产品经理<br>2. UE 视觉设计师<br>3. FE 前端开发<br>4. RD 后端开发<br>5. CRD 移动端开发
12-3 一个完整的项目要分哪些阶段
完整项目流程
12-4 评审项目需求时需要注意哪些事项
Stage1-需求分析
1. 了解背景<br>2. 质疑需求是否合理<br>3. 需求是否闭环，有来有去<br>4. 开发难度如何<br>5. 是否需要其他支持<br>6. 不要急于给排期
12-5 如何做好技术方案设计
Stage2-技术方案设计
1. 求简，不过多设计<br>2. 产出文档<br>3. 找准设计重点（数据结构设计、组件设计。。。）<br>4. 组内评审<br>5. 和RD CRD沟通<br>6. 发出会议结论
12-6 如何保证代码质量
Stage3-开发
1. 如何反馈排期（留buffer约1/4左右的时间，考虑好并行工作，考虑协同人、依赖的情况）<br>2. 符合开发规范（注释、模块命名、git...）<br>3. 写出开发文档<br>4. 及时单元测试<br>5. Mock API<br>6. Code Review
12-7 项目过程中PM加需求怎么办
Stage4-联调
1. 和RD CRD技术联调<br>2. 让UE确定视觉效果<br>3. 让PM确定产品功能<br><br>
PM加需求怎么办？
1. 不能拒绝，走需求变更流程即可<br>2. 如果公司有规定，则按规定走<br>3. 否则，发起项目组合leader的评审，重新评估排期
12-8 不要对QA说：我电脑没问题！
Stage5-测试
1. 发提测邮件，抄送项目组<br>2. 测试问题要详细记录<br>3. 有问题及时沟通，QA和FE天生信息不对称
12-9 项目上线
Stage6-上线
1. 上线之后及时通知QA回归测试<br>2. 上线之后及时同步给PM和项目组<br>3. 如有问题，及时回滚。先止损，再排查问题
12-10 项目沟通的重要性
项目沟通
1. 多人协作，沟通是最重要的事情<br>2. 每日一沟通（如站会），有事说事，无事报平安<br>3. 及时识别风险，及时汇报
12-11 项目流程总结
总结
1. 为啥考察-确定有项目经验<br>2. 项目要分多阶段<br>3. 项目需要计划和执行
讲解内容
1. 项目角色<br>2. 项目流程和阶段<br>3. 遇到的问题
项目流程图
要自己能画出来
0 条评论
下一页
