刚刚看到了一个up主分享的零基础前端路线，感觉深有体会且受到了启发，准备根据这个路线查漏补缺，记录分享一下～
一、HTML
div、label、span、b、p、ul、ol、li、dl、dt、dd、i、em、h1、h2、h3、input，掌握这些基本的标签。
二、CSS
1.语法：
1、. 操作符 ，使用class引用
2、#操作符，使用id引用
2.基本概念：
1、层叠式是什么意思？
2、CSS盒模型
3、CSS定位
4、CSS文档流的概念
5、CSS的四种定位
6、CSS优先级
3.实例：
各种购物网站（京东，淘宝）的静态页面（做一到两个即可）
三、JS
1.语法：
1、var创建变量
2、function，函数的基本使用
3、fun（xx），函数的调用和传参
4、this是什么
5、for循环
6、[ ]，{ }，数组和对象
7、for in 循环，键值对操作
8、document是什么
9、操作dom：creatElement，appendChild，innerHTML，setAttribute(n,m)
2.事件
onclick
3.实例：
1、轮播图
2、静态留言板
3、带了菜单的横向导航条，二维数组
这一阶段不用做太多原生JS的实例，目的是写熟练，不要出现拼写错误，理解基本开发的业务逻辑和需求分析。
四、Node.JS
1.nodeJs是什么？安装node成功
2.npm、node命令的基本使用
3.安装：vue-cli，保证成功并运行
至于其它的，事件、回调、buffer、stream、模块、路由、file、get/post、Express等等，先放一边。这一阶段要解决的，就是保证成功安装 VueJs。
五、Vue.JS
1.vue-cli，安装成功、并运行成功
2.vue模板语法，
{ {msg}} ，之类的
3.vue常用指令：v-html，v-show，v-if，v-blind（：），v-onclick（@click），v-model，v-for
4.vue组件
5.vue路由
实例：
1、轮播图
2、静态留言板
3、带了菜单的横向导航条，二维数组
把之前用原生Js写过的例子，再用vue写一遍。因为之前写过，所以业务逻辑都是一样的。
目的是为了掌握与熟练使用vue，实现开发需求、并理清vue实现业务逻辑的思路
六、深入Node.JS
1.get、post请求
2.express 或 koa2，响应get请求
3.axios异步
4.目的是写自己的接口可以自己测试，响应get、post请求，变身为全栈开发
自学到这一步，相应的知识点、结构就已经有了。接下来要向纵深发展。
七、ES6
只做一件事，把上面的实例、demo，都有es6重新实现一遍。
目的是掌握es6的使用。
八、相关理论（进阶）
1.单例、工厂、观察者、OO等设计模式
2.http、tcp/ip协议
3.原型链、构造器、继承
4.模块化、公共、私有方法
5.数据结构、常用算法
6.浏览器渲染原理与机制
7. JavaScript性能与优化，移动端适配方案
8.html5、css3、前端工程化相关知识