给想学前端的小白整理了一下学习路线

本文主要是介绍给想学前端的小白整理了一下学习路线，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

第一阶段：前端入门

  1.Html5

  2.Css3

第二阶段：JavaScript

  ①JavaScript 基础语法

  ②JavaScript 高级（WebAPI/Dom Bom）

  ③JavaScript 框架（jQuery）

  ④数据可视化（echarts）

第三阶段 服务端编程

1.node js基础

2.ajax

3.promise

4.axios

5.了解学习es6语法，http协议规则

6. TypeScript

第四阶段 Vue.js

①框架：Vue.Js【vue2，vue3】

②学会使用UI组件库（网站快速成型工具）

③vue项目实战

第五阶段 微信小程序

第六阶段 React.js 基础

第一阶段：前端入门

CSS & HTML

对于刚入门的朋友我依旧建议先将 CSS(3) & HTML(5) 的知识点认真学习一边。学习的途中最好是学习完一部分就自己在敲一遍代码，加深自己的记忆。

当然如果你愿意，建议你可以先仿一个网站的静态页面（掘金、知乎等都可以），有一些属性就可以了解他实际的实现场景。

当然刚开始敲代码的时候还是不要过分依赖自动补全功能，一开始就使用自动补全对你记忆一些属性时没有帮助的；踏实点学习，日后会有回报的。

关于 CSS(3) 你需要了解的一些知识点

• 盒模型（标准 & IE ）
• flex、float、Normal Flow 等的理解
• CSS 常用选择器
• 行内、内部、外部样式的区别
• CSS 层叠规则
• BFC 与 IFC 的了解
• CSS3 的 transform、transition、animation 等属性的运用了解
• 响应式布局的理解
• ……

CSS 说容易也容易，说复杂也复杂；因为 CSS 总是能给你意外的惊喜。

HTML(5) 你需要了解的一些知识点

说到 HTML 我想有很多人是 div 一把梭。因为 div 用的爽，不用担心默认样式。

有人说 HTML 语义化的优点很多，比如清晰的页面结构、有利于 SEO、便于团队开发和维护；这些我都承认，不过我还是喜欢 div 一把梭。

• HTML 语义化( 不是很理解为什么面试总会问 )
• canvas
• 本地存储（ localStorage、sessionStorage、cookie 的理解 ）
• video 和 audio 的使用
• 应用缓存( cache manifest )
• ……

第二阶段：JavaScript

JavaScript 基础语法

1、JS中的变量

1.1、变量的创建

1.2、动态类型

2、基本数据类型

2.1、 number数字类型

2.2、string字符串类型

2.3、boolean布尔类型

2.4、undefined未定义数据类型

2.5、null空值类型

3、运算符

3.1、比较运算符

3.2、逻辑运算符

4、条件语句和循环语句

5、数组

5.1创建数组

5.2获取数组元素

5.3新增数组元素

5.4删除数组元素

6、函数

6.1 语法格式

6.2函数表达式

6.3作用域

7、对象

7.1创建对象

 JavaScript 高级（WebAPI/Dom Bom）

1. Web API介绍

2.API的概念API的概念

API（Application Programming Interface,应用程序编程接口）是一些预先定义的函数，目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力，而又无需访问源码，或理解内部工作机制的细节。

任何开发语言都有自己的API

API的特征输入和输出(I/O)

API的使用方法(console.log())

1. Web API的概念

浏览器提供的一套操作浏览器功能和页面元素的API(BOM和DOM)此处的Web API特指浏览器提供的API(一组方法)，Web API在后面的课程中有其它含义

4.掌握常见的浏览器提供的API的调用方式

5.ECMAScript - JavaScript的核心定义了javascript的语法规范

JavaScript的核心，描述了语言的基本语法和数据类型，ECMAScript是一套标准，定义了一种语言的标准与具体实现无关

1. BOM - 浏览器对象模型

一套操作浏览器功能的API

通过BOM可以操作浏览器窗口，比如：弹出框、控制浏览器跳转、获取分辨率等

1. DOM - 文档对象模型

一套操作页面元素的API

DOM可以把HTML看做是文档树，通过DOM提供的API可以对树上的节点进行操作

1. BOM的概念

一套操作页面元素的API

DOM可以把HTML看做是文档树，通过DOM提供的API可以对树上的节点进行操作

1. BOM的顶级对象window

window是浏览器的顶级对象，当调用window下的属性和方法时，可以省略window

注意：window下一个特殊的属性 window.name

10.页面加载事件

11.定时器

12.location对象

location对象是window对象下的一个属性，时候的时候可以省略window对象

这篇关于给想学前端的小白整理了一下学习路线的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---