看看书,查查资料,找人聊聊天。整理一下资料。
用户通过浏览器跟后台做交互,在浏览器上运行的东西一般都是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