深解Web项目开发的流程

　　一直再做前端，突然想到如果有一天领导让自己独立承担一个web 项目的话是否有足够的能力去接这个任务，要学会自己去搭建一些基础的工具信息。所有的这一切在心里都要有个大致的流程，不然真正做的时候难免会手忙脚乱起来，接不了这个活难免失去了一个表现自己的机会，接下来做的差了，则更影响了钱途，前途啊。所以本文对做PC端的项目进行了一个过程的总结。
 

 

　　一、了解、明确需求

　　这个应该是第一步了，不了解需求你就不知道为什么要做，要怎么去做这个项目的工作。

　　(1)明确需求是相当重要的，很有必要去和产品经理、设计人员去沟通，需要明白每一个按钮，每一个开关存在的意义，这个需要设计人员足够的了解项目的需求。之前做的一个项目就是这样，工资花了好多钱请了一个UI设计公司设计了一个十分高大上的产品，各种页面各种炫酷，领导觉得很满意，赶紧让我们去做，结果，真正到了我们开发人员手里去开发的时候，才发现有些东西虽然在这里很炫酷，但是根本不应该存在在这里啊，例如你把添加人员的按钮放在人员分组的管理下面，而不是人员管理下面有什么意义呢?结果可想而知，不仅一些功能白设计了而且由于项目时间关系还得我们开发去担任设计，重新设计功能的展示位置，这无疑耽误了项目的进度。

　　(2)后台接口问题，一般大的公司前台和后台是分离的，如果分离需要去跟后台确定各种接口的方式，要有一个文档去管理这些后台接口，要有示例、测试数据。现在的一般都是Restful风格的API方便调用。管理的平台第一家公司用的是一个内部的叫OSG的接口管理系统，这里是一个所有接口的中转站，各个部门的接口都从这里走，还有的用的是showdoc进行管理。要是前后端不分离的话，后台便要自己开发，这个用node还是其他语言，也要做好相应的处理。

　　(3)明确功能点，做好任务分配。

　　如果你是一个leader,那这一部分工作可能需要你去做了，列举好所有的业务功能点，列成一个Excel文件，明确每个功能的负责人，完成时间，技术难度等。这一步也是很重要的一步。

　　(4)开发时间确定。这个要确保开发时间的充足，不然匆匆忙忙做完一堆的bug改起来也是很痛苦的。这个而且前后台一起进行确认，不然前端做完了，发现后端的接口还没有完善，也是很耽误时间的。

　　二、明确技术选型

　　这一步也非常重要，需要去根据设计人员设计，去确认这个工作到底应该去用什么框架去做。

　　(1)最基本的页面布局工作，是用bootstrap、flex还是手写css进行布局或者其它，需要去一开始就确定，不然真正做的时候，不同的开发人员用的不同的东西，显然会造成项目代码的混乱。

　　(2)页面的Css 是纯手写的还是使用Less或者Sass?这个根据项目的情况酌情处理，一旦使用的话就需要对这些脚本进行编译工作，这个工作可以用一些自动化工具例如Gulp webpack进行，也可以用Sublime(我用习惯这个了)、webstorm 等编辑器自带的插件进行,再或者使用考拉编译进行编译。

　　(3)js的模块化是用sea.js还是require.js ?还是不进行模块化。不进行模块化当项目很大的时候，代码将变得很难维护，所以建议进行模块化，至于到底是用sea.js还是require.js这个就看自己的喜欢的，两者的区别主要是一个是异步一个是同步的，具体区别问问度娘、谷歌。

　　(4)图表模块、table等用什么实现。图表有：echarts、highCharts等、table有bootstrap table 、jgGrid,datatables等等。
 

 

　　三、自动化工具的使用

　　现在各种自动化的工具很多，例如：webpack, gulp, grunt等等，(技术更新实在太快了)，到目前我只会gulp有点low了，感觉跟不上时代的感觉。这一步工作主要是减少一些重复的工作，比如压缩js、css、页面实时刷新等工作。我最近的一个项目是使用的gulp进行项目里的html、js文件进行多语种的处理，用gulp读取了language.js里的每句话对应的变量，然后再页面里进行替换后变成一个英文版和中文版的两份，这样的工作肯定也必须是要自动的工具去处理的，不然写两份的话不得痛苦死。

　　四、基础代码的模块化

　　以上都是准备工作，但也是很重要的部分。这一步开始就可以真的开始就进行工作了。

　　(1)如果使用了自动化，自动化的脚本是要写的，具体去如何实现你需要的自动化工作，如何减少重复的，枯燥的工作将极大的提高开发效率，缩短开发时间。

　　(2)再者就是页面的 alert、对话框(confirm)、模态窗(layer,boostrap modal)、验证模块(例如：邮箱，电话号码的验证，不为空的验证等)，日期处理(如：date add 、format等)，这些需要有人去专门的进行模块化，而且一定要在真正的业务代码开始之前完成，否则后面修改起来将十分费劲。

　　(3)还有就是要有人对项目里比较棘手的技术难题提前进行攻关，确保真正的业务开始开发时，技术已经可以实现了。
 

 

　　五、业务代码的模块化

　　这一步开始就要真正的开始接触业务的东西了。开始这一步之前当然得要有设计的文档，假设你已经有了。功能代码也可以进行模块化进行，将项目设计文档里的出现的比较多的展示的内容进行抽离，例如表格，展示图，共用样式，页面布局等等、抽离出来，指定专门的一个两个开发人员进行开发，进行模块化，然后有一个人进行对这些模块的调用，组装。这部分工作让最熟悉的人去做相应的工作，可以提高开发效率。这部分里面包括和后台进行的接口，所以确保要有接口进行调用。

　　六、零碎任务分配

　　大块的功能完了之后就是各个功能点了，这个应该在分配任务的时候分配好，当然也可以当前面的工作完了之后看开发人员的工作情况进行分配，保证每个人都有工作，保证项目不会拖沓。

　　七、当上面的工作进行完了之后，整个项目的功能基本就完成了

　　最好还要让各自的开发人员测试下自己的功能。自测完成后再交由测试进行测试，后续就是bug修复的问题了。

　　八、项目总结

　　项目完了总要总结一下，可以开一个内部的会议，将各自开发过程中的难题难点提出来，大家一起听听是怎么解决的，或者谁对别人开发的东西比较感兴趣，想要了解是怎么实现的及内部原理，在这个时候就可以进行沟通了交流了，这样的交流对提高团队人员的技能还是很有帮助的。然后一起聚个餐，增进下团队的友谊。

　　过程中如果一个开发人员做了太久了一个类似的功能，可能会感到枯燥，所以避免一个人对一个大块的内容进行开发，连个交流的人都没有，会很痛苦。因为我就有这样的经历。