专栏名称: Fundebug
Fundebug为JavaScript、微信小程序及Node.js开发团队提供专业的线上代码bug监控和智能分析服务。
目录
相关文章推荐
歸藏的AI工具箱  ·  终于有给设计师用的 Cursor 了 ·  昨天  
歸藏的AI工具箱  ·  终于有给设计师用的 Cursor 了 ·  昨天  
前端早读课  ·  【第3454期】如何用语音学习编程的 ·  昨天  
前端大全  ·  Create React ... ·  6 天前  
前端大全  ·  React+AI 技术栈(2025 版) ·  4 天前  
商务河北  ·  经开区“美•强•优”三重奏 ·  4 天前  
51好读  ›  专栏  ›  Fundebug

值得参考的项目开发流程

Fundebug  · 公众号  · 前端  · 2019-05-06 10:00

正文

Fundebug 经授权转载,版权归原作者所有。

最近在项目开发中遇到的问题

  • 对要开发的产品的最终形态没有明确的了解,没有明确的目的性,导致多次返工,重新设计。

  • 没有明确的开发顺序,开发的模块东一块西一块不流畅不连贯,导致模块之间耦合太高,代码散落多处难以继续开发和维护。

  • 没有系统设计结构图,没有区分数据层面、控制层面、业务层面、展示层面、交互层面、界面层面,不能随时了解当下的开发位置和进度,无法预计后续开发的时间和下一个合适的开发位置。

  • 代码写的过分冗余,不够优美,主要是因为没有写伪代码来说明一个函数中每一部分的逻辑以及逻辑上下的关系。

  • 代码写的过分硬编码,不够抽象,当发现要抽象的时候,需要重新修改之前的编码。

  • 没有考虑数据交互的结构设计,数据结构设计应该单独拎出来作为单独函数封装以便后续扩展

  • 花过多的时间在界面设计上,时间浪费在过多的样式调整上。

  • 每次编码没有写上测试的内容,开发进度被多次延误,不能保证代码的正确性,基础性的bug过多。

仔细的梳理流程后,大致整理了如下几个步骤。

第一部分、分析和规划设计

如下2步,需要画图、笔记、文字记录、演算、推理、画流程图、画架构图

1、产品选型

明确产品界面、交互设计、功能设计、模块区分,寻找相仿的产品上手体验、操作,感知功能的使用和交互的体验,目的是为了了解即将要做的产品有大致的模型,对产品模型了解的越细致越好

2、分离架构

对产品从各个维度分离架构,从功能,目录,逻辑拆分,抽象,业务流的明确,数据流的流向,交互体验的设计,从整体拆分成局部,针对每个局部再继续拆分,从局部整合成系统,考虑整体和局部之间的相互影响关系

循环这2步,最终得到一个产品系统,应该对产品系统非常了解,从整体到局部,从需求到逻辑,端到端的数据流向,交互体验设计,数据库表结构设计

第二部分、实施

3、文档编写

按照系统的各个区域和子系统,编写对应的文档注释,说明此子系统的功能、大致逻辑、含有的接口。

此外,流程应该按照先数据库层面 –> 逻辑控制层面 –> 数据展示层面 –> 交互体验层面 –> 界面设计层面的顺序来规划和思考。

同时考虑扩展性的问题,子系统是否可插拔,组件之间是否强依赖,必要的时候完成架构层面大的抽象。

文档需要大概明确此子系统模块的测试结果是什么,提前演算模块的测试步骤和结果,后续细化的代码必须要通过此测试要求。

4、技术选型

明确每一个子系统和组件需要使用到的工具、框架、第三方库、以及重要的语法或者类设计、或者编程技巧、或者设计模式等等。

5、开发顺序确认

明确这个系统的各个部分的开发顺序,独立的子系统先开发,耦合依赖强烈的系统最后开发,简单的先开发,难的后开发。 规划好开发进度计划。
先开发数据库层面的代码,再开发数据控制层面,再开发数据交互层面,再是数据展示,交互体验设计,界面开发应该放到最后,界面开发最花时间。

6、伪代码编写

使用中文表达逻辑,加上必要的编程语法混合表达。

伪代码的编写是必须的,而且伪代码要写到可以直接演算出代码结果的程度,即可以通过编写伪代码来几乎100%的确定是否符合模块测试的要求。

伪代码必须要完成数据交互的结构设计。

伪代码必须要对函数有明确的定义和解释,可以说明此函数的作用。

7、编码

编码必须符合伪代码的逻辑,编码应该多次测试,慢步前进。

注意编码的版本控制。

编码应该尽量保持优美的逻辑和语法使用。

编码的变量命名应该特别注意。

每一次的编码应该最低按照一个函数单元,即最小编码单位是一个函数,一旦决定编码,就至少完成一个函数单元,或者取消本次函数的编写。

每个函数的完成,都必须要达到伪代码对此函数的定义和解释,注意高内聚和低耦合的问题。







请到「今天看啥」查看全文