PC端Web项目开发流程

时间:2022-08-28 23:59:13
  从前一直再做前端,突然想到如果有一天领导让自己独立承担一个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修复的问题了。
  八、项目总结。
  项目完了总要总结一下,可以开一个内部的会议,将各自开发过程中的难题难点提出来,大家一起听听是怎么解决的,或者谁对别人开发的东西比较感兴趣,想要了解是怎么实现的及内部原理,在这个时候就可以进行沟通了交流了,这样的交流对提高团队人员的技能还是很有帮助的。然后一起聚个餐,增进下团队的友谊。
  过程中如果一个开发人员做了太久了一个类似的功能,可能会感到枯燥,所以避免一个人对一个大块的内容进行开发,连个交流的人都没有,会很痛苦。因为我就有这样的经历。
以上就是我的一些总结,希望对大家能有些许的帮助。如有不同意见,欢迎提出。
———完结
 
 

PC端Web项目开发流程的更多相关文章

  1. vue pc端网站项目开发坑点与难度记录

    背景 在一pc端的web项目里,由于某些特性需要由动态语言处理,所以只在有需要使用vue来处理数据的页面,直接引入vue.js来处理.由于刚开始并没有打算使用前端来渲染数据和处理交互,所以使用了一些非 ...

  2. web项目开发流程

    对于一个web项目,在实际编码之前,有一些通用的步骤来planning a website: 0.Defining the project (predr0->dr0) 对于外部项目,客户一般会发 ...

  3. Web项目开发流程 PC端

      一.了解.明确需求. 这个应该是第一步了,不了解需求你就不知道为什么要做,要怎么去做这个项目的工作. (1)明确需求是相当重要的,很有必要去和产品经理.设计人员去沟通,需要明白每一个按钮,每一个开 ...

  4. 移动端web app开发学习笔记

    移动web和pc端web以及web app 移动web开发跟web前端开发差别很小,使用的技术都是html+css+js.手机网页可以理解成pc网页的缩小版加一些触摸特性.在浏览器中进行的网页开发,最 ...

  5. Web项目开发中用到的缓存技术

    在WEB开发中用来应付高流量最有效的办法就是用缓存技术,能有效的提高服务器负载性能,用空间换取时间.缓存一般用来 存储频繁访问的数据 临时存储耗时的计算结果 内存缓存减少磁盘IO 使用缓存的2个主要原 ...

  6. SpringMVC内容略多 有用 熟悉基于JSP和Servlet的Java Web开发,对Servlet和JSP的工作原理和生命周期有深入了解,熟练的使用JSTL和EL编写无脚本动态页面,有使用监听器、过滤器等Web组件以及MVC架构模式进行Java Web项目开发的经验。

    熟悉基于JSP和Servlet的Java Web开发,对Servlet和JSP的工作原理和生命周期有深入了解,熟练的使用JSTL和EL编写无脚本动态页面,有使用监听器.过滤器等Web组件以及MVC架构 ...

  7. Web项目开发介绍及实战项目介绍

    引言 本系列课程我们将学些Golang语言中的Web开发框架Iris的相关知识和用法.通过本系列视频课程,大家能够从零到一经历一个完整项目的开发,并在课程中了解实战项目开发的流程和项目设涉及的各个模块 ...

  8. web理论知识--网页访问过程(附有Django的web项目访问流程)

    当我们闲暇之余想上网看看新闻,或者看个电影,通常的操作是:打开电脑.打开浏览器.输入网址.浏览页面信息.点击自己感兴趣的连接......那么有没有想过,这些网页从哪里来的?过程中计算机又做了什么事情了 ...

  9. flask实战-留言板-Web程序开发流程

    Web程序开发流程 在实际的开发中,一个Web程序的开发过程要设计多个角色,比如客户(提出需求).项目经理(决定需求的实现方式).开发者(实现需求)等,在这里我们假设自己是一个人全职开发.一般来说一个 ...

随机推荐

  1. MySQL----This version of MySQL doesn't yet support 'LIMIT & IN/ALL/ANY/SOME subquery

    This version of MySQL doesn't yet support 'LIMIT & IN/ALL/ANY/SOME subquery'的意思是,这版本的 MySQL 不支持使 ...

  2. 【菜鸟学习jquery源码】数据缓存与data()

    前言 最近比较烦,深圳的工作还没着落,论文不想弄,烦.....今天看了下jquery的数据缓存的代码,参考着Aaron的源码分析,自己有点理解了,和大家分享下.以后也打算把自己的jquery的学习心得 ...

  3. MicroStation VBA 可视化界面

    第十章 可视界面 Private Sub UserForm_Initialize() Dim ViewCen As Point3d Dim MyView As View For Each MyView ...

  4. Mybaits简诉

    先组织一下语言!Mybatis是一个框架,一个数据持久化的框架,作用就是SQL语句的映射!减少了JDBC繁琐的数据操作与类型转换!简而言之,就是方便.轻巧!什么是持久化,持久,恩,JDBC就是一个数据 ...

  5. 游戏服务器h2engine架构优化和跨平台设计

    H2engine的GitHub星星不知不觉已经破百了,也没有特意推广过,但是慢慢的关注的人越来越多.因为事情多,好久没有写东西了,前一段时间有了一些想法,把h2engine又更新了一下,感觉h2eng ...

  6. java 基本数据类型的取值

    一. 1.基本类型:short 二进制位数:16 包装类:java.lang.Short 最小值:Short.MIN_VALUE=-32768 (-2的15此方)最大值:Short.MAX_VALUE ...

  7. InetAddress类和InetSocketAddress类

    InetAddress 类 封装计算机的 IP 地址,不包含端口号 InetAddress 类常用的方法 1 String getHostAddress() 获得 IP 地址 2 String get ...

  8. 如何伪造IP(转)

    要明白伪装IP的原理,首先要回顾一下TCP的三次握手. 总所周知在链接初始化的阶段, 需要一次三次握手来建立链接, 之后客户端和服务端会依据初始的这个IP地址来通信. 从这个角度上来说, 想真正的伪装 ...

  9. Attr类中进行类型推断

    涉及到重要的类的继承关系如下图所示. 关于抛出的异常继承体系:

  10. LIS问题(DP解法)---poj1631

    题目链接:http://poj.org/problem?id=1631 这个题题目有些难看懂hhh,但实质就是求LIS--longest increasing sequence. 以下介绍LIS的解法 ...