作为一名大三开始学习前端,如今已经工作三年的前端狗,跟大家谈谈我的前端自学之路,以及自己的学习方法,和前端学习资源推荐。本篇为前端入门指导文,各位大神请避让。

前端行业这几年发展飞速,各种框架层出不穷,很多开发者都戏谑说自己学不动了。确实,我们应该充分利用自己的有限时间,好的学习方法和资源非常重要。以下所有方法都是自己踩过坑的总结,保证能让各位在前端学习之路上事半功倍。

写在前面:尽信书不如无书,人工撰写定有纰漏,争议之处可留言讨论

第一阶段的学习: htmI+css +javascipt入门

我知道很多人前端入门都是w3schoo上学习,我个人是不推荐的。上面的知识点太多, 平时工作中跟本用不到。如果你在w3School 上从头开始看知识点,你只会边看边忘,效率太低了。记住我们是逼格很高的前端工程师,不要去做死记硬背的工作,用的多了自然就记住了,实在记不住的还有度娘。(入门学习者最爱犯的错误就是纠结, 总纠结自己今天学习的某个标签、某个css语法没有记住。我只想说这不是高中考试,还要默写。大概了解就可以,等以后项目做多了,复制黏黏的次数多也就记住了)

重点来了,说了这么多,入门我们应该在哪学呢。经过自己的不断采坑发现一个优秀到无法形容的网站,特别是对于前端萌新。它就是哔哩哔哩,里面对基础知识的讲解-结构清晰、主次分明。并且网站上都是一些常用功能, 其他令[ ]的知识点作者都过滤了。对于没有任何基础的前端萌新来说,简直是再合适不过了。

里面所有的知识点,作者都进行了归类,特别方便记忆。学习的过程中,你脑中的所有知识点都会条理清晰。自学最难受的就是自己脑中的知识点混乱,又没有人指点。那种无力感,自学过的都知道。并且作者对内容的讲解精确独到,没有故作深奥。章的总结以及题目也是恰到好处。所以对于基础篇,你只需要将网站中的HTML + css + javascript看完就可以,练习题跟着敲一敲就

ok,对于w3school和菜乌驿站这类网站只适合当作字典去查询。周时间也就ok

当你看到这篇文章,发现这个网站,你已经比我节约了一个月的时间。网上其它前端基础类的讲解网站,真的像老太太的裹脚布又又长。

二、html5+css3+javascript高级

过了第一关新手村, 有点难度的东西来了,并且这块知识点也是面试问的最多的。(入门学 者最爱犯的错误就是在学习框架之后,就把这块给扔掉。一定要记住, 这块知识点财初级前端面试的重点也是一面必考的知识点)

这一趴,我不推荐看文章学习。因为知识点稍微有点复杂,看文字的学习效率没有看视频高,慕课网上有很多视频,讲解也很透彻,会比看文字学习效率高很多。但是价格都不便宜,当初我自学的时候,也是投入了很多钱的。当然网上也有很多免费的视频课程,不过都是过时了的,或者不够系统的。贪这个便宜就是在浪费自己的时间,最后什么都没有学到,得不偿失。

这趴,两周时间堤ok对于没有计算机基础的人,时间可能有点紧张,但还是应该逼自己一把。

三、es6+sass

这块的内容属于扩展的内容,es6是JavaScript的扩 展,sass是css的扩 展。对于入门学者来说可能会觉得这块内容比较陌生,看上去高大上很难学的样子,其实它比第二趴的内容简单多 了。(前端学习者最爱犯的错误就:是把这块想的过于高深)

es 6现在还是用的比较普遍的,随着浏览器的兼容性越来越高,公司的项目大部分都是用es6的语法,如果完全不了解,看前辈的代码可能比较吃力。es6网上的学习资源很多,es6没有 萌新想象的复杂,都是一些语法糖,平时工作中用到的也就是promise、module、 async等 些功能, 不必过于纠结,了解即可。

sass、less等css扩 展性语言,了解一个即阿。绿叶学习网上就有sass入门教程,过-遍即呵。看完这两个教程,-周胞够。。。

当然,如果你觉得这趴内容看文字学习比较吃力,也可以通过观看视频进行学习。

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

四、vue +VueRouter+Vuex+ axios

说了这么多,大家最关心的前端框架来了。现在比较火的mvvm框架vue和react.。对于萌新来说,我比较推荐vue。入手快、学习成本低资料全、 所有的坑前辈都帮你们踩了,公司的使用率也很高,完不愁找不到工作。

对于这块的学习,- 开始我不推荐看官方文档,特别是对于萌新来说看官方文档学习,效率会比较低下。官方文档比较全面,涉及的知识点也此较多,很多是刚开始工作用不到的。我还是比较推荐视频学习,高效吸收快。等你入门了,再看文档重新梳理一遍。鵝学习以到局部,这样学习的过程中就不会困惑与纠结

网上关于vue及其全家桶的视频很多,但都不太适入门学习者。要不就是一直讲项目, 涉及的业务逻辑比较多,知识点较少。要不就是完全讲api的使用没有实际操作,枯燥也没有整体项目的思维。我之前过个vue及其全家桶的视频, 題个简单的项目,将vue的所有知识点来,特别适合萌新。这趴学完,可需要三周。

至此,你算已经是跨入前端这个行业了。但不幸的告诉你这才是万里长征的第一步。想升职、想加薪、想成为大牛,你要学的知识还有太多。

根据按照路线学完的粉丝反馈,我把学习的时间改了下,现在入i ]学完需要的是七周。标题和图片我就不改了,偷个懒。再灯鸡,男儿读时。加油吧

扩展接下来的内容前端入门可以不用学,等找到工作再学也不迟

webpadk + git+node

webpack. git、 node属 于高级的前端的知识点了,也是前端的分水岭。本来我是不想在入门学习中提及的,但还是希望各位了解下,学习除了深度我们也需要广度。所以作为萌新的你只要会简单的使用就行了,不用去深究。上网看- 些入]的博客就好或者入i ]的视频,我也有一些自己的学习笔记,有需要的可以发给你。

开发具一vscode

工欲善其事,必先利其器。想要优雅且高效的编写代码,必须熟练使用一款前端开发工具,我个人首推vscode.它的详细使用及配置教程,可以看我下面的这篇文章史上最全vscode配置使用教程。

2021年怎么自学前端?相关推荐

  1. 是自学前端还是培训学前端?

    "学web前端是自学好还是去培训机构,哪个靠谱?" 类似的问题应接不暇,包括前段时间逛知乎,关于这个话题的热度,还是居高不下. 都快2021年了,匆匆入场的人还是很多,尤其是在校大 ...

  2. grep从文件末尾开始找_新人自学前端到什么程度才能找工作?

    这个问题打我记事起到现在,问过我的人,没有1000也有800了.足以见得这个问题是多么的不得人心. 自学前端开发,不管他在网上百度了多少资料,看了多少教程,你总得先做个网页出来.所以,很多人都是从ht ...

  3. 如何系统地自学前端(女生),女生发展前端是否是青春饭?

    看问题描述,题主应该对互联网开发了解的不多,题主问的就是两方面: 1.女生如何自学前端? 2.女生如果从事前端开发这个工作能不能长远的发展? 最初我入行的时候也有这样的担忧,很正常. 网上大力鼓吹兴趣 ...

  4. 自学前端真的没有前途吗?

    现在全职从事前端工作,到20年年底整6年,在做前端之前,我是那种跟在销售后面,他投标,我负责把他吹的牛逼变出来的板儿砖型程序员,什么语言和技术栈,根本不是借口,deadline放在那里,让你今天学一个 ...

  5. 自学前端,一天学4个小时左右,能到什么水平?

    自学前端,你的学习时间不是最主要的 而是你拿着这些时间做了什么 如果只是简单的看一些理论知识,没有实际操作 那是远远不够的 如果你是拿这些时间全部用来写demo,折腾一些实战项目 那用不了多久,你水平 ...

  6. 自学前端,需要学习哪些知识点?学多久可以入职前端工程师?

    假如有那么残酷的一天,我不小心喝错了一瓶药,一下子抹掉了我这十多年的编程经验,把我变成了一只小白.我想自学 前端,并且想要找到一份工作,我预计需要 6 个月的时间,前提条件是每天都处于高效率的学习状态 ...

  7. 自学前端很难吗?只要你足够努力,高中学历也能获得offer

    这是一位粉丝朋友分享的他的故事,很感人,希望以此激励那些转行前端现在却很吃力的朋友们. 正文开始: 不得不说,我的人生比很多人都要黑暗,我是2014届的本科生,但是本科我只读了三年就中途退学了. 当时 ...

  8. 0基础自学前端好,还是报班培训好?

    0基础自学前端好,还是报班培训好? 1.自学 优点: 1.自我分析问题和自我解决问题的能力比较的强:自学要自己的找学习资料,学习要自己的摸索学习,学习中遇到的问题要自己去分析,自己去解决. 通过自学成 ...

  9. 自学前端两三个月,很迷茫,有大佬可以指导吗?

    自学前端两三个月,很迷茫,有大佬可以指导吗? Web前端工程师已经成为互联网公司,最亲睐的对象,不管是起薪还是薪资涨幅,都居所有互联网行业职位之首,成为互联网行业最有"钱"景职位! ...

最新文章

  1. vba保存文件为xlsx格式_Vba把Excel某个范围保存为XLS工作薄文件
  2. android 解决ListView点击与滑动事件冲突
  3. Windows服务ServicesDependedOn的奇怪问题?
  4. uva455periodic strings周期串
  5. 5.6 图像颜色映射
  6. Python中的基本函数及其常用用法简析
  7. 使用AJAX实现上传文件
  8. 福州万宝产业园的远程预付费电能管理系统
  9. 西门子PLC usb编程电缆驱动
  10. Step7 MicroWin V4.0 SP9在Win10系统中的安装方法
  11. 热敏电阻温度采集简述
  12. c语言 函数-斐波那契数列,c语言斐波那契数列递归法(示例代码)
  13. Spring入门之bean的配置
  14. xp每天定时关机命令
  15. CSS实现抽奖大转盘
  16. 创建自己的RSS服务——debian docker TinyTinyRSS搭建
  17. 基于猫眼票房数据的可视化分析
  18. sort函数用法详解
  19. 从阿里云邮箱迁移至网易邮箱
  20. 网络对抗作业 一------袁昊晨

热门文章

  1. mysql生活使用方法_MySQL Workbench使用教程
  2. 虚拟机的管理(libvirtd)、移植和快照
  3. springboot读取src下文件_springboot获取src/main/resource下的文件
  4. Visual Studio Code 构建C/C++开发环境
  5. Url有值怎么使用get传值
  6. [运维-服务器 – 2A] – nginx下绑定域名
  7. 关于html frame导航
  8. I.MX6 make menuconfig OTG to slave only mode
  9. Grow heap (frag case) to 6.437MB for 1114126-byte allocation
  10. 他人笑我太疯癫 我笑他人看不穿