前端学习路线整理，如何点亮前端技术栈

---

写在开始

  算是入行一小段时间了，因为是从硬件开发转专业（模电和FPGA心理阴影无限大），一切都从头开始，学习各项技术都是项目驱动，为了赶工常常是面向百度Google开发，甚至有些难点功能直接复用别人的代码段，一知半解地排排bug跑通代码完成任务，渐渐感觉知识掌握浮于浅层，技术学习不深入不系统不连贯。
  之前习惯用Win10的OneNote作为备忘录来记录一些有价值的文章、待解决的疑问、bug的处理、常用算法代码块的积累等等，笔记内容比较杂乱。
  我一直认为编程最伟大的精神就是开源、分享与协作，因此希望接下来能通过技术博客的方式，整合一些之前的备忘笔记和学习资源，结合项目实战，从最基础的地方开始，解释清楚那些看似复杂高大上的一个个英文单词到底是什么、为什么、怎么用，对前端技术重新进行一个系统的梳理和学习，监督自己有效提升，也希望尽量能为后来者提供一些帮助，如果有缘看到我的博客能让你有些收获，我倍感荣幸。

关于Markdown

  Markdown是非常好用的轻量级文本编写语言，文件后缀为.md，对html有很好的兼容性，传统文档编写中需要鼠标选中、点击的样式效果都能通过简单的符号和html代码完成。
  在Web项目中，常常需要在网页里展示说明或帮助文档，会有很多代码片段、数据字段表格、数学公式的展示需求，而Web页面不可能直接展示word工具排版编辑好的文档，与其用word写好后再翻译成html，直接使用Markdown是更好的选择。
  CSDN写博客的页面自带Markdown教程和帮助文档，编辑页和预览页双屏同步，非常友好，即使不会html也能直接上手，用代码写博客也算是程序员的自我修养。
  由于Markdown是国外开发，英文中没有首行缩进，所以博客里的所有首行缩进都用两个全角空格 代替。

关于学习方法和学习资源

  w3cschool是一个很好的技术文档/视频综合学习网站，runoob是一个很好的技术文档网站，入门学习需要的大部分资源基本都能找到。
  时下IT技术非常火爆，各种资源教程网络上一搜一大把，只要你愿意用心去学，基本上没有找不到的资源，所以个人已经比较熟悉的东西就不再费力去检索整理学习资源了，如有纯小白想从零开始，可以直接到上面两个网站去检索相关资源。
  技术是为了实践服务，所以亲自动手码代码、排bug、完成小项目或小作品，是学习过程中最重要的环节。编程语言很多，现有的框架也很多，一个完整的项目开发会涉及到UI设计、前端、后端、数据库全栈配合，细分下来有太多技术，所以除了最核心最基础的技术之外，不建议通过视频学习来点亮技术栈，比较浪费时间，看官方手册、读文字教程、动手跑实例、把API都自己调用一遍，完成一个自己的小项目，是最快的学习方法。如果要更深入的学习，就从计算机组成原理、网络协议/标准开始，了解最底层的原理，再阅读开源框架的源码，相信对技术的理解会有质的飞跃。

前端技术栈学习路线

  参考文章大前端技术栈入门串讲，结合实际业务需求和个人兴趣取向，整理了一下需要系统学习的技术路线和相关学习资源。

一、工具类

代码编辑器Visual Studio Code

  代码编辑器是程序员最重要的伙伴，是每天打开电脑第一个点开的东西，编辑器平台有很多，刚开始的时候使用过sublime和Hbuilder，但是现在就不说了，虽然有很多插件我也还没用明白，但是VScode，永远滴神。
  点击官网，无脑安装。

代码管理工具SVN / Git、GitHub

  大型项目必须要协作开发，代码开发的团队合作中最重要的就是各个开发人员的代码统一管理和版本控制。现在我工作中的项目开发基本都是用SVN来进行代码管理，而GitHub是目前全球最大的公网代码管理仓库，里面储存着全世界程序员的优秀开源项目，开源协作的精神体现得淋漓尽致，学会使用GitHub是程序员最基本的素质（ps.网站是全英文的，