正文

前端开发流程---我们应该做些什么

linjunfu  linjunfu  2023-03-16  748

关键词：

一、拿到原型图，先自我解析需求，画出思维导图，流程图

1. 在未拿到UI给定的PSD时，可以先理清我们的需求
  1. 依赖的外部资源
    1. 后端提供的接口
    2. UI出图的大概布局
    3. 后期频繁改动的地方
  2. 需要实现的效果
    1. 下拉刷新
    2. 动画效果
    3. 吸顶效果
    4. 懒加载、预加载、防抖、节流

二、产品召集项目相关人员，开需求讨论会，产品讲解原型

1. 理解产品的需求，提出质疑：这是什么功能，怎么做，为啥这么做
2. 评估实现难度和实现成本，是否有潜在技术问题/风险
3. 对比自己整理的需求图，如果有和自己想的不符合的，提出疑问
4. 理解PM提出此次需求的目的，明白哪些内容是重点，哪些次要，可以适当取舍
5. 如果产品要求提供时间，简单项目可以预估，复杂项目不可马上给出时间，需要仔细评估，评估时间包含开发、自测、测试人员测试、修复bug、上线准备

三、会后进一步整理需求

1. 细化细节，整理有疑问的地方，与产品、设计等其他人进行确认
2. 评估项目完成时间--影响因素
  1. 需要的人力、中间插入的需求、开发、自测、测试人员测试、修复bug、上线准备、其他风险（如技术选型错误等）
3. 初步制定排期表

四、需求二次确认（开发中遇到不确定的，依旧需要找相关人员进行需求确认，杜绝做无用功）

1. IM工具沟通确认
2. 邮件确认
3. 小型需求/项目相关讨论会
4. 确定最终排期表

五、开发

1. 技术选型
2. 搭建开发环境
  1. 工具链
3. 搭建项目架构
4. 业务模块划分
  1. 优先级排序
  2. 新项目介入，需要当前项目和介入项目的相关负责人Pk优先级，随后调整项目排期
  3. 开发过程中发现工作量与预期有严重出入，需要尽早向其他项目人员反馈，方便其修改时间安排
5. 定制开发规范
  1. 开发规范
    1. commit提交格式
      1. [改动文件类型]：[改动说明]
    2. 单分支开发或者多分支开发
      1. 小项目、并行开发少，则只在master主分支开发
      2. 中大项目，需求复杂，并行功能多，则需要分为master、developer、开发者分支；需要开发者自创一个分支开发，合并到developer，确认无问题后，发布到master，最后上线
  2. 代码规范
    1. jsconfig.json
    2. .postcssrc.js
    3. .babelrc
    4. .prettierrc（vscode插件prettier-code fomatter）— 注意与eslint要保持一致
    5. .editorconfig
    6. .eslintrc.js（强制开启验证模式）
  3. 源码管理
  4. 版本管理
  5. 安全管理

六、自测

1. 手动测试
2. 单元测试
  1. mocha
3. 集成测试

七、提测---测试人员测试

1. 开发人员修复bug
2. 期间不可接手耗时大的需求
3. 有不确定优先级高低的需求，需要各个需求方互相pk优先级，再确定做与不做，不能因此拖延项目完成点
4. 测试修复bug时间可能比开发时间还长，因此开发者预估开发时间不能乐观

八、上线

1. 上线准备
  1. 域名申请
  2. 备案申请
  3. 服务器申请
  4. 部署
2. 测试线上环境
  1. 有bug回到修复bug环节
3. 日志监控
  1. 调用栈
  2. sourcemap
  3. 本地日志
  4. 用户环境、IP
  5. 低成本接入
  6. 统计功能
  7. 报警功能

九、维护

1. 技术创新（对现有的技术领域以及具体项目实现方法进行优化）
  1. 提高效率
    1. jenkins构建部署
  2. 减少成本
  3. 提升稳定性
  4. 安全性

修复表格装饰器错误后我们应该做些啥不同的事情？

】修复表格装饰器错误后我们应该做些啥不同的事情？【英文标题】：Whatshouldwedodifferentlyafterthetabledecoratorsbugfix?修复表格装饰器错误后我们应该做些什么不同的事情？【发布时间】：2014-11-0208:04:40【问题描述】：据此处报道：Bi... 查看详情

前端工程师在实在支付功能的时候能做些什么（v客学院技术分享）？(代码片段)

现在最流行的两种支付微信支付和支付宝支付，在日常开发的过程中肯定离不开支付功能的开发，有很多人第一次接触时会有些措手不及。一.业务逻辑(电商平台为例子) 支付大部分用在电商平台，各种... 查看详情

我们为什么要尝试前后端分离(代码片段)

...改变：把流程从PM：“我要这个功能”后端：“这个先找前端做个模板”前端：“模板做完了”后端：“我来对接一下，这里样式不对”前端：“我改完了”后端：“功能交付”PM：“春节要加这个活动”后端：“这个先找前端... 查看详情

功能模块提测前，我们还需要做些什么？(代码片段)

...下情况：功能跟产品PRD里的不一样，走偏了；前端BUG几百个；严重阻塞性BUG几十个；测试环境极度不稳定，测试人员一直来让开发查看详情

前端开发人员应该掌握的七大技能

...，对于从事互联网的职业也有了更加清晰的定位：设计，前端开发，后端，编辑，运营等等。在这里我们以前端开发的人员的角度来看看应该掌握哪些技能。大部分人会很自然地认为“页面的开发没什么技术含量，很简单”。不... 查看详情

node学习——开篇

前言：自从下决心转学前端以来，我的专业课java基本荒废了，所以对于后台开发的逻辑也已基本忘干净了。但是作为一名准前端程序猿，我认为还是有必要了解后端开发的，虽不必深入学习，但是能够了解项目从前端到后端的... 查看详情

《需求分析与系统设计》阅读笔记02

...当中我们应该做些什么，应该注意什么。对于一个软件的开发的方法。对于第二、三章的精读之后了解到学习对象技术的主要困难在于缺乏明确的出发点和清晰的研究途径。没有像我们曾经了解的自顶向下或自底向上的一种学习... 查看详情

vue开发实例（15）之动态路由(代码片段)

引言Vue是现在前端最流行的框架之一，作为前端开发人员应该要熟练的掌握它，如果你是打算学习Vue的开发流程，那么来吧，明哥带你快速上手、带你飞！即使你并非前端开发人员，对前端的开发流程进行... 查看详情

刚当上it项目经理应该做些什么？

查看详情

vue开发实例（16）之创建标签页(代码片段)

vue开发实例（20）之实现登录功能(代码片段)

vue开发实例（17）之实现用户列表(代码片段)

零基础学web前端，应该先学什么？

随着互联网的迅速发展，前端开发工程师成为市场上非常抢手的人才。很多对于IT完全零基础的同学都想学习前端。前端是一门涵盖面很广的学科。但是想学前端的你也不用慌张，内容虽多但有迹可循，只要循序渐进就不怕学不... 查看详情

后端都需要学习什么？

...后端在一家软件公司里面，我们经常把开发人员分为前端开发人员，后端开发人员，那么我们怎么界定前端开发和后端开发呢。简单地说就是用户在屏幕上看到的和触摸到的体验，都是前端开发做的，反之用... 查看详情

前端移动端开发之rem(代码片段)

前言作为一名前端工程师，我们不仅要会PC端开发，还要会移动端开发，而且现在移动端占据主要流量，所以掌握移动端开发的技能更是必须的。那么进行移动端的开发，什么是必须，我们想要的效果是什么？自适应。对，... 查看详情

我们啥时候应该在前端刷新访问令牌？

】我们啥时候应该在前端刷新访问令牌？【英文标题】：Whenshouldwerefreshaccesstokeninfrontend?我们什么时候应该在前端刷新访问令牌？【发布时间】：2021-08-2914:16:32【问题描述】：假设我们有短期访问令牌（15分钟）和长期刷新令牌... 查看详情

正文