最新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优化
  • 搭建组件库与按需载入
  • 浏览器渲染与浏览器引擎
  • 深入理解后端开发模式

原文发布于微信公众号 - php(transfer_3092865418)

原文发表时间:2018-05-18

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏恰同学骚年

微信小程序开发初探

  (1)一切以用户价值为依归→用户是微信的核心,所以微信中没有很多与客户无关的功能,比如QQ中的乱七八糟一系列东西。

3533
来自专栏Python数据科学

给爬虫爱好者的福利 SelectGadget

相信爬虫的爱好者们都经历过这样一个爬虫前期的准备过程,那就是用浏览器的审查元素进行爬取目标的定位。每次我们都要浪费部分时间去寻找定位点和xpath,这样既不很方...

941
来自专栏Hongten

图片浏览器_js打造_源码开放

源码:http://files.cnblogs.com/hongten/source.zip

1642
来自专栏杨龙飞前端

react的一些思考

在做好第一个需求之后,我接到了一个react写的产品,这让我异常的兴奋,终于能写react了

853
来自专栏小特工作室

基于JQuery EasyUI的WebForm控件封装(含源码)

      做WebForm软件的朋友们,对于JQuery EasyUI类库肯定不会陌生,它是基于JQuery类库编写的,据说是国人开发的,真是神人啊.使用此控...

23910
来自专栏破晓之歌

使用pyinstaller将python脚本打包成exe文件

安装需要用到pip工具,该工具在3.5版本的python中已经自带不用另行安装,但是需要在系统变量中添加python下的Scripts文件夹,如下图: 

2481
来自专栏ytkah

微信小程序开发教程第七章:微信小程序编辑名片页面开发

编辑名片有两条路径,分为新增名片流程与修改名片流程。 用户手填新增名片流程: ? ? ? 首先跳转到我们的新增名片页面 1 需要传递用户的当前 userId,w...

3157
来自专栏华仔的技术笔记

React Native 初探

3676
来自专栏腾讯NEXT学位

【干货】解剖小程序的 setData

双线程的渲染机制、通信机制,setData 的出现、工作原理、使用建议等,应该要怎么去理解呢?

7482
来自专栏coding for love

我的前端技能树

客户端存储:Cookie,Web Stroge(Local&Session),离线缓存。

892

扫码关注云+社区

领取腾讯云代金券