前端学习路线
前端学习路线
这么是我根据自己以前的学习情况，罗列的学习进度，可能不适合每一个人，还是有很好的参考意义的；
我认为还是不错的前端自学路线
首先学习的时候，不要想着大而全；
很多知乎上包括网上列举的学习路线都是想着大而全，什么都去搞，恨不得把前面5年的学习路线都安排好的；
我觉得新手不应该这么做，新手学习的时候应该有自己的主要方向；
不要贪心，不要想着大而全，前端是很繁荣，是新技术层出不穷，但是新手的大部分时间应该死磕核心部分；
01.环境搭建
前端环境很好搭建，编辑器+浏览器即可
浏览器推荐使用 Chrome
行业内主流的编辑器有下面三个
初学者随便找一个就好，喜欢轻量级的使用vscode，喜欢工业风一样的使用webstorm;
我个人是两个工具都有使用；
还有一个说明的，VScode是开源免费的，webstorm是收费的；
更多的前端开发环境的效率工具，可以参考我分享了一个 搭建WEB前端开发环境，有哪些常用软件需要安装呢，感兴趣的可以看看，了解前端开发中都使用什么软件；
02.HTML
如果要做网页，HTML是基础骨架，必须要掌握的；
到这里，你的HTML就算可以熟练掌握了，注意本篇文章说的，都是你一步一步跟着动手敲代码的基础上说的；如果你只是大概浏览下，没有真正动手敲代码，那是不行的；
这是一段非常枯燥无味的阶段，如果你感觉枯燥无味，不要紧的，你可以学完 HTML 教程 和 HTML5 教程 后直接进入CSS的学习阶段，这样会让你学习的乐趣增加不少；
等以后合适的时候，再回头看逐个研究 html 标签也是一个不错的选择；
03.CSS
做网页，如果光有HTML会感觉好像一个半成品一样，加上适当的CSS美化，会更符合用户体验；
- 1.先通过 CSS 教程 学习大概
- 2.再通过 CSS 教程 学习哪些新属性，这在做浏览器兼容低版本的时候特别有用
- 3.最后通过 CSS 样式表参考手册 加深对每个属性的印象
这个阶段，你会稍微有点成就感，毕竟是可以做出一些看起来高档上的网页了；
如果你以后打算做出漂亮的网页，那么你最好老老实实把上面三个都按部就班的学习一遍；
如果你是打算更加偏重于JS的方向，那么第三个 CSS 样式表参考手册 可以稍微浏览就好，等遇到不会写的样式，百度搜索下问题，然后再重点看下当时场景用到的CSS属性也是可以的；
04.仿一个你经常浏览的网站，最少重复3次
学习玩HTML和CSS之后，你写的代码，都是这一部分，那一部分的，没有一个整体的概念；
这个时候，非常推荐你仿制一个你经常浏览的网站，只用HTML和CSS去实现，遇到JS效果，直接不做；
在动手之前，我强烈推荐你一定要开通一个自己的技术博客
开通一个技术博客
可以使用第三方的博客，比如 cnbolg/CSDN/简书/掘金/知乎，这些都是国内不错的博客平台；
开通博客的是用来把你容易忘记和有体会的技术都记录下来，不要感觉有些知识点特别low，所有的技术大牛，也都是一点点的积累才能脱变的；
学会Github的简单使用（如果影响学习兴趣了，可以直接跳过）
注册一个Github账号：https://github.com/
注册这个是用来管理你的代码，因为你下面要模仿一个常去的网站，并且不止实现一遍，如果有一个版本控制还是非常赞的；
注意：使用Github，需要学习基本的Git使用，https://www.axihe.com/tools/git/home.html
如果这一步影响你对WEB前端的学习兴趣了，那么就直接跳过不要做了，这一步是锦上添花的，不要强求；但是你仿站的代码一定要保存好；
如果通过练习仿站来提高技术
推荐你把整个网页截图下来，然后根据图片来实现；一般的网页都最低会有 首页 和 详情页 这两个页面；
然后用你学会的知识，根据截图来写出这些网页
注意：同一个网站最少做3遍！！！！
注意：同一个网站最少做3遍！！！！
注意：同一个网站最少做3遍！！！！
我个人认为，写东西不是越多越好的，而是通过敲代码，能总结出来的东西越多越多！可以逐渐提高自己的技术才是最终目的；
比如你把小米，京东，腾讯网等等都写了一边，我认为这样是很傻的行为，真的就是纯粹搬砖的了，对技术的提高并不是很好！
最好的方式，是一个网站，你重复的写，重复的写，然后每一遍都有不错的心得体会
- 第一遍，你只需要仿制的和原来完全一样就可以！
- 注意：这里说的是完全一样！！！最好的是1Px的误差都没有
- 不会写的HTML标签，和不会用的CSS属性，可以回头查查
- 然后总结出这次写的内容中，有哪些可以优化的，哪些可以重复使用的元素，那些设计的不合理，需要重新布局
- 第二遍：总结你第一遍的不合理和思路重新设计
- 一般初学者第一遍写的东西，基本都是面目全非的；避免掉一些不合理的地方，抽出一些复用的元素，重新设计你的实现思路
- 这一步能不查资料，就尽量不要查资料
- 注意这一步是从0开始，一定不要在你第一遍的内容上修改来实现
- 实现完成以后，记得总结下这一边还有哪些瑕疵
- 第三遍：断网并且关掉智能提示再实现一遍
- 这一遍再对第二遍的优化，并且需要断网和关闭智能提示来实现，可以增强记忆；
通过上面的3次练习，你对静态网页的书写，一般会有自己的心得了，最好每次都用博客的形式记录下来；
05.JavaScript
通过前面4步的情况下，你对静态网页，基本算是略有小成了，这时候不要骄傲，你的水平可能刚刚够得着"切图仔"的水平，前端的大杀器是JavaScript，你前面学的那些只能算个热身运动；
作为一个web前端工程师，js是很核心的部分，也是相对来说很难的一部分（其实你写着写着会发现，JS其实和CSS一样，基本就是那些事情，做项目的时候重点反而是复杂场景下的逻辑处理）。
这时候我推荐你买2本书，一本是 JavaScript 高级程序设计 ，一本是 JavaScript 权威指南
这两本书是结合下面一起看的，这两本书买来后并不是让你都读完的；我推荐你各取一部分的阅读；
JavaScript 权威指南 有用的部分
这本书只读前面一些章节，主要是语法和方法部分；就是语法，表达式，语句判断，对象类型，数字类型，字符串类型，数组，函数，这些读完以后这本书的对你的学习意义就没有了
JavaScript 高级程序设计
这本书总体还是不错的，语法和方法部分也可以读下，看看和权威指南的表述区别，重点是读函数/闭包，对象，原型，原型链基础，DOM二级事件，AJAX 这些部分
提示：JavaScript 权威指南这本书在函数/闭包和原型链继承一块写的非常的普通，而高级程序设计就写的非常到位；这就是为什么两本都推荐买的原因，是推荐你有选择的进行阅读；
JS的学习思路
有一个不错的JS入门教程，也推荐下，是智能社的Blue老师做的 JavaScript教程
地址是：https://www.bilibili.com/video/av30494570
入门使用，仅仅是热身，智能社这个教程学完其实你的JS处在已经会用，但是真正做东西又不知道怎么做的水平；下面推荐我写的一个
我在Github上有分享一个 JavaScript的学习笔记：https://github.com/anbang/javascript-notes 还是推荐看一下的；
我现在正在慢慢整理为一个深度的 JS 教程, 推荐你看看这个教程学习；
学JS的时候一定要跟着敲；
学JS的时候一定要跟着敲；
学JS的时候一定要跟着敲；
学习的目的并不是把教程看完，而是慢慢学，遇到不会的第一遍不行就第二遍写；上面2个教程全部学完以后，记得再回头看一遍巩固一下，中间把推荐的2本书也多翻翻；
上面两个教程看完以后，你的原生JS已经算可以的了；
这时候推荐你看看 ECMAScript文档，因为前端一直在发展，书上和教程上并没有后面新增的 JS标准（比如2020年出的ES11这些标准）；ECMAScript文档还可以帮助你定点研究
上面如果是一步一步代码写到现在的话，全部搞完，时间最好是在4个月-5个月的样子完成，不要追求快；按部就班的搞，你后面会越学越兴奋的；如果这之前学的不牢固，后面容易凉；
06.用原生JS写一个带AJAX获取信息的项目
有些网站会提供对外的API，比如天气预报啊，便民查询之类的东西；
你可以用公开的API做一个项目，你可以自己选择下；不要担心自己的技术，这时候你已经很厉害了；
我推荐你用V2EX的API做一个V2EX的网站，API地址是：https://v2ex.com/p/7v9TEc53
因为有上面第四部的基础，写静态页当然是没有问题的了；第五步的JS也是为你做了充分的JS基础；这时候应该是可以实现自己想要的效果的；
买盗版视频学习
虽然不推荐，但是买培训班的盗版视频来学习，确实是非常不错的方法；培训班的内部视频，在淘宝，咸鱼上都可以买得到。
注意：即使你买视频看，自己也一定要动手敲代码！！！一定不要偷懒！！！
07.学习jQuery
推荐你买一本书，锋利的 jQuery，这本书学习的时候是推荐全部读完的： https://www.axihe.com/books/fld-jquery/home.html
然后配合 jQuery 教程 一起学习；
如果你一步一步的跟着做，学习jQuery这一步，你大概是10-15天的样子可以完成
08.用jQuery实现第6步的项目
这个时候再重新做一遍第6步的项目，注意是从HTML/CSS开始写的那种重做；
这时候的耗时要看你第六步做的项目来看了；
09.学一套主流mv*框架
vue，react，angular2选一种；
如果想大厂工作，我推荐React，如果是小公司工作建议从vue开始；
当然这是一个很模糊的界限，大厂小厂vue，react都有用的，但是因为项目的原因和成员规模不同，所以团队的抉择还是有重点偏向的；
vue学起来平滑些，结合vue，学一下vue-router，vuex，axios，webpack；
React更符合函数式编程，结合 React，学一下 React Redux
10.用mv*框架实现第6步的项目
这个时候再重新做一遍第6步的项目，注意是从HTML/CSS开始写的那种重做；
用你第9步学习的知识来实现；
完美撒花，这时候，你已经是一名基础不错的前端开发了；
写在后面
可以注意到，从第7步jQuery开始，讲的就不是那么细致了，则是因为在前6步里，你如果是跟着动手敲出来的，从jQuery和mv*框架，你都是很容易上手的；
还有就是你学到那个的时候，已经不需要别人告诉你怎么学了，你自己会有自己的学习方式了，所以就没有固定死一定要怎么学；
对了，在学习mv*框架的时候，一定不要因为别人说React难学所以选择Vue，那些说React难学的，基本都是原生JS学习的时候，偷懒没有跟着一步一步敲代码，导致原生JS半桶水；
扩展
nodejs这个不作要求，你原生JS学的稳，这个都是小事情；
在线视频
本文内容，我在Bilibili上有用专门的视频方式进行表达，
