前端技术学习路线及技术汇总

Posted 2021-02-15 xiao-cao

下面是简单整理的一些前端的学习路线：
第一阶段：

html+CSS：HTML主要就是网页编辑。包括HTML进阶、CSS进阶、div+css布局、HTML+css整站开发。
javascript 语言：JavaScript是web前端中最重要的知识，包括Js基础教程、js内置对象常用方法、常见DOM树操作大全、ECMAscript、DOM、BOM、定时器和焦点图。
JS基本特效：常见特效，如tab、导航、整页滚动、轮播图、JS制作幻灯片、弹出层、手风琴菜单、瀑布流布局、滚动事件、滚差视图。
JS高级特征：正则表达式、排序算法、递归算法、闭包、函数节流、作用域链、基于距离运动框架、面向对象基础。
jQuery：包括学习悬着器、DOM操作、特效和动画、方法链、拖拽、变形、JQueryUI组件基本使用。
第二阶段：掌握一些HTML5和CSS3知识。

HTML5：HTML5新语义标签、HTML5表单、音频和视频、离线和本地存储、SVG、Web Socket、Canvas。
CSS3：学习通过 css 开发网页和各种可视 UI 组件。CSS3新选择器、伪元素、脸色表示法、边框、阴影、background系列属性改变、Transition、动画、景深和深透、3D效果制作、Velocity.js框架、元素进场、出场策略、炫酷CSS3网页制作。
**Bootstrap框架：**响应式概念、媒体查询、响应式网站制作、删格系统、删格系统原理、Bootstrap常用模板、LESS和SASS
第三阶段：HTTP服务和AJAX编程

WEB服务器基础：服务器基础知识、Apache服务器和其他WEB服务器介绍、Apache服务器搭建、HTTP介绍。
php基础：PHP基础语法、使用PHP处理简单的GET或者POST请求。
AJAX：Ajax简介和异步的概念、Ajax框架的封装、XMLHttpRequest对象详细介绍方法、兼容性处理方法、Ajax框架的封装、Ajax中缓存问题、XML介绍和使用。JSON和JSON解析、数据绑定和模板技术、JSONP、跨域技术、图片预读取和lazy-load技术、JQuery框架中的AjaxAPI、使用Ajax实现爆布流案例额。
第四阶段：面向对象

面向对象终极篇：从内存角度到理解JS面向对象、基本类型、复杂类型、原型链、ES6中的面向对象、属性读写权限、设置器、访问器。
面向对象三大特征：继承性、多态性、封装性、接口。
设计模式：面向对象编程思维、单例模式、工厂模式、策略模式、观察者模式、模板方法模式、代理模式、装饰者模式、适配器模式、面向切面编程。
第五阶段：

Node.js：掌握Node.js 核心 API ，具备后端开发能力。
Express 5.x 框架：掌握 Express 框架，从而具备快速开发后端程序的能力。
socket.io 库：让前后端通过 websocket协议通信，是web 开发游戏、聊天等程序必备技术。
Mongoose 框架：可以让程序具备文档数据储存能力。
Git 命令与 github：可以对项目进行版本管理，从而能团队开发项目。
Gulp 构建工具实战：通过 gulp 工具，灵活对项目进行构建。
Webpack：可以用和 Node.js 后端模块化方式，开发前端程序，从而能开发大型系统。

下面是一些前端技术体系汇总：

HTML HTML5 CSS CSS3 JavaScript
jQuery jQuery UI jQuery EasyUI ExtJS
ECharts Tree.js Video.js
JSP ASP.NET PHP Python
mysql SQL Server Oracle MongoDB
XML JSON AJAX
Bootstrap Layui Foundation
jQuery Mobile MUI WeUI Reactive Native
Node.js Gulp Webpack AngularJS Vue
基础 脚本 类库 服务器 数据 响应式 移动端 框架