最新HTML5学习路线整合

怎么学HTML5

HTML5是万维网的核心语言，标准通用标记语言下的一个应用超文本标记语言（HTML）的第五次重大修改，一方面提升了用户体验，另一方面HTML5技术跨平台，适配多终端，改变了传统开发者需针对不同操作系统进行研发的局面。

面对不同层次的人群，学习可分为以下几个大类。话不多说，直接上干货！

HTML5初级开发工程师

HTML基础

• HTML简介与历史版本
• 常用开发软件
• 常见标签与属性
• 表格与表单
• 标签规范与标签语义化
• 实战：网页结构布局

CSS基础

• css简介与基本语法
• 常见的各种样式属性
• CSS选择器与标签类型
• 理解盒子模型与CSS重置
• 浮动与定位
• 利用photoshop工具测量样式
• HTML+CSS开发网页
• 实战：高仿电商首页效果

CSS3基础

• css3常见样式
• css3选择器
• 变形与动画
• 3D效果与关键帧
• 弹性盒模型

移动端布局

• 移动端基本概念
• viewport窗口设置
• 移动端布局方案
• rem、vh、vw等单位
• 响应式布局
• bootstrap框架

JavaScript基础

• JS简介
• JS变量
• 数据类型与类型转换
• 运算符与优先级
• 流程控制-if..else
• 流程控制-switch…case
• 流程控制-while、do..while、for循环
• break、continue语法
• 函数定义与调用
• 全局变量与局部变量
• 函数传参与返回值
• 函数作用域与变量作用域
• DOM的基本操作
• 定时器使用
• this指向与修改指向
• 数组、字符串等方法操作
• 时间对象与正则对象
• 掌握常见BOM操作
• 常见事件与事件细节
• JSON与AJAX
• JSONP跨域操作
• 前端cookie的使用
• 实战：JS配合HTML与CSS完成电商项目 jquery框架
• jquery框架介绍及优势介绍
• jquery核心思想
• jquery常见方法
• jquery动画操作
• jqueryAJAX操作
• jquery工具方法
• 利用jquery快速开发网页 PHP基础
• PHP简介与基本语法
• mysql数据库及sql语法
• apache服务器与集成开发工具
• PHP链接数据库
• PHP与AJAX交互
• 实战：留言板、登录、注册等

HTML5中高级开发工程师

面向对象基础

• 面向对象概述
• 对象和构造函数（类）之间的关系
• 对象的属性和方法
• 原型与原型链
• 包装对象与内部实现
• 对象中实现继承方式
• 设计模式及实际运用

JavaScript高级

• JS算法与排序算法
• promise异步处理
• 运动与tween算法
• 闭包与模块化
• JS组件开发
• 打造小型jquery框架
• JS性能优化
• ES6新增功能

前端工程化

• gulp基本使用
• less、sass、babel等预编译框架
• 理解模块概念，AMD与CMD规范
• 前端模块框架seaJS、requireJS
• webpack基本使用

多人协作

• svn基本用法与可视化工具
• 多人开发流程
• git基本用法
• 命令行操作
• 分区及分支等概念
• 远程github操作
• 实战：多人协作开发项目

HTML5新功能

• canvas绘图
• svg绘图
• 音频与视频
• 本地存储与离线存储
• 地理信息
• web Worker
• web Socket

NodeJS基础

• node与npm概念及使用
• node模块方式
• node常用内置模块
• node爬虫与文件自动化处理
• node搭建服务器与简单路由
• mongodb非关系数据库
• mongodb安装与db操作
• mongodb增删改查
• mongodb与node结合开发
• mongoose数据建模
• mongoose与node结合开发
• express框架
• 中间件与ejs模板引擎
• Robomongo与postman工具
• express+mongoose搭建后端框架
• 设计Restful API
• 实战：前后端分离式开发

微信端开发

• 移动端交互与移动端事件
• 微信场景与swiper框架
• 微信公众号介绍
• 网页授权与JSSDK
• 微信web开发者工具使用
• 微信小程序开发
• 实战：公众号与小程序项目同步开发

HTML5大神级开发工程师

VueJS框架

• Vue框架简介
• 渐进式与响应式
• 模板语法与计算属性
• 指令与数据处理器
• 生命周期
• 组件与组件通信
• Vuex状态管理
• Vue动画与路由
• 单文件组件与脚手架
• 基于Vue的组件框架
• 实战：Vue与Node全栈开发

ReactJS框架

• React框架简介
• JSX语法
• 组件与组件通信
• 属性与状态设置
• 虚拟DOM
• 生命周期
• redux架构
• react-redux使用
• react-router使用
• Mem脚手架使用
• 实战：React与Node全栈开发

AngularJS框架

• Angular框架简介
• TypeScript基础与进阶
• 开发环境配置
• 架构、模块与组件
• 模板、元数据与数据显示
• 服务于指令
• 依赖注入
• 路由
• 实战：Angular与Node全栈开发

Hybrid App开发

• App介绍与分类
• Android/ios与H5通信
• Cordova/Phonegap框架
• HTML5+基于HB工具
• React Native

前端架构

• 单元测试与编写测试用例
• 自动化测试方案
• 前端安全与HTTP协议
• 项目上线与一键部署
• 数据统计与SEO优化
• 搭建组件库与按需载入
• 浏览器渲染与浏览器引擎
• 深入理解后端开发模式