专注前端开发,每年100集免费视频。
首页/程序软技能/ 2021前端开发学习路径 一张图让你轻松自学/
2021前端开发学习路径 一张图让你轻松自学
2021-04-15 程序软技能 15789

想自学前端?却不知道学习路径。报个班吧,又怕被坑。这期视频和文章一定可以帮助到你。

在2017年以前,想给出一张学习前端路径是非常困难的,因为那时候前端技术疯狂涌现,争斗不断,每个公司所用的东西也各不相同。但最近两年,前端技术和三大框架地位趋于稳定,所以我才敢给出这个前端开发学习路径。

本期视频我缩短了视频时长,目的是减少废话,增加内容含金量。

前端学习路径图

新手自学前端开发的六个阶段

我这里讲解的是面向新手的学习路径,如果你有基础,可以利用这个路径图查缺补漏。废话不多说,直接开始。

第一阶段

想成为一名前端开发人员,第一步就是网页布局和效果实现。也就是我们常说的切图仔,这时候你需要学习HTML+CSS。此部分的学习目的是把UI设计师给你的设计稿用HTML+CSS还原成网页。这部分的难点是有大量的标签需要你记忆。但是不要紧,刚开始你只要了解这种标签的形式,以后在工作中用的多了就熟练了。做个比喻就是你只要记住心法,以后实战多了,招式自然精通了。

再简单点,就是你不需要记住所有的标签,你只要知道都能实现什么,然后不会就去百度或者查文档。

这部分视频在网上有大把的免费视频,建议找一个全一点的,新一点 。直接一边看,一边写,这个在1-2周内拿下。

第二阶段

HTML+CSS学完后,你就可以做出任何漂亮的网页了,只是可能交互效果还实现不了。这时候你就要学习第二阶段,JavaScript了。这个阶段是比较难的一部分,因为这部分学的好与坏,直接关系到你后边的学习进度。我到现在,每年还在翻看《JavaScript权威指南》。

但是如果你是初学者,学这部分也不要太执着,非要达到精通的程度,才往下学习。你可以先大体过一遍所有语法,然后直接进入下一个阶段学习。因为以后学习阶段,还会不断的使用这些JS语法。

这个可能要在一个月左右才能拿下,注意我说的不是精通,我作了这么多年前端,也不敢说自己精通JavaScript。

第三阶段

有的老旧过时的路径会推荐你学习JQuery,这个是完全不正确的。在2021年完全没有必要再学习JQuery,因为正经公司已经不再使用这个东西。其实这个部分你可以学习一下ES6、ES7、ES8甚至是ES9的最新JavaScript语法,这部分内容再你学习JavaScript基础知识时,一般都不会包括。而在工作中中这部分的知识确实最常用的。

第四阶段

当你走过了前三个阶段,你就可以做出任何你想要的界面了,这时候你可以找到前端实习生的工作了,也就是在公司里布局页面和作交互效果了。这个阶段不仅要学习PC端网页的布局,更应该多些经历研究移动端和多端布局。

多端就是随着终端的转换,你布局的页面会有不同的呈现方式,而代码只有一套。这个阶段的难点就是要进行大量的实战操作和练习。推荐在工作中不断精进。

第五阶段

学一点Node的知识,这里是学一点,你不需要全会,也不需要作后端程序,你只需要会用基本操作和npm包管理就可以了。因为无论是Vue还是React框架,都需要使用Node来进行构建和管理。

这部分建议一周内完成学习,不要太纠结,因为后期等你找到工作了,还可以继续学习。

第六阶段

学习Vue框架,因为前边这些内容虽然可以做出任何WEB界面了,但还不能让你找到一份心仪的工作。所以你需要学一个流行框架。这里首推的就是Vue.js,因为在国内,这是使用最多的框架,而且上手要比React容易一些,所以建议先学习Vue.js。

学完这个后,你会知道什么是数据驱动开发,什么是SPA应用,也能轻松的实现前后端分离和服务端渲染。

学完后,建议开始试着去找一份实习工作,因为达到了初级工程师的水平,这个时候你可以开始你的前端工程师之旅。

第七阶段

当你进入工作后,你会发现你还要学习很多相关的前端技能,比如Node.js、TypeScript、Webpack、小程序开发、React.js、ReactNative、Flutter框架、Liunx运维、自动化测试。如何学和重要的知识点,在路径图中都有详细的介绍。我这里就不过多废话了,此时你应该有了自学能力。

为什么我建议这些东西在工作后学习那,因为这些东西有的是选学(也就是根据公司的需求),比如小程序、React.js、Flutter框架、Liunx运维,而有些用的比较少,比如Webpack和自动化测试。

如果你要走完这16个阶段,那学习时间会拉的很长,你也会因为缺少练习而学完后边,忘记前边的知识。所以建议你工作后,根据情况继续精进。

由于时间的原因,我不能把每一个学习阶段扩展来讲,但图中已经有了详细的介绍,自行下载就好。

总结

如果你觉的这个视频对你有些帮助,请点赞,如果你再能点击一下关注,这就是对技术胖最大的支持了。

好了,这期视频和文章就到这里了。下期视频带大家看看2021年最火的Github前端开源项目。我们下期视频见了,再见。

对不起,该文章暂时不支持留言。
最新留言

No Data

技术胖
光头Coder12年经验业余讲师免费视频被访问
文章目录