前端如何快速推动项目

170 阅读1分钟

快速开发

前端可以做:

  • 后端小哥哥:定义接口规范,数据规范、接口文档规范
  • UI设计:定义UI组件规范,尺寸规范,颜色,尺寸样式变量规范
  • 产品经理:业务需求需要明白,然后才能快速推进项目
  • 前端:定义代码规范,review code,接口聚合,线上监控,性能优化,函数复用,SEO优化,首屏渲染,组件单元测试

开发流程

  • 产品经理 -> 业务需求(需要大家的参与) -> 原型图
  • UI设计 -> 设计图 -> 客户反馈 -> 设计图
  • 后端 -> 数据库+后台架构搭建
  • 前端 -> 根据设计图出页面 -> 对接接口

接口规范

返回{code: 0, message: '', data: {}} JSON格式

数据规范

产品规范: [{},{},{}] 城市规范:[{city: '广州', childrens: []}] 第三方组件联动组件格式

接口文档规范

返回值、请求方式、数据代表什么意思,还有其中的联动效果

代码规范

可借助eslint来定义代码规范

UI组件规范

封装业务常见的组件

review code

重构项目代码,解决性能低下,内存不足,代码过多

接口聚合

项目有几个组件需要用到接口的,需要封装成mixins,请求一次,存到vuex中

基础组件

基础组件可以通过require.context引入全部组件

沟通能力

沟通能力是作为一个团队中的一员,需要强化的软技能