• 前端开发的一般流程


    前端的开发过程中主要有以下流程: 编写代码->单元测试->检查语法->整合代码->生成文档->压缩代码->部署测试环境->测试->发布。
    产品最终的结果是原型图,而原型图可以理解为设计的草图
    设计师的结果是psd文件,他是很多个图层叠加在一起的结果,而前端的工作结果html页面,是把很多图层上的效果,有机的用html组织起来的过程。
    前端是把转化后html交给下游服务端开发工程师,或叫后台开发,这个html里边包括一些交互的js文件等。总的来说前端是一个承前启后的岗位。
    ——————————
    领导或甲方提出需求,然后产品分析需求,并且根据需求画出原型图,然后根据原型图出设计稿。
    出完设计稿团队评审,过后交与前端制作静态页面,然后静态页面,交与设计审核,过后交给开发人员,进行动态数据的添加。
    添加完之后,发布测试环境,产品测试领导审核,成功后,直接发布产品环境。或进行版本迭代。
    这是整个的一个设计,开发,部署的流程。
    ————————

    此段来自作者:豪情
    链接:https://www.zhihu.com/question/32039469/answer/54382815
    来源:知乎


    产品经理下达任务----UI做图-------前端根据UI的图做效果-----与后台人员交流

    工作中流程:
    早上开早会,产品经理下达命令,讲述昨天完成任务,今日目标。


    关于项目中的介绍:
    一般有工作经验的人,常用的动态效果都会自己封装一个插件,比如说图片轮播,翻页,TAB切
    换页面,这个时候面试官一定会问你,让你解释一下怎么封装的,这个时候就把源码跟解释一下就行
    因为现在行业移动端比较火,先说移动端的项目!

    移动端的项目:
    用xxxjs做的,用这个JS实现了什么效果,在整体页面用什么布局模式,都适配那些,如果做到
    适配的,介绍一个页面,从上到下,移动端会有上拉加载,下拉刷新,换页面加载,这些效果
    要提前查好项目中的这些效果看源码知道是怎么做的,和面试官直接说就可以了,在这个项目
    中遇到了哪些问题 如何解决的。(多说项目中的用到哪些技术,这些技术用在项目中的好处)

    例如:
    我做这个项目用到了
    iscroll.js 解决页面不支持弹性滚动,不支持fixed引起的问题~,实现下拉刷新,滑屏
    ,缩放等功能~,

    在登录注册页,ios下软键盘弹出时挡住了登录文本框,经检查最外面盒子用了固定定位,ios
    尽量不要用固定定位。

    出现闪屏
    解决:消除transition闪屏
    .css{ 
    /*设置内嵌的元素在 3D 空间如何呈现:保留 3D*/ 
    -webkit-transform-style: preserve-3d; 
    /*(设置进行转换的元素的背面在面对用户时是否可见:隐藏)*/ 
    -webkit-backface-visibility: hidden; 
    }

    PC端的项目:

    都调了哪些浏览器的兼容,在做这个项目中遇到的问题,如何解决的。

    例如: IE6 垂直列表间隙的问题
    问题:
    li中有a且设置display:block时,ie6中列表间会出现空隙
    解决:
    1、li中加display:inline;
    2、li使用float 然后 clear:both;
    3、给包含的文本末尾添加一个空格
    4、设置width

    IE6背景闪烁的问题
    问题:
    链接、按钮用CSS sprites作为背景,在ie6下会有背景图闪烁的现象。原因是:IE6没有
    将背景图缓存,每次触发hover的时候都会重新加载
    解决:
    可以用JavaScript设置ie6缓存这些图片:
    document.execCommand("BackgroundImageCache",false,true);

    关于frame
    问题:
    在IE中可以用 window.testFrame 取得该frame,FF中不行
    解决方法:
    window.top.document.getElementByIdx_x("testFrame").src = 'xx.htm'
    window.top.frameName.location = 'xx.htm'

    禁止选取网页内容
    问题:
    FF需要用CSS禁止,IE用JS禁止
    解决方法:
    IE: obj.onselectstart = function() {return false;}
    FF: -moz-user-select:none;

    做好每一件小事。
  • 相关阅读:
    python常用代码: logging 和 无视locale强制东8区
    近期文摘2
    偶尔用一次windows开发,有点明白为何人觉得macos对开发友好
    zz golang str json map互转
    golang一些有价值文章摘录
    从 'golang新手容易犯的三个错误' 中学到的知识点
    macos下使用postgresql
    python netsnmp与pysnmp
    快速实现python抓包嗅探
    macos下npm install 报错: fsevents .... permission denined
  • 原文地址:https://www.cnblogs.com/peachGirl/p/5971893.html
Copyright © 2020-2023  润新知