前端开发

结构 样式 行为分离 模板只包含html文件，模板的书写顺序 相应的命名规则 html：语义化 css：类名以功能或内容命名 样式复用 最好少于三级 在没有必要的情况下避免元素选择器叠加 Class、ID 使用 属行的书写顺序 性能 js：避免重复查找dom 三元操作符电梯if条件语句 二元布尔操作符 样式写在一起 变量声明，保存在一个变量里，避免多次查找dom jQuery链式写法 1、获取DOM对象后缓存到js变量中，避免重复查找DOM数 2、适配手机不同分辨率 最好用CSS3提供的media query（如果涉及到计算还是需要用到js） 3、jQuery中css()方法可以接受多个样式不需要每个样式都写一遍 $('body').css({'width':'1px','height':'1px'}) 4、ajax提交都需要做失败处理 5、if..else中存在相同的代码，应该写在ifelse外 6、重复的代码封装成函数，方便复用 7、为了不污染全局作用域，建议将变量放在匿名函数中（注意某些情况需要在全局域中定义变量） 8、建议在定义变量时可一次性定义改域下所有要用到的变量，不用重复定义 9、$('.example').css('display','block')可以写成$('.example').show()；$('.example').css('display','none'

Web前端工程师，是伴随着Web的兴起而细分的行业，随着当下企业对用户体验的重视，无论互联网公司还是大型企业都把前端作为自己的招牌门面，看得相当重要。而且随着互联网的不断发展，每年都会诞生大量的企业，巨大的市场需求使得前端开发工程师越来越缺乏。那么，web前端需要学习什么? 1、基础部分，主要就是html、css、JavaScript。这个其实不用多讲，这些个基础不学扎实了啥也干不了，可以直接从html5、css3、ES5来学习。学习的方法很多，最方便的方法是像w3cschool、汇智网这种边学边练的，类似之前微软的所见即所得，喜欢读纸质书的可以买几本书来看看。 2、几个边界，与美工相关、后端开发、设计相关。想做好Web前端，一定搞清楚自己的工作界面在什么地方，这对你有很大帮助。每个公司可能都不一样，所以了解边界相关的知识就很重要。 美工相关，主要是说ps、切图之类的东西，photoshop还是需要会用的，至于说你能不能搞出漂亮的图片来那倒不是重点，关键点是体会美工的工作过程。如果你在公司兼了这件事，那你就得深入的学习了，别不以为然，前端的美术有修养还是挺重要的。 后端开发，虽说一般情况下，前端开发和后端开发是分开的，不过二般情况也很多。这个时候就需要你在后端中选择一条主线，很多人都在比较PHP、Python、Node.js哪种好，其实都差不多，不过从市场上的热度来说视乎Node

　　一.JS发展历史 1992年Nombas开发出C-minus-minus(C--)的嵌入式脚本语言(最初绑定在CEnvi软件中).后将其改名ScriptEase.(客户端执行的语言) Netscape(网景)接收Nombas的理念,(Brendan Eich)在其Netscape Navigator 2.0产品中开发出一套livescript的脚本语言.Sun和Netscape共同完成.后改名叫Javascript 微软随后模仿在其IE3.0的产品中搭载了一个JavaScript的克隆版叫Jscript. 为了统一三家,ECMA(欧洲计算机制造协会)定义了ECMA-262规范.国际标准化组织及国际电工委员会（ISO/IEC）也采纳 ECMAScript 作为标准（ISO/IEC-16262）。从此，Web 浏览器就开始努力（虽然有着不同的程度的成功和失败）将 ECMAScript 作为 JavaScript 实现的基础。EcmaScript是规范. 二.JS的简介 　　JS主要由ECMAScript ,DOM,BOM三部分组成。其中ECMAScript是基础，规定了js中的基本语法，例如变量,函数的定义。DOM是最重要的部分，它整合js，css，html,将三者关联起来。BOM将浏览器和JS整合起来。 　　JS的基于对象的语言，它内含众多类，我们可以进行实例化，使用它们。 　　

合适的工具会事半功倍，当然也得把握分寸，要不就成了会得越多干的越多的“苦力者”。 编辑类软件层出不群，各有所长，各有所短。找到一个合适的还真是难。还好有webstorm的出现，最近又是3.0的新版本发布。为什么这么说呢，她与其它的编辑器有什么不同： 1. 任何一个编辑器都需要保存(ctrl + s)，这是所有win平台上编辑类软件的特点，但是webstorm编辑文件右上角是没有那个熟悉的米号的。 换句话说，所有的操作都直接存储，这样带来的坏处就是，没有以前的米号标识，万一键盘误操作也会被立即存储。 省去了ctrl + s之后，在结合 Firefox的vim ，基本不动鼠标就可以看到结果页面了。 2. 任何一个编辑器只要文件关闭了就没有历史记录了，但是webstorm有。就是说，只要webstorm不关闭，你的文件随时可以返回到之前的操作，webstorm关闭重启后这些历史记录就没有了。这样的坏处也是显然的，由此带来的内存消耗也必然比较大。 3. 任何一个编辑器，除了服务器svn之外，没有本地版本，但是webstorm提供一个本地文件修改历史记录。 4. 与时俱进的眼光。zencoding于2009年出现于it界，在这之后，鲜有工具直接集成到里边。webstorm 2.0之后就集成了。node.js,html5,git,cvs等 就不一一列举了。 5. 提供的插件也是比较齐全

注意：用心找自己做的项目中自己感觉最拿出来手的（复杂度最高，用的技术最多的项目），描述的时候尽可能往里面添加一些技术名词 布局我们用html5+css3 我们会用reset.css重置浏览器的默认样式 JS框架的话我们选用的是jQuery(也可能是Zepto) 我们用版本控制工具git来协同开发 我们会基于gulp搭建的前端自动化工程来开发（里面包含有我们的项目结构、我们需要引用的第三方库等一些信息，我们还实现了sass编译、CSS3加前缀等的自动化） 我们的项目中还用到了表单验证validate插件、图片懒加载Lazyload插件 来源： https://www.cnblogs.com/Rivend/p/12642745.html

5G时代来临，各行各业对产品的用户体验需求空前大增。人们在享受互联网带来的便捷也给互联网产品提出了新的需求，这意味着前端开发人员也有了更多的机会和挑战。无论是大小公司，对前端开发工程师的需求都是在快速上涨，薪资待遇也随之上升很快。 前端开发工程师就业机会多，创业机会多，且就业范围广，几乎各行各业都有需要，互联网公司、金融，贸易等等都能进。 对于更迭迅速的IT开发行业来说，新的一年将会有更多的改变和挑战。本人从事IT行业6年，目前也是一名全栈开发者，接下来给大家阐述：5G 带来的万物互联，2020年，web前端工程师在未来发展的惊人表现！无论你是正在学习前端，还是打算学习前端，从事前端，相信阅读完本文，你会更加知道作为前端工程师，在未来前途无量！ 1、前端工程化 在前端工程程化中，开发者最重要的基本素养就是通过工具提升效率，前端开发者在这些工具下会持续迭代和优化。 展望2020年前端的发展，前端工程体系一定会更加闭环，不再是一个脚手架这么简单，而是会结合 IDE，打通业务属性，从项目初始化、到编写代码、到 CI、到灰度、到发布 形成一个完成的闭环。 2、跨端开发 今年很多团队转战谷歌常态的 Flutter，特别是 Flutter for Web 的第一个 Release，这让 Web 前端重燃希望、跃跃欲试。 同时，苹果公司也发布了全新的 UI 系统——SwiftUI，同时

5G时代来临，各行各业对产品的用户体验需求空前大增。人们在享受互联网带来的便捷也给互联网产品提出了新的需求，这意味着前端开发人员也有了更多的机会和挑战。无论是大小公司，对前端开发工程师的需求都是在快速上涨，薪资待遇也随之上升很快。 前端开发工程师就业机会多，创业机会多，且就业范围广，几乎各行各业都有需要，互联网公司、金融，贸易等等都能进。并且对从事开发的就业者的专业经历不设门槛，学习门槛低，几乎很多人都能学习和从事前端开发工程师工作。面对种种因素，许多大学毕业生，都踏上了转行前端开发工程师的路。但是这条路并不好走，如果选择走了这条路，更是要慎重再慎重。毕竟，这关系着职业发展，如果没有下定决心，最好不要盲目跟风。 电子、机械、平面设计、UI设计转行前端开发的已不算罕见了，现在很多从事非互联网行业的也纷纷转行前端开发了。不过，在这条未知的路上，还有很多同学在转行前端开发这条路上一直在自我摸索，磕磕碰碰。 前端工程师首先是软件工程师，基础是最重要的，如果基础不扎实，一切应用技能就都是“浮云”。前端的基础是什么？HTML、CSS、Java基本功，数据结构、编译原理基本功。前端开发不是一个没有技术含量的编写静态网页的职位，前端的大牛，通常都是可以完成多方向产品的，比如说小程序，H5，APP开发等。 在这里给想转行或准备学习前端开发的同学们，你应该具备的哪些条件： 第一：喜欢前端

为什么使用Gulp Gulp自动化构建工具可以增强你的工作流程！ 易于使用、易于学习、构建快速、插件高质！ 在日常开发中，可以借助Gulp的一些插件完成很多的前端任务。 如：代码的编译（sass、less）、压缩css，js、图片、合并js，css、es6转es5、自动刷新页面等 gulp中文官网 ： https://www.gulpjs.com.cn/ 插件地址 ： https://gulpjs.com/plugins/ 使用Gulp 1、全局安装gulp cnpm install gulp -g （只需要安装一次） 2、gulp安装的版本 gulp -v 3、在你当前的文件夹内建立Gulp项目 cd 文件夹 4、对当前项目初始化 cnpm init 要求配置一些信息 生成一个package.json 文件保存，当前这个项目中关于gulp的所有配置信息 5、本地安装gulp(一个项目安装一次) cnpm install gulp --save-dev --save 将这个软件安装到当前目录下 -dev 保留安装信息在package.json里 简写: cnpm i gulp -D cnpm i gulp@3.9.1 -D 多出一个文件夹 node_modules 存储着，我们安装的所有文件。 6、新建文件 gulpfile.js 主要目的为了给我们gulp发布任务

互联网行业无疑是当今社会颇具包容性且发展前景广阔的一个行业，如果单纯只是学习前端编程语言、而不懂后端编程语言，也不能算作是优秀的前端工程师。在成为一个优秀的前端工程师的道路上，充满了汗水和辛劳。 学习 HTML，CSS 应该先跟着书仔细、扎实的学一遍。然后就需要做大量的练习，做各种常规的、奇怪的、大量的布局练习来捆固、理解自己的知识。而学习 JavaScript首先要知道这门语言可以做什么，不能做什么，擅长做什么，不擅长做什么！如果你只想当一个普通的前端程序员，你只需要记住大部分 JavaScript函数，做一些练习就可以了。 如果你想当深入了解JavaScript，你需要了解 JavaScript 的原理，机制。需要知道他们的本源，需要深刻了解 JavaScript 基于对象的本质。还需要 深刻了解浏览器宿主下的JavaScript的行为、特性。 全栈前端就是学习的知识不仅是前端的基本知识，还有后台，小程序，混合式开发等相关知识，在以前，会一点Photoshop和Dreamweaver的操作，就可以制作网页。现在，只掌握这些已经远远不够了。无论是开发难度上，还是开发方式上，现在的网页制作都更接近传统的网站后台开发，所以现在不再叫网页制作，而是叫Web前端开发。 Web前端开发在产品开发环节中的作用变得越来越重要，而且需要专业的前端工程师才能做好。Web前端开发是一项很特殊的工作

HTML5性能优化 在看完这两章内容之后，我意犹未尽，于是乎从网上搜索关键字“Java Web高性能”，在IBM社区找到两篇不错的文章，而让人更意外的是我发现那两篇文章的内容跟《高性能HTML5》前两章高度相似，不知道是谁抄袭谁的，大家可以鉴别下真伪，下面附上地址。 http://dl2.iteye.com/upload/attachment/0097/9373/b0e69540-e703-3530-81bb-c93de7b850a6.pdf http://www.ibm.com/developerworks/cn/java/j-lo-javawebhiperf1/ http://www.ibm.com/developerworks/cn/java/j-lo-javawebhiperf2/ 前面是读后感，下面是我针对最近几天学习到的提高Web性能进行了篇幅不小的总结，一来为新人提供帮助，二来自己做一下笔记，加深记忆。 性能之前端篇 --减少重绘 在HTML页面完成展现之后，动态改变页面元素或调整CSS样式都会引起浏览器重绘，性能的损耗直接取决于动态改变的范围：如果只是改变一个元素的颜色之类的信息则只会重绘该元素；而如果是增删节点或调整节点位置则会引起其兄弟节点也一并重绘。 减少重绘并不是说不要重绘，而是要注意重绘范围：①改动的DOM元素越深则影响越小，所以尽量深入节点改动