2020年前端学习路线

1、前端基础核心知识

1.1 HTML

 W3C HTML文档

1.2 CSS&CSS3

 W3C CSS 文档

 W3C CSS3 文档

 Flex 布局教程：语法篇

 Flex 布局教程：实例篇

 各种鼠标效果样式

 深入理解CSS新特性

1.3 移动端布局

 移动端基本概念

 viewport窗口设置

 移动端布局方案

 rem、vh、vw等单位

 响应式布局

 黑马HTML5+CSS3+移动端布局全套教程：https://www.bilibili.com/video/BV14J4114768

1.4 JavaScript

 阮一峰JS教程

 封装技能1：JS常用的实例的实现与封装

 封闭技能2：JS其他实例的实现与封装

 JS面试题1

 JS面试题大全pdf     提取码：1111

 尚硅谷JS教程：https://www.bilibili.com/video/BV1YW411T7GX

 黑马JS教程：https://www.bilibili.com/video/BV1k4411w7sV

2.1 HTML5(语义化标签、Canvas、本地存储、音视频等)

 W3C HTML5 文档

 HTML5 实现文件上传下载

 HTML5 实现拖放排序

 HTML5 Canvas进阶

 尚硅谷HTML5基础教程：https://www.bilibili.com/video/BV1YW411T7Lj

 尚硅谷HTML5实战教程：https://www.bilibili.com/video/BV1YW411T7p3

2、前端高级核心知识

2.3 前端UI框架--BootStrap

 BootStrap官方学习文档

 W3C BootStrap 文档

 BootStrap其他文档

 尚硅谷BootStrap教程：https://www.bilibili.com/video/BV1YW411T7yy

2.4 快速简洁图表可可视化库--Echarts

 Echarts官方学习文档

 Echarts在线实例（含源代码）

 W3C Echarts 文档

 黑马Echarts视频学习：https://www.bilibili.com/video/BV1v7411R7mp

2.6 JS函数库--JQuery

 JQuery API中文文档

 W3C JQuery 文档

 JQuery源码分析

 JQuery的100个小技巧使用

 JQuery常见的坑

 JQuery插件开发总结

 尚硅谷JQuery教程：https://www.bilibili.com/video/BV14W411u7aA

 黑马JQuery教程：https://www.bilibili.com/video/BV1pt411H7D6

2.7 移动端类JQuery库--Zepto

 Zepto官方学习文档

 Zepto源码解析

 尚硅谷Zepto教程：https://www.bilibili.com/video/BV18s411E7b4

3、后台技术

3.1 服务器端脚本--Node.js

3.2 后台Web开发框架--Express

 Node.js中文官方文档

 黑马Node+Express+MongoDB+Mongoose教程：https://www.bilibili.com/video/BV1Ns411N7HU

3.3 NoSql--MongoDB

 MongoDB中文官方文档

 MongoDB菜鸟教程文档

 尚硅谷Mongodb教程：https://www.bilibili.com/video/BV1NW411T7vT

3.4 MongoDB操作库--Mongoose

 Mongoose中文文档

3.5 后台Web开发框架--koa

 koa官方学习文档

3.6 后台模板引擎--EJS

 EJS官方学习文档

3.7 实时通信聊天库--socket.io

 W3C socket.io 文档

 socket.io官方文档中文版

3.8 数据加密技术--MD5、jsonwebtoken

 阮一峰jsonwebtoken入门教程

3.9 通信协议--Http

 HTTP概述

 HTTP缓存

 HTTP Cookie工作原理

 HTTP 访问控制(CORS)

 HTTP 消息(HTTP请求、响应、HTTP/2帧等)

 HTTP 的会话流程

 HTTP 消息头

 HTTP请求方法(GET、POST、PUT、HEAD等)

 HTTP 状态返回码

4、前台交互技术

4.1 Ajax

 W3C Ajax 文档

4.3 Promise

 八段代码彻底掌握Promise

 MDN Promise学习文档

 视频学习地址：https://www.bilibili.com/video/BV1MJ41197Eu

4.2 ajax请求库--Axios

 视频学习地址：https://www.bilibili.com/video/BV1NJ41197u6

5、JavaScript高级

 JS作用域与作用域链

 JS原型与原型链

 JS闭包

 JS异步与事件循环机制

 尚硅谷JS高级篇教程：https://www.bilibili.com/video/BV14s411E7qf

5.1 ES6新特性

 阮一峰ES6教程

 30分钟掌握ES6核心知识总结

 尚硅谷ES6教程：https://www.bilibili.com/video/BV18s411E7Nd

5.2 自动化构建工具--Glup

5.3 预编译框架--Less & Sass

5.4 模块化规范--Commons.js、ES6、AMD、CMD

 尚硅谷模块化教程：https://www.bilibili.com/video/BV18s411E7Tj

5.5 前端模块框架--seaJS、requireJS

5.6 自动化构建工具--Webpack

 尚硅谷Webpack教程：https://www.bilibili.com/video/BV18s411E7nA

5.7 TypeScript

 阮一峰TypeScript入门教程

6、前端流行框架

6.1 国内MVVM库-- Vue

6.2 Vue路由库-- Vue-Router

6.3 Vue PC端UI组件库-- Element-UI

6.4 Vue 移动端UI组件库-- Mint-UI

6.5 谷歌MVVM库-- Angular

6.6 组件化库-- React

6.7 React路由插件库-- React-Router

6.8 React应用状态管理库-- Redux

6.9 React PC端UI组件库-- Ant Design

6.10 React 移动端UI组件库-- Antd-Mobile

7、跨平台开发

7.1 微信小程序开发

7.2 微信小程序框架-- mpvue

7.3 微信公众号开发

7.4 跨平台移动应用开发框架-- React Native

7.5 国内跨平台开发框架-- MUI

8、项目实战