走过路过，不要错过，2019年应该如何学习前端开发？

近两年来，前端开发工程师愈来愈火了，2019年已通过了快一半了，不少准备入行前端开发工程师的小伙伴们，不知道准备得怎么样了呢？

今天来给你们讲讲，在2019年，咱们学习前端开发，如何才能高效学会前端开发？

零基础起步

首先，不管学任何一个技术，都是从零基础开始的，前端开发也是同样。作软件开发，是从事编程开发工做，必须先从语法基础开始学习，经过语法组成产品效果。

前端开发的基础语法，由HTML+CSS+JavaScript组成，这是前端开发最基本的3个语言。

网页布局基础：HTML+CSS

HTML就是超文本标记语言，组成网页内容的最基本语言。你能够直接说他是网页的骨架，网页的图片、文字、视频、音频、程序都须要他引入到网页中体现。

光是HTML作网页，只是有了内容，固然是远远不够的。由于只是HTML的话，只能用Table作布局才能勉强作出个成型的网页来。可是从Web2.0时代开始，都是盒子模型布局法了，也就是用DIV+CSS来实现布局了。

CSS就是层叠样式表。经过样式属性来对标签进行布局规范，在再也不使用table布局的时候，只要CSS样式对网页标签进行对应的布局实现才是正确的开发方式了。

HTML(div)+CSS布局，是基础入门的基本步骤，在这个阶段，你须要学习的内容，包括有：

1.标签语义化，SEO

2.页面加载的流程和原理

3.网页结构

4.盒子模型（W3C盒子模型和IE盒子模型）

5.CSS选择器

6.CSS布局浮动、定位

在刚刚开始的阶段，你们学习的布局方式基本都是以px为单位的静态布局方法。熟悉好布局方法，先给本身一个小目标，作一个简单的电商网页的基本结构出来，不用特效，不须要交互。

浏览器脚本语言：JavaScript

JavaScript是咱们学习前端开发中很是重要的一个内容，也是一个你们常常掉坑里的难点。JavaScript如今能够说是互联网时代使用率最高的脚本语言了，在网页中，全部的数据渲染，特效的交互都须要利用JavaScript，来影响浏览器的显示。

JavaScript不仅是开发网页特效和渲染数据的重要内容，在学习前端开发的后期，大量使用算法和框架的时候，对JavaScript基础的考验也是不少的。

在基础阶段，咱们学习JavaScript须要注意：

1.基本关键字指令

2.基本数据类型、数组

3.函数

4.面向对象编程

5.原型链、闭包

6.JSON

7.Ajax

8.DOM(文档对象模型 原生DOM操做)

9.事件捕获、冒泡、代理

10.经常使用函数方法

11.ES五、六、7

在JavaScript部分学习，主要仍是要去理解好交互的原理，把原理分析清楚，真的理解语法，那写出多复杂的逻辑也是手到擒来。

JavaScript经典类库jQuery

说到学习JavaScript，不少小白同窗确定会很头痛他的原生写法。每次逻辑业务都须要手动写，也就是用一次就造一次轮子。以为很麻烦。若是能简单一点就行了。

由于JavaScript有能够封装的特性，因此在后面也出现了不少用JavaScript封装的类库、插件。好比说最经典的类库就是jQuery了。

jQuery类库就是在类库里面封装好了不少JavaScript的事件方法。jQuery经过封装，减轻了遍历、对象选择等等不少的问题。把网页特效的实现变得简单化，经过调用方法就能够了。

在学习jQuery的时候，须要重点认识的有:

1.jQuery语法和JavaScript原生语法的差别

2.Dom对象和jQuery对象

3.jQuery的入口函数和JavaScript的入口函数的差别

4.jQuery事件的执行逻辑。

学习jQuery，最须要达到的效果就是能快速的完成网页的特效，好比说轮播图、手风琴菜单、旋转木马、放大镜等等这些特效。能完成一个电商网站的布局+特效开发是最基本的要求了。

这些就是零基础学习必备的一些基本内容，在入门前端开发最基本须要掌握的东西，把基础理解好，才能为后面的学习作更多的准备。

多终端进阶学习

除了基础的PC端，目前移动端能够说是很是火的了。

比PC端单一的网页不一样，在移动端的技术能够应用到WEB-APP,小程序，Hybrid-App等等。

Web-App

也就是咱们常见的浏览器（以及内置浏览器，好比微信）打开的大型移动端网页。好比咱们常见的电商网站，功能性网站，管理网站，在布局和功能上都有APP的效果。

作好Web-App开发，最基本的不少人确定会说响应式布局，可是前端开发是又5种布局法的，除了出名的响应式，还有在移动端最重要的弹性布局法，也就是不少人头疼的rem布局。

除了布局方法以外，在H5新特性和触屏事件和设备兼容性问题也是须要信手拈来。

小程序

这个也不用多说，如今能够说是很是火的，各大平台都有在作本身的小程序，各类砍价，抢票，电商，游戏都有运用。这个以微信小程序为例，主要是微信团队基于前端基础来作的封装语法，主要的仍是ES语法。小程序目前不少公司都是招聘前端开发，目前尚未独立的小程序开发工程师，因此小程序能够说是前端工程师高薪就业的加分技能，换句话说就是成熟开发必备了。

Hybrid-App

又称混合式APP，可能据说的人不多，可是18年是愈来愈多人去开发了，这种是能直接产出下载到终端的APP的，在体验感上能够说已经具有传统APP的大部分功能了。这种开发门槛较低，也就是前端开发就能够完成。多数都是大包平台就能作，这个你能够后面了解一下。

前端主流技术框架

前面的都是基础东西，如今去就业前端开发，不是只靠个基础东西，搞个移动端页面就能够算成熟了。前端3大框架，VUE、Angular、React这3个能够说是如今很是火热的了。

 

基础语法均可以写的前端，为何还要框架？

不少小白朋友是不懂什么是框架的，只听过jQuery这些东西，觉得就是框架。或者认为框架就是加速开发，以为这些库、插件就能完成框架的工做了。

其实框架的出现，是改变前端地位的重要标志。最重要的表现，就是先后端分离，在先后端分离以前，不少后端开发都是又当爹又当妈的，效果很差效率也不高，我就是在后端出身，深知痛苦。

如今的前端项目，比之前是更加复杂化、多样化了。项目复杂了，问题也多了。

那框架到底解决了什么问题？

解决重复引用外部js，以用jQuery开发为例，不少时候都是不能单一完成一个项目的，还须要引用不少的第三方插件和库，致使会一个项目引入不少外部JS文件。

这样不只让代码变得杂乱，并且很影响打开速度。可是用框架呢，以VUE为例，通常会和构建工具配合，而后就是一个入口文件就能够完成了，在运行时候就在入口引入一次，一劳永逸。

使用组件化开发，组件是前端框架里很是强大的功能之一，它能够扩展你的HTML，封装能够重用的代码块，好比你的轮播图、tab切换、页面头部、页面底部等等。

这种独立的组件具备告终构（html），表现（css）和行为（js）完整的功能，很大程度的节省了代码量，提升了代码的复用性。特别是团队合做的时候，能够很好的提升使用效率。

减小开发周期，若是你以为jQuery能够减小开发周期了，那其实框架能够比库更快。好比说使用jQuery开发的时候，不少时候是须要频繁去操做DOM，每次效果都要去查找DOM，这样就显得很繁琐了。使用框架的时候，不少功能都获得了封装，好比说不少指令都有数据绑定，数据格式化这些功能。这样更多时候，咱们开发的时候只须要关注数据的逻辑就好了。

最后

这些也就是咱们学习前端开发必备的一些知识点了。学习路线放一下给你们。

本身是从事了五年的前端工程师，若是你是正在学习前端，或者想转行学习前端开发的伙伴，欢迎你们加入个人web前端开发qun：【四八四】【七五七】【七六零】

群里有学习教程和开发工具，对于学习web前端有任何问题（学习方法，学习效率，如何就业）均可以提出来，我会给你们及时解答。

前端开发学习不是单一的，内容比较多，一样应用的场景也很是多。若是你想从事前端开发工做，就要更急专心和努力，坚持方向不动摇！