总结

前端知识那么多，想要高效有效的学习，看这一篇内容就够了。「一站式」解决前端学习问题，先来一张前端必知必会（文末有学习线路图）： ![在这里插入图片描述](https://img-blog.csdnimg.cn/50b3b0931a144da5a2fd31df359627d6.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5Lyg5pm65pWZ6IKy5a6Y5pa55Y2a5a6i,size_20,color_FFFFFF,t_70,g_se,x_16)

一、前端需要掌握什么技能

只有知道了市场上需要什么样的前端工程师，我们目前才能更好的掌握重点去学习。Web前端技术从最开始的HTML/CSS/JS，随着时代的发展逐渐变成：HTML5/CSS3/JQuery。Web前端工程师日常的工作要和设计打交道，还有产品经理沟通，同时还要与开发沟通，所以以下内是前端需要的必备技能。

1.1 前端基础

HTML和CSS还有Javascript是前端开发的三驾马车。

HTML+CSS是可以做出来简单的静态页面的，JavaScript是可以提供更好的用户体验，也就是交互（比如你点赞本条内容，会弹出小心心）。

1.2 主流前端框架

目前主流的框架有Vue、React和Angular。框架是前端开发的必备技能，框架是可以提升大家的开发效率的。并且在优化产品性能方面也有不小的帮助。作为前端开发者不仅要学会使用框架，更要懂得底层原理。目前是Vue和React大火的阶段，不能停留在使用阶段，各位想要在这个行业扎根的同学都需要了解到每一个环节的内部机制和原理。

1.3 服务端开发

前段后已经分离，但是不意味前端开发不需要学习服务端的内容，与服务端打交道的我们一定要掌握的技能是Node.js。另外在一些互联网大厂的招聘中，直接就看到JD上写着需要Node.js的开发经验。

1.4 前端工程化

目前随着这个行业的发展，绝对不是学会前端三驾马车就能找工作的时代了，所以工程化学习不仅可以提高我们的工作效率，降低工作难度，也是企业招聘需求之一。随着工程化、组件化、模块化，逐渐成为一线互联网的标准，掌握前端工程化的求职者更容易获得面试和招聘机会。

二、如何高效入门

关于入门方面会给大家分享知识点和入门顺序，建议一点基础都没有的小伙伴先以看视频为主，后期的话再去看书。有了一定的基础之后在去研究各种框架的底层内容。

2.1 前端技术

HTML是基础中的基础，比较容易。
CSS：需要熟练掌握float、position、width、height，以及对于最大最小，会使用百分百，overflow、margin、padding等，这些是跟布局有关系的样式必须要掌握。
JavsScript：很多同学学到这里就很困惑，虽然不是所有的网页都需要JS相关的内容，但是想要实现酷炫的功能和界面都需要JS，在学习的时候会接触到后端ajax，需要后端返回数据。
PHP：在接触到返回数据的时候就需要学习PHP，入门PHP会比JS还要麻烦一点，因为运行php要有许多细节要处理。
jQuery：jQuery是相当于把Js封装了一套的js插件，目的是操作起来更加方便，写的代码更加的少，jQuery入门是比较简单的，但是入门需要学的和js一样就是代码换成jq。
Vue、React前端框架：把全栈工程师要掌握的前端技术、Node.JS相关后台技术、HTML5移动方向开发技术做了系统整合成为中高等前端工程师。
其实归纳总结之后前端就是需要学以上这些内容，大家想要知道具体的书籍+课程和学习路线图，请看下面内容。

https://www.zhihu.com/question/457596660/answer/2169934286

2.2 前端需要掌握的软件

高效学习前端开发需要了解前端开发使用的工具，目前最常用的是Dreamweaver，DW有很大的优势，尤其是针对初学的同学，很多提示的功能可以帮助我们很快熟悉并且掌握网页布局。

三、如何进阶学习

进阶阶段需要考虑的是代码的是否可读复用，主要注重的是代码的性能方面。这就需要深刻理解前端框架的实现原则和开发还有重新配置的一般终端组件能力。

在这个阶段需要学习：关于面向对象开发的思考；面向对象的JavaScript；javascript闭包、范围链、原型链等高级功能；常用的设计模式；使用本机JavaScript原理实现框架封装；jQuery框架封装原理；实现原理，jQuery插件；掌握jQuery插件的实现原理，深入理解插件实现机制的两个扩展；基于组件和模块化的发展：SeaJS、RequireJS。有能力解决复杂的问题和技术问题，并能够独立设计和开发复杂的功能模块。

最后送大家张前端学习线路完整的图：

前端知识零零散散，如何高效学习？相关推荐

作为前端开发，如何高效学习 TypeScript
大家好,我是若川.有朋友跟我说最近面试前端候选人,问到关于 JavaScript 的一些少见误区问题,候选人很多都没回答上来,他很诧异,一个从国际大厂出来的面试者,竟然对 JavaScript 的一些 ...
如何高效学习前端新知识，拓展视野，我推荐
技术日新月异,发展迅速,作为一个与时俱进的互联网人,需要不断地学习扩宽视野. 今天为大家推荐几个技术领域中出类拔萃的公众号,它们的每一篇推文都值得你点开! 1 前端开发爱好者学习路线数据结构算法 ...
如何高效学习前端新知识，我推荐这些~
众所周知,关注公众号可以了解学习掌握技术方向,学习优质好文,落实到自己项目中.还可以结交圈内好友,让自己融入到积极上进的技术氛围,促进自己的技术提升. 话不多说,推荐这些优质前端公众号前端之神 10 ...
新的一年，如何高效学习前端前沿知识~
今天强烈推荐一些互联网行业内优质技术公众号,互联网人大部分都关注了,包括目前主流的公司技术团队号,技术社区号,个人技术号,这些号行业深耕已久,会给你带来事半功倍的效果. 公众号那么多,文章是看不完的, ...
【狂神说Java】Vue学习笔记01：前端知识体系
本文根据B站[狂神说Java]vue系列视频整理,如需观看视频,请点击链接跳转 [狂神说Java]Vue视频 2.前端知识体系想要成为真正的"互联网Java全栈工程师"还有很长的 ...
总结：自学前端的高效学习路线
提到前端工程师,很多人的第一反应都是:那个工资高,门槛低的职业.没错,也正因如此,越来越多的人开始投入前端岗位. 可是有些人似乎不太了解前端岗位为何如此高薪,认为自己看了些教程,读了几本书,会用HTM ...
零基础该如何学习Web前端知识?
想要跳槽到IT行业人在近几年越来越多,大部分都是想要学习web前端技术,但是这其中有很多都是零基础学员,大家都想知道零基础该如何学习Web前端知识?我们来看看下面的详细介绍. 零基础该如何学习Web前 ...
如何高效学习 Kubernetes 知识图谱？
简介:Kubernetes 知识图谱遵循云原生人才学习路径搭建课程体系框架,及人才发展路线设置不同阶段,由浅入深,帮助云原生人才学习容器基础.Kuternetes 网络.存储.资源对象.服务发现.应用 ...
自学前端的高效学习路线.avi
提到前端,大多数人都会想到薪资高.也正因为如此,很多人想要从事前端开发这个岗位,也由此衍生出来一个问题:为什么前端工程师供不应求,但还是有很多学前端的人找不到工作? 其实行业不是缺前端工程师,是缺优秀 ...

前端知识零零散散，如何高效学习？

文章目录

总结