学习web前端，合理的学习路线，如何成为一个合格的前端工程师

学习前端，首先应该列举出整个前端的知识图谱，然后制定一个合理的学习线路图，逐个击破，只要保持学习的热情和持之以恒，肯定能成为一位合格的前端工程师。前端算是目前互联网研发岗中门槛相对较低的，只要具备完整的前端知识体系和项目业务逻辑能力，胜任前端研发岗还是比较简单的。

前端知识图谱可以自己按照如下方式列举：

在前端领域混了这几年，总结了一套前端学习的精讲视频和学习路线，如果有对前端开发感兴趣的伙伴，不管你是想转行，或是大学生，还有工作中想提升自己能力的web前端党，欢迎大家的加入我的前端开发交流群：603985993 希望大家诚心交流！，与企业需求同步。好友都在里面学习交流，每天都会有大牛定时讲解前端技术!也可以关注我的微信公众号：【前端留学生】每天更新最新技术文章干货。

那么首先，我们来聊一聊前端的基础知识（完全可以跟着学习的部分）。

HTML/HTML5，简单但是必备，前端三巨头之一，负责实现UI界面的结构部分，1990年创立至今，已经过多个版本的更迭。虽说现在前端各个框架大行其道，但是只要最终呈现在ui界面中，无论是浏览器还是webview, 本质还是要翻译成html。pug是，Vue的template是，React的JSX也是。

所以，html要牢固掌握，现在主流是HTML4/HTML5。

那题主肯定想问？何谓牢固掌握，很简单，你看到的所有互联网产品的布局，你都能轻松的写出来，记住是所有，无论是PC端还是移动端(当然还是要结合css/css3)。

CSS/CSS3,同样简单必备(其实css不简单，看学习到什么程度，够用的程度绝对简单)，前端三巨头之一，配合HTML实现ui界面的样式层，需要达到的标准如上所述，配合HTML能够实现你所见到的任何互联网产品的布局，CSS3能实现常见的交互动画(移动端居多)，达到这个程度足已。

当然，题主可能会想，那sass/less/stylus呢， css module呢？记住，把css学好，学习预处理语言so easy, 其他的css方案也如是，甚至项目中边查边用都可以，毫不费力。

JavaScript，前端三巨头中的真正的巨头，一个前端工程师的JavaScript水平，决定了你能在前端走多远。

Atwood定律是这么说的，Any application that can be written in JavaScript, will eventually be written in JavaScript（任何能够用JavaScript实现的应用系统，最终都必将用JavaScript实现）。

JavaScript，1995年创立，彼时只是为了完成以前见到的表单验证的脚本语言而已，而今已是实现最火热的编程语言之一，编程语言排行榜前10，github托管项目使用最多的编程语言，有句话是这么说的,”移动互联网时代，我们都使用JavaScript编程”，这句话一点都没有错。

国内互联网一二线互联网公司，面试要求扎实的JavaScript基本功远重于框架的使用，毕竟他们很多前端的开源产品或内部产品，都需要基础框架支撑。百度的echarts系列（echarts/echartx-x）、UMeditor、ZRender，蚂蚁的Ant Design系列、AntV、BigFish、Egg、Dva、UMI、腾讯的WeUI，还有Elementui、Uni-app、Iview等等，这些产品的底层支撑都需要JavaScript，足以见得，扎实的JavaScript基本功非常重要。

以上，都是前端最重要的基础知识部分，题主去B站、慕课网、腾讯课堂或者其他平台，搜索相关视频资源即可，近3~4年内的都不会过时。当然也可以去腾讯课堂看一下我司的相关教程，都是免费的资源。题主自由选择，只要是口碑不错的，都不会太差，重点是马上投入学习，这最重要。

接下来，就是五花八门的框架，具体我归纳为以下5套技术体系：

jQuery系列/bootstrap或其他ui框架/gulp或grunt/less。

这一套东西是传统的前端技术体系，比较老，目前市场主流公司使用不多，逐渐退出历史舞台，稍微涉猎即可。

Vue/Vue-cli/Vue-router/Webpack/Vuex/Axios/Elementui或MintUI，Vue全家桶系列。

这一套是目前市场主流，国内大部分中小型公司前端技术栈，基本覆盖到所有前端项目的业务场景。这个系列的技术，推荐题主找最新的学习资源或者从官方文档学习，再加以项目实践，2~3年前的可能已经过时了。目前Vue官方最新稳定版是2.6.11，所以题主需要学习的，至少是最近几个版本的。尤雨溪19年10月5日开放了3.x源码，github搜索vue-next即可，95.8%的TypeScript使用率，较于2.x的97.7%的JavaScript使用率，基本全部重构，所以，TypeScript也是前端必备技能了。

不过不用过于担心，公司中目前主流依然是2.x，未来TS是趋势。

React/React-Router/Redux/Webpack/Thunk/Redux-Saga/Dva/AntDesign系列.

这一套技术基本是中大型互联网公司前端技术栈，React框架使用率全球第一，国内可能稍劣于Vue，可以说是对前端技术体系的颠覆，让前端代码的组织变得优雅而易于维护，性能爆炸高，目前官方最新稳定版是16.12，题主找16.x版本的资源学习都不会过时。之前的版本都会过时了，比较最新版本的更新迭代还是调整较大，具体可去看官方版本日志。

微信公众号，微信小程序、支付宝小程序系列

这套技术体系原生写法和框架都很多，我就不一一列举了，前端开发必备技能，因为目前大部分公司的产品，都是全平台的。找最新的相关资源学习即可。

Hybrid混合式开发。

很多公司为了节约开发成本，Hybrid也是必不可少的，一套代码，跨三端（Web/Android/IOS）,想想都有点小激动呢，其中主流的 ReactNative、Ionic、Week。

此外,目前NodeJS在前端不可或缺。另外跨多端的解决方案，Vue体系的: uni-app, React体系的：Taro/Flutter目前火热，已经跑在很多公司的生产环境中，都需要学习掌握。这几年，将会是趋势。这些学习资源，几年前是没有的，题主可以自行搜索学习或者看官方文档即可。

技术更迭变化，唯一不变的，是作为一个技术人员，对技术的执著和热爱，作为技术路上的同行人，路漫漫其修远兮，吾将上下而求索，与题主共勉。

学习web前端，合理的学习路线，如何成为一个合格的前端工程师相关推荐

如何成为一个合格的硬件工程师，如何学习硬件设计？
如何成为一个合格的硬件工程师,如何学习硬件设计? 现在很多准备毕业的大学生或是毕业刚出来没多久的大学生,会发现自己从事的岗位所用的知识跟自己在学校学的东西很多都搭不上,在学校各种专业课各种优秀,但是到 ...
做一个合格的前端，gulp资源大集合
承接前一篇<做一个合格的前端,gulp自动化构建工具入门教程>故而整理了如下gulp插件资源大全. **[我的新作观点网:http://www.guandn.com (观点网是一个猎获新奇 ...
对不起，我骗了你，我不是一个合格的前端工程师
我是一个梅州人,在深圳上班,从上图可以看出我是一个大专生,其实不是的,我欺骗了大家,我是06年高中毕业,因为读书偷懒,并没有考上一个好的大学,结果阴差阳错的跑去茂名读了一个中专,读中专的时候并没有好好 ...
从10个角度来检测自己是不是一个合格的前端工程师，这些要求你都达到了吗？
开篇前端开发是一个非常特殊的行业,它的历史实际上不是很长,但是知识之繁杂,技术迭代速度之快是其他技术所不能比拟的. winter在他的<重学前端>课程中提到: 到现在为止,前端工程师已经 ...
从10个角度来检测自己是不是一个合格的前端工程师
开篇前端开发是一个非常特殊的行业,它的历史实际上不是很长,但是知识之繁杂,技术迭代速度之快是其他技术所不能比拟的. winter在他的<重学前端>课程中提到: 到现在为止,前端工程师已经 ...
系统化web前端需要技能所占比（通过图表分析来看您是不是一个合格的前端）
我想很多人在找工作的时候都会面临的一个问题是,我会的技能到底是不是公司需要的技能,我会的技能到底在公司可以用到多少,还有我的目前会的技术是不是目前比较流行的技术,我目前的技术还可以做些什么....其实 ...
前端学python有什么用-对于一个小白，前端和python哪个更适合？
作为一名IT从业者,同时也是一名教育工作者,我来回答一下这个问题. 首先,从入门难度上来看,前端开发和Python开发都比较容易入门,即使没有任何计算机基础知识的人,在刚开始学习这两个技术体系时,也不 ...
手写一个合格的前端脚手架
为什么我们需要一套脚手架为什么我们需要一套脚手架,它能帮助我们解决哪些痛点问题. •前端项目配置越来越繁琐.耗时,重复无意义的工作•项目结构不统一.不规范•前端项目类型繁多,不同项目不同配置,管理成 ...
重庆华清远见-前端部分阶段学习
html 客户端/服务器 Client / Server CS模式用户需要下载安装一个客户端才能使用.如通讯工具.网游.购物软件等. 特点:功能丰富,安装略微繁琐,需要更新,不同平台,软件不同浏览 ...

学习web前端，合理的学习路线，如何成为一个合格的前端工程师

学习web前端，合理的学习路线，如何成为一个合格的前端工程师相关推荐

最新文章

热门文章