FE 开发流程

看看书,查查资料,找人聊聊天。整理一下资料。

	用户通过浏览器跟后台做交互,在浏览器上运行的东西一般都是FE做的事情。web1.0时代,
ajax的诞生标志着2.0。HTML5就是web3.0的到来。


前端开发协作,一般是产品和前端主导接口和流程。

	策划--》交互--》[视觉]==|
				|->[前端]==|      ----》 测试
				  |->[后台]==|

视觉稿:什么样子,配色,距离,空间等。
交互稿:通过线框图来体现出系统信息架构和流程。

FE的职责:将视觉和交互通过开发产出UI。
页面制作和页面逻辑职责开发。


web系统架构:一般都是MVC 数据,视图,控制。现在很多地方都是前端主导定接口。
其实也应该这样,时代进步了,已经不是实现难度太大,或者成本太高的时代了。所以,
用户体验为导向的前端时代已经来临了。当然后台还是很重要的。

角色定位:
	[页面制作] 
	[前端逻辑]
	[后端逻辑]


(1)
	(a)根据交互原型,前后端沟通。
			输出:入口和同步数据规范,异步接口规范。
	(b)页面工程师同步页面的制作。

(2)
	前后端并行开发。
		前端配置,实现控制层,实现于之前于后台异步借口。
		前端还可以做一点系统架构的事情。根据后提输出,实现模版的业务逻辑。

(3)联调

(4)提交测试和上线。


但是有几个规范。
	页面入口规范,

	同步数据规范,

	异步借口规范。



需求变更!---》需求分析----》(a)前端 (大部分)
			      (b)规范的改动 --》 更新规范 --》 协作流程。


页面工程师
	切图,优化图片
	页面制作,优化页面效果与结构。
	完成简单的前端业务逻辑开发。

前端工程师。
	主导制定前后端分离的规范。
	主导前后端联调对接的测试。
	系统前端设计架构,满足一定的功能性需求。
	完成业务逻辑实现,优化实现的逻辑。

后端工程师
	协助制定前后端分离规范
	协助前后端联调对接测试
	完成后端的设计和实现。



接口设计
	模版引擎通过约定规则,进行数据模型之间的匹配。


template(模版)  <--->
	||
 url(网址)	 			model(模型)
	||
 API(接口)		<--->


页面入口:基本信息,输入参数,模版列表,接口列表
url <---> API
 |
template
	
	页面拆分。页面的基本信息,地址可以不带参数。
	输入参数的说明。
	系统异常跳转
	模版列表


同步数据
template  <--->  nodel
	
	基本信息
	预填数据
	注入接口

 
异步接口
API  <---> model
	
	基本信息,地址
	输入数据
	输出结果。


			                     |--> base.css
构建项目结构, webapp	--> res	             |
				--> src --> css --> page -->  [404.css, dj.css, over.css] 
				         |
				       |--> javascript --> lib
						   | --> dj --> [404.js. dj.js, over.js]


模拟同步数据
开发环境 local proxy
本地环境,主要做前后端分离。



版本管理:vcs,查阅或者回到历史版本。
lvcs本地[rcs],cvcs集中式[svn],dvcs分布式[git]。




分支和分支模型
分支:就是从目标仓库拷贝一个与原来一样的拷贝。每个拷贝都是和原来仓库一样的开发线。
分支模型:围绕项目(开发/部署/测试)等工作流程的分支操作(创建,合并等)规范集合。
产品级的分支模型。
	常驻分支:
		development - 从master创建。
		production - 默认分支

	活动分支。
		feature
			- 从development创建
		hotfix
			- master
		release

  

原文地址:https://www.cnblogs.com/hgonlywj/p/4896507.html