小白前端学习路线一览_前端小白背

以下是个人的一点总结，有不对或者补充的地方，欢迎大佬们提出建议。
学习前准备
编辑器：推荐vscode，插件丰富，简单易用

1. 基础部分

①计算机常用命令
②Html:

标签不用背，用的多了自然熟悉，随用随查
注意：语义化标签，多媒体、常用api，网络状态、本地缓存等

③css：

常用布局，flex、grid、样式优先级问题、盒子模型、动画知道怎么使用就行，大把的动画网站等着你，学习一下less、sass或者stylus
预处理器，有时间还可以看下后处理器postcss
canvas如果感兴趣可以深入一下，作为可视化的入门

④bootstrap响应式框架

这时可以配合bootstrap做一个PC端响应式小demo，更加理解响应式和自适应和区别

html+css良心教程 适合新手入门
https://www.bilibili.com/video/BV1XJ411X7Ud

rem适配移动端开发
https://www.bilibili.com/video/BV1dK411n7an

期间需要掌握的其他技能：控制台debug调试，chorme 调试，最好学一点seo优化、session/cookie

2、重点学习 ！！！

• ①javascript 弱类型语言能有什么坏心思呢

先了解一点基础的数据结构：数组，集合堆栈队列链表哈希等，一开始不用太深入，但是需要知道
链接：https://www.bilibili.com/video/BV1nJ411V7bd?p=6
主要：基础语法，面向对象（必须要学通，一遍不行多来几遍）、原型闭包深浅拷贝、dom等，这方面基础一定要打好，再好的框架都只是工具。
链接：https://www.bilibili.com/video/BV1p4411u7TT

• ②JQuery 还是有必要了解一下

• ③es6模块化 +TS

vue3.0的到来彻底说明了，TS的进化之路已然开始

• ④mock数据 必不可少

期间需要学习的其他知识：HTTP协议，前端人必备。ajax、axios、
restful接口等、浏览器的兼容（指ie）、版本控制（git/svn）

• ⑤nodejs基础
• ⑥打包构建工具：webpack、glup、babel

在学习js过程中，尽量养成项目工程化，代码模块化的一种思维，为以后的代码维护打好基础，尝试再github或者别的开源站上搜一下小项目作为练手。不求多，保证每个做过的项目不懂得地方要弄懂解决，解决过的不要再犯类似的错误或者记住怎样解决的，这都是财富

3、框架

了解SSR SPA 。 mvvm、mvc模式
	三大框架vue、react、Angular  基本都是要会的
	优先学习vue全家桶,适合入门 、 其次是react
	期间要掌握：框架相关的主题库，单元测试、主流的ui库（省事）
1
2
3
4

4、小程序和可视化

	小程序，跨平台uniapp、fullter、react native等
1

可视化、小游戏有兴趣可以深入了解一下，可以作为职业定位来发展

5、进阶

		不是一门多么庞大的技术体系，但有时候必不可少，是提升技术的方向
		代码质检工具：eslint、stylelint等
		性能优化‘、源码的阅读、nginx、Nuxt
1
2
3

服务器相关
关系型数据库Mysql

node 作为向全栈发展是前端很好的入门语言
深入node， express、koa2框架、nestJs
权限管理和认证

总结：
h5+c3不需要耗费太多时间，重点在js ，js基础打得好，框架不会太头疼，新的技术不断发展，只有基础打的实，以不变应万变。