本文已参与「新人创作礼」活动，一起开启掘金创作之路。
以找工作为目的的话，学习前端我把它分为三个阶段
兴趣启蒙+初步入门 基础打牢、巩固基础知识，对写过的代码有深一点的理解 能力进阶、了解一下新一点，高级一点的技术 下面是学习这个最小单元的4个部分
教程：w3cschool，不推荐视频教程（因为视频教程讲的太多了，很多东西对于入门做东西用不上）
推荐读物：不推荐 只看我这张图上提到的部分（图上的大纲都是按照w3cschool的教程写的），要看到什么程度呢？大致有印象，知道这个标签是干啥的就行了
带着这几个问题去看教程，保证看完之后这几个问题都有自己的理解
html是什么
html的基本结构长什么样子 标签是什么 属性是什么
2.学习css
教程：推荐w3cschool，不推荐视频教程 推荐读物：css权威指南（全部都学完了回过头来再看吧） 只学我这张思维导图提到的部分，学到什么程度呢？有个大致印象，能对下面那些问题做出自己的理解就好了
带着这几个问题去看w3cshcool的教程 css是什么 css的语法是怎么样的结构 怎么对一个标签增加简单的样式，自己尝试一下？ css盒模型是什么 display的值有哪几种，这几种值区别是什么 css怎么实现垂直水平居中？你能使用几种方式实现？ 页面的常见布局有那几种，分别可以怎么实现？
3.学习js
这大概是开始劝退的一个阶段了，因为开始复杂起来了呀，很多人都在这溜了
好吧，这个还是看你又没有编程基础，如果你学过Java这种东西，哪怕挂科了，只要脑子里有个概念，这里就比较好学
如果完全0基础，慢慢啃吧=0=，完全0基础还是看视频来的快
教程：w3cshcool的教程（适合有微弱编程基础的人，就是至少知道变量是啥，能看懂简单for循环的人）& 完全0基础的人，可以看视频了（我没看到啥合适的视频，慕课上的js入门视频可以看一看，主要还是按照下面的大纲来，和大纲无关的视频就可以跳过了） 推荐读物：高级程序设计（全部学完了回过头来再看吧） 只学这张思维导图提到的部分
带着这几个问题去学习
js有哪些基本类型，每种基本类型是干啥的
对象是什么，函数是什么，数组是什么
数组，函数，对象的常用方法有哪些
DOM是什么，我能用它做什么
jquery是什么？
4.学习框架
如果你要学框架的话，咱就从vue开始吧，为什么用vue？中文社区完善呀
学习vue之前，你得了解下前端的一个大杀器：node.js
先安装好node.js然后搞懂这几个事情
node和npm是什么，他们可以用来做什么 npm init命令有什么作用 node_modules和package.json有什么作用？ 好了，开始学vue吧
教程：
VUE教程
带着这几个问题去学习 使用vue-cli生成的项目，目录结构是怎么样的？其中的每个文件夹和每个文件的作用是什么？（vue-cli是有官方教程的，按照官方教程来生成项目！！！）
什么是双向绑定？
mvvm框架是什么意思？
实现一个todolist，网上demo很多，找一个一步步来就好了，关键是要理解mvvm框架的意义，为什么要使用mvvm框架 解决了这些问题之后，你需要实战，可以到github上边找合适想的项目进行拆解 实战要点： 先看懂项目中vuex和vue-router的用法（第一步不是看懂项目，而是看vuex和vue-router怎么用） 自己新搭建一个项目，配置好vuex和vue-router到能使用的地步 看懂项目 自己实现，实现的时候就不要看源码了，想不明白的地方可以回来看
