一篇文章告诉你零基础如何学好WEB前端

以下纯属个人观点和建议，肯定是有局限性的，但是也希望能给你带来一些帮助。

我们俨然能感受到前端岗位现在已经发展成了最重要的研发岗位之一，所以对我们提出的要求也就越来越高了。所以我们需要的也就不仅仅只是掌握css、html、JavaScript了，但是这三大件一直都是前端的根本，这一点从未改变，而这三大件中JavaScript又是重中之重、

接下来我会结合我的一点经验，给出前端系统学习路线的一些具体建议以及入门前端时的一些困境。

入门前端时的一些困境

1、因一些基础算法、数据结构理论不扎实导致一些编程思维难于理解。比如 原型链，如果清楚 数据结构中链表结构，那么这个东西不难理解，再比如 哈希值，懂得数据结构中哈希表，哈希值也就迎刃而解。

2、计算机体系结构、操作系统理论、网络理论不扎实导致到后期一些东西难于理解。比如有同学从前端学习入手，后来学习node开发 ，在 I/O ,进程、线程、IPC 、线程锁方面有些概念就比较难于理解，而导致不能很好得使用node 的api 。

3、前端整体体系架构没有做过深入思考。

导致用会用，但不知道为什么用，用另外一个有什么区别。

4、学习环境中无高手。

没有高手能够指导自己进入下一个层次。

5、有意识但是没有行动，收集了一堆资料或者一堆视频，然后就没有然后了 。

如果你想要学好WEB前端，在学习过程中，身边没有一个能够指导你学习的人，可以到这个WEB前端裙：484，757，760，里面有我根据目前市场需求，录制的最新的系统教程，不管是计算机专业想要往WEB前端方向发展，还是零基础想转行，都可以跟着教程学，有什么不懂的可以在里面问。

学习web前端的注意事项：

1.不要以看书学习为主，学习编程不是数学语文那么容易，你看看例题就会了，更需要的是别人的讲解，你自己看书上那些专业的文字，只是凭你自己意识理解的那样来，但是一般情况下我们都理解不了，毕竟我们不是出书的人，最好的方式就是找视频进行学习，找好的视频进行学习，然后在配上别人的解答，在加上自我的主动学习。

1.别花冤枉钱去线下机构培训，现在培训费用都在2W块钱以上，而且只学4个月的时间，找工作也是非常的难。我个人不建议完全自学，也不建议去线下培训，我更建议零基础的人在网上寻找一个线上的教学课堂，有老师讲课和解答那种，费用也不高，可以帮助你学习。

2.当你学习的时候，可能会出现学了就忘记不住的情况，小编见过很多这样的情况，包括自己曾经学习的时候也是这样。打个比方：比方说我们在学习英语的时候，一天学习20个单词，但是过了一周之后，我肯定会忘记之前学过的单词。那么记住这些单词最好的办法就是应用于对话当中。我们学习web前端也是这样，同一个标签或者属性，或者是JavaScript的语法，只有你不断的见到它，并且应用它，让它都认识你了，这样你就扎实的掌握了，所以实际应用非常重要。

3、学习方法

学习方法决定了你学web前端的效率以及你可以走多远，学习编程非常依赖一个好的学习方法，有太多人因为学习方法不对最终导致放弃。

如何系统的学习以及学习的知识点：

阶段一 : 前端基础 学完前端的基础知识，大家基本能够根据PSD文件文件，完成PC端静态网页的开发工作，但是学完此阶段，尚不能够达到企业用人标准。 HTML：浏览器与浏览器内核、HTML基本结构、HTML常用标签。 CSS：CSS介绍和CSS样式表、CSS基本选择器、CSS复合选择器、 CSS三大特性。

阶段二 : 移动Web网页开发 学完移动Web网页开发,大家能够完成移动Web网页、响应式页面以及炫酷页面的开发工作，当然完成此阶段，任然不能够达到企业用人标准。 H5C3进阶：vscode编辑器基本使用、HTML5新增标签。 Flex 伸缩布局：移动端基础知识、Flex伸缩布局基础知识。 移动web开发：媒体查询、less介绍和使用、rem适配及原理。

阶段三 : JavaScript网页编程 学完JavaScript网页编程，相信大家已经能够完成PC端网页、移动Web网页、响应式页面中的功能和特殊效果的开发工作，具备一定的企业基础用人标准，但尚未达到初级前端开发工程师水平。

JavaScript基础语法：计算机基础和JavaScript介绍、JavaScript变量、JavaScript数据类型、JavaScript操作符、 JavaScript数组和冒泡排序、 JavaScript函数及应用、JavaScript作用域及预解析、JavaScript对象、JavaScript简单类型和复杂类型。

WebAPI编程：API 和 Web API、DOM介绍、 BOM介绍及应用、this指向和js执行机制、location、navigator、history对象、 offset、client、scroll三大家族介绍及案例应用、缓动画的原理和封装。

jQuery快速开发：jQuery介绍及常用API导读、jQuery链式编程及样式操作、 jQuery事件绑定和解绑、jQuery插件的使用。

JavaScript高级：面向对形象编程介绍、类和对象、构造函数和原型对象、forEach、some。

Object.defineProperty方法、函数进阶、call、apply、bind的使用、 闭包及应用、递归及应用、正则表达式及应用、ES6中的let和const、ES6解构赋值、ES6箭头函数、剩余参数和拓展运算符、 Array实例方法、ES6模板字符串和set数据结构。

阶段四 ： Node与Ajax 学完阶段四的内容，大家能够完成前后端数据交互、基于前后端分离模式、传统模式的开发的工作，学完此阶段，具备企业基础用人标准，能够达到初级前端开发工程师水平。

Node+Gulp：node介绍和环境安装、node模块化、gulp使用、服务器和http协议、Promise。

MongoDB+Express：MongoDB数据库和数据库的增删改查、mongoose验证、art-template模板引擎使用、Express框架。

Ajax：Ajax基础知识、Ajax函数封装、 CORS、jQuery中Aajx方法的使用。

Git和GitHub：git配置和使用、github及多人协作开发、git补充内容。

阶段五 : 前端工具和框架

掌握前端工具和框架，大家能够实现基于Vue技术栈项目的开发能力，学完此阶段，具备企业用人标准，能够达到中级前端开发工程师水平。

Vue基础：axios和vue-resource、vue动画、vue组件、vue路由

webpack：webpack介绍与安装、webpack之loader配置与使用、webpack与vue结合使用。

是不是看着怎么要学这么多知识点啊！

下面是目前企业招聘前端工程师的基本需求：

1.精通DIV+CSS网页框架布局的HTML代码编写，熟悉W3C标准；

2.使用HTML5/CSS3熟练地进行页面开发；

3.具备良好的前端架构分析能力与设计能力，与开发团队保持良好沟通；

4.精通各主流浏览器（IE6+、Firefox、Chrome、Safari）间的差异性，能快速定位和解决各种兼容难题；

5.熟悉JavaScript、Ajax、Flash、JQuery、ExtJS等各种Web前端开发技术，具备一定的跨浏览器开发经验；

6.熟悉Vue，react