Web开发流程
知乎上关于Web开发流程豪情给予的回答
老板或甲方是一个需求的真正发起者,也是一个基础idea的梦想师,产品是需求专业化梳理或进行有效评估细化需求负责的,
而设计是前端的上游,前端是设计的下游。设计的工作目的是把产品宏观的思维结果进行专业的处理,因为按一般的习惯,产品最终的结果是原型图,而原型图可以理解为设计的草图。
对真正的用户来说,这个草图过于简单或不符合使用的操作习惯,所以需要设计师进行专业的处理,比如颜色搭配,布局分隔,有时候还兼交互的一部分工作,设置用户与页面发生交互的预订流程。
那有人问,不需要设计不行吗?直接让前端写页面不就得了,还需要麻烦设计师来做个图出来。
因为这里边有一个成本风险控制的一个理念,因为在前期,尤其是设计,主观感受大于理性的思考,所以每天的结果都不一样,所以需要设计师去消化掉这部分主观感受带来的误区。而且从成本上来讲,有些场景设计师改图比改代码要容易控制一些。
设计师的结果是psd文件,他是很多个图层叠加在一起的结果,而前端的工作结果html页面,是把很多图层上的效果,有机的用html组织起来的过程。
前端是把转化后html交给下游服务端开发工程师,或叫后台开发,这个html里边包括一些交互的js文件等。总的来说前端是一个承前启后的岗位。
也有的公司把前端的责任放大,负责整个前台view层页面的开发,这样的好与坏在前面的文章中已经探讨过就不一一细表了。
我们以前基本的流程是,领导或甲方提出需求,然后产品分析需求,并且根据需求画出原型图,然后根据原型图出设计稿。
出完设计稿团队评审,过后交与前端制作静态页面,然后静态页面,交与设计审核,过后交给开发人员,进行动态数据的添加。
添加完之后,发布测试环境,产品测试领导审核,成功后,直接发布产品环境。或进行版本迭代。
这是整个的一个设计,开发,部署的流程。
根据前面的,在补充一下,前面的所有流程中的灵魂是原始需求提出者,但人随着客观条件的变化,思维认识会有所不一致,所以产生了文档,文档是贯穿整个流程的一个灵魂。
而产品是整个流程中文档的编写者,因为产品最能接触最原始的需求,对需求的理解更深刻或专业,所以他会有一个文档出来。
这个文档是需要交付给设计,让设计在设计过程中进行参考。
前端看的另外一个文档。交互设计师出交互文档,一般的公司没有交互设计师那就是由产品来出的交互文档。
有的交互不过于复杂,就没有文档,只是邮件。
有时候说,不要这个邮件行不行,那怕是最简单的原始东西,没有文件或邮件是不能做一个后期测试回溯的依据。
产品文档表示页面的流转或数据的走向,交互文档描述页面复杂的交互或各个用户表单与用户发生的各种互动。
另外2个是,要架构师或项目经理出的需求文档,需求文档是对整个项目的历史背景,系统开发软硬件要求,或版本信息,等等。
另外一个是由服务端工程师提供的接口文档,这里边包括一些请求类型,传参的数目与键名,还有服务端返回的参数名约定等等的,这些文档是开发中的灵魂,也是以后测试回溯的标准或依据。
参考:创立一个网站的前前后后(起因,域名,云平台,备案,CDN等等)(1)
2. 进行操作会用到哪些便捷的小工具?
参考:web前端开发分享-css,js工具篇
最主要是开发工具,还有上游是ps要求略会。其它就是不同语言的开发环境的搭建,如果是开端就求助后端,如果是后端自己折腾了。
其它的,都不难,难的是可能是windows,mac,linux平台切换后的思路断片,需要有一个过程熟悉,熟悉之后,基本都不是问题,开发的核心是语言,平台,需求,真正的工具没有难度。
剩下的就是三个利器:vim,git,五笔,有空的学学,没空就慢慢看了。
3.是先用模板做好,然后在基础上改吗??
一般新项目都是手动要写的,写好的有可能也不是模板。
4. 正常大家说的改框架是不是指的用模板做的网站原文件?
框架,有几层意思,frameset也是框架,现在mvvm也是框架,有的java,strusts,php的laravel也叫框架,大部分是不改原文件,而是配置文件,像strusts的xml配置文件,像laravel是直接是后生成的新的php文件。
5. 前端开发做的文件一般是哪些?放在主机什么文件夹里啊
一般是html,css,js三个文件,放在服务器的,有可能是这三个,也有可能是.php,.jsp,.aspx等等的。
可能目录啥的,可以参考一下这个:
参考:豪情-CSS解构系列之一
参考:豪情-CSS解构系列之二
Web开发流程的更多相关文章
- 分享一篇 Git Web 开发流程
分享一篇 Git Web 开发流程 web 项目如何进行 git 多人协作开发 https://segmentfault.com/a/1190000018165757
- web开发流程(传智播客-方立勋老师)
1.搭建开发环境 1.1 导入项目所需的开发包 dom4j-1.6.1.jar jaxen-1.1-beta-6.jar commons-beanutils-1.8.0.jar commons-log ...
- (转)web开发流程
a.项目经理与公司决策层的沟通,以确定这个需求有没有足够的人手和可行性去实现,以及与现有产品的依存关系. b.公司决策层与市场/策划部门的交流,这个过程将进行的相当充分,并且是反复.长期的,它致力于从 ...
- web 开发流程
shopWeb登录 开发步骤 1 数据库 2 创建 Module 3 复制页面 4 创建目录包 添加需要的jar包(引入依赖) 配置文件 5 功能: 编写服务器程序
- Java程序员的日常——SpringMVC+Mybatis开发流程、推荐系统
今天大部分时间都在写业务代码,然后算是从无到有的配置了下spring与mybatis的集成. SpringMVC+Mybatis Web开发流程 配置数据源 在applicationContext.x ...
- 快速使用node.js进行web开发
首先关于node.js的学习,这里推荐一本比较好的教程,nodejs web开发指南,该书通俗易懂地将node.js语言特性讲解完之后,又从一个项目角度带领读者使用node.js学习web开发.相信这 ...
- 2021年Web开发的7大趋势
技术发展日新月异,所以 Web 开发人员也需要及时了解行业最新的发展趋势. 全球有超过 17.4 亿个网站.在每一个细分领域都有无数企业争夺搜索引擎的排名前列位置.开发人员应该了解和发现更多创新的 W ...
- Web服务器具体开发流程
下面是我个人对Web服务器开发流程的一点理解,下面做出了大概的模型,实现了基本的功能,下面也有所有的代码可以提供参考: 一开始学的时候不要把网站想的太复杂了,把网站的流程和大概的原理框架搞清楚,在通过 ...
- 【转】Yeoman:Web 应用开发流程与工具
原文转自:http://blog.jobbole.com/62098/ 随着 Web 2.0 和 HTML 5 的流行,现在的 Web 应用所能提供的功能和交互能力比之前传统的 Web 应用要强大很多 ...
随机推荐
- Codeforces Round #279 (Div. 2) ABCDE
Codeforces Round #279 (Div. 2) 做得我都变绿了! Problems # Name A Team Olympiad standard input/outpu ...
- DirectX SDK
http://blog.csdn.net/c4501srsy/article/details/17403927 http://blog.csdn.net/yy649487394/article/det ...
- App提交iTunes Connect,"二进制无效"问题解决方案。
昨天提交打包提交App,将包上传到iTunes Connect之后,以为就能发布了,便点击构建版本,发现没有刚刚上传的包,于是就点击"预发行"看一下,会看到"已上传&qu ...
- H5项目常见问题及注意事项
Meta基础知识: H5页面窗口自动调整到设备宽度,并禁止用户缩放页面 //一.HTML页面结构 <meta name="viewport" content="wi ...
- 局域网中共享Lantern上网
Lantern作为一款非常好用的上网软件,深受大家喜爱,但是由于目前没有ios版,所以iPhone用户上网很麻烦,这里介绍一下如何共享Lantern使局域网内的设备都能正常上网. 1.电脑端设置:右键 ...
- java后端制作MD5加密
由于一次业务的需要,我制作了一次密码的修改子业务. 当用户忘记密码的情况下,我需要动态的发给他一个6位的随机密码,通过即时通,短信,微信等.并同时修改数据库中的原密码为这6位的随机密码.让用户再去修改 ...
- 启动调试IIS时,vs无法在 Web 服务器上启动调试。Web 服务器未能找到请求的资源。 有关详细信息,请单击“帮助”。
问题截图 1.检查 是否设置了本地IIS 2.检查IIS端口是否为80 3.默认网站设置是否正确 可参考,查看网站绑定是否正确
- assign more memory to Gradle
Please assign more memory to Gradle in the project's gradle.properties file.For example, the followi ...
- 网络编程之socket
网络编程之socket socket:在网络编程中的一个基本组件,也称套接字. 一个套接字就是socket模块中的socket类的一个实例. 套接字包括两个: 服务器套接字和客户机套接字 套接字的实例 ...
- .Net中使用无闪刷新控件时提示框不显示
今天做提示框的时候一直不显示,让我郁闷好久,晚上吃饭的时候问了同事一下,他给了一个思路, 他说可能是因为由于页面中的无闪刷新导致的结果:百度了一下真找到了解决方法 在页面中存在无闪刷新控件的时候提示框 ...