Web前端开发流程
开发前准备
了解产品和设计
- 参加需求、交互、视觉会议,了解产品设计和项目成员。
- 了解产品面向的设备和平台。
- 了解产品对兼容性的要求以及是否采用响应式设计等。
提出疑问和见解
- 按需求结合现有技术,提出疑问和见解。
- 提出可能存在的问题(技术实现,性能问题等),协商解决方案(如优雅降级、渐进增强)并达成共识。
- 提出当下已掌握新技术可能在项目中的应用场景,协助产品创新。
不要采用未掌握的技术创新
。
预算人力和时间
- 根据项目工期要求及工作量,预算人力和时间。
- 挑选前端成员组成前端小组,拟定技术选型。
- 确定功能开发优先级,预算开发周期和阶段性产出。
- 提醒需求方在项目管理平台(禅道)中创建项目并加入项目成员。
- 提醒需求方在项目企业沟通工具(企业微信或钉钉)中创建项目交流群并加入项目成员。
- 提醒项目负责人创建git仓库并设置成员权限。
开发过程
职责任务
- 确定前端小组长,负责对整个页面开发工作做统筹规划、分配协调等管理工作和主开发职责
- 确认交互原型或视觉效果已经定稿,再开始开发工作。
- 如果采取并行模式(视觉设计和页面开发同时进行),则以交互原型定稿为准(当视觉效果定稿后,页面工程师再补充细节),开始分配。
- 按页面类型分配,同一类型页面分配给同一个人。
- 每个人都要了解页面公共元素(多个页面中相同或相似部分),一个公共元素只分配到一个人,每人完成自身页面的同时完成“提取剥离”。
- 在项目管理平台中细分开发任务,填写任务详情和时间,如果任务间存在关系,则设置好关联或从属关系。
页面开发
- 由小组长创建前端目录,包含“页面开发”目录(如:js、css、html、images)及“提取剥离”目录(如:demo)。
- 由小组长创建公共样式和引入js库版本以及工具包(如:reset.css、jquery3.2.1.js、resize.js、util.js)
- 和交互、视觉及其他前端工程师或后端工程师保持良好的沟通。
- 对交互原型和视觉设计有疑问,上报小组长,由小组长统一对外(需求方和设计师)反馈问题和建议。
- 如果采取并行模式,前后端有数据交互的页面,先与后端小伙伴约定好API字段(如图片接口用
img
orimg_url
orimage
)
提取剥离
- 提取剥离相同或相似结构,封装成模板或组件。
- 提取剥离公共js方法,保存到util.js。
- 若要修改提取剥离出的公共部分,需小组讨论可行性后,方可由小组长修改。
开发产出
自测联调
- 首先对自己的代码进行全面的多设备测试和兼容性测试。
- 多人协同项目,git先拉取再提交,如有冲突上报小组长解决冲突。
- 自测过程中发现别人写的代码有问题,及时反馈。
提交验收
- 当有阶段性产出后,小组长上报主管,安排经验丰富的前端工程师进行代码验收。
- 代码验收将主要检查兼容性、HTML、CSS、JS规范。
- 同时小组长将页面提交给设计师,进行效果验收。
- 效果验收将主要检查视觉效果符合度(尺寸、位置、颜色、切图等)。
交接说明
- 当完成验收后,通知并交给后端小伙伴,进行后续开发,前端需要交代可能需要他们注意的地方或者对代码的解释说明。
- 如果你的工作需要与别人交接,也需要交代清楚整体架构部署和代码解释。
变更维护
- 需求变更必须在项目交流群中提出,由小组长与需求方确认,如有必要,需求方召集项目组开会说明
- 前端代码优化维护,必须上报主管,需小组讨论可行性后,方可由修改。
参考 Nec工程师规范
相关推荐
小秋 2020-11-12
lxhuang 2020-11-03
小焊猪web前端 2020-10-24
杏仁技术站 2020-10-23
南昌千网科技 2020-10-18
liduote 2020-10-16
PncLogon 2020-09-24
趣IT 2020-09-22
杏仁技术站 2020-09-18
拾光璇旅 2020-09-17
lfbooo 2020-09-09
颤抖吧腿子 2020-09-04
Herorong 2020-08-25
anaction 2020-08-17
风萧萧梦潇 2020-08-17
PncLogon 2020-08-16
franktaoge 2020-08-15
MrHaoNan 2020-07-31