|
预备阶段 ：软件工程基础
|
基础开发工具入门
软件开发主流工具掌握；编程语言入门，Java程序设计：变量、数据类型、运算符与表达式、分支与循环、数组；养成良好的软件编程习惯，强化
软件开发基本功
开发语言基础的巩固、内存管理 加强和巩固开发工具，掌握在Eclipse下开发/调试程序
OOP面向对象：
面向对象基本概念；面向对象特性：封装（描述）、继承、多态；面向对象高级特性：内部类、抽象类、接口；异常处理；
API介绍 常用API,集合API，并了解Java的高级特性，熟悉各种基本数据类型包装类：String和StringBuffer等常用API
数据库和SQL：
掌握数据库原理和SQL语句，链接数据库的应用
IO概念、多线程、泛型：
熟悉文件操作、字节流的操作和常见文件相关类,分析IO性能，熟练使用常用包装类IO；多线程；泛型与元数据（注解）；
设计模式理解：
熟悉常用设计模式：Singleton、Template、Strategy、Adapter模式。为搭建结构良好的Android应用程序奠定基础。
|
|
第一阶段 HTML5+CSS3 前端静态开发
|
HTML5基础
HTML5是什么、构成HTML5的元素、网站开发流程详解、WEB前端开发课程及目标、文本、图像、链接、表格、列表、表单、框架等标签详解
CSS3基础
Css3是什么、Css引入方式、css选择器基础(通用选择器、元素选择器、id和class选择器、后代选择器、伪类选择器等)、框模型与背景、文本格式化、表格、显示css样式的基础使用
HTML5/CSS3新特性
文档头和编码声明
语义化标签，HTML5标签的兼容处理，HTML5标签SEO
新的元素选择器，HTML5中的选择器
本地存储，安全性、容量、和cookie区别
HTML5表单新特性，新的input类型，placeholder的使用和兼容，表单自动校验
FileReader和文件拖拽
geoLocation
canvas，功能和操作，图表、游戏和动画
WebGL，全3D网页浏览
video、audio
离线应用，Manifest文件编写
桌面提醒
webSocket，优点，和Ajax的区别
webWorker，用途和优点
webSql
CSS3新特性，文本溢出，分栏模式，背景，圆角，阴影，渐变，transform，CSS3动画，rgba等
HTML5的应用范围
CSS3基础
css3与css2的区别，CSS3的兼容性，浏览器前缀，不需要前缀的样式
实例：CSS3旋转
JS设置CSS3样式，setStyle3()的封装，IE前缀的问题
实例：CSS3运动框架基础
transition基本使用，transition的参数，不同运动形式的区别
transition运用范围，transition和JS平滑结合，transition的问题
实例：纯CSS3滑动二级菜单
实例：淡入淡出幻灯片
border-radius的使用，圆角的单位，圆角大小的测量（PS中），圆角的各种参数
实例：圆角图片框
rgba的使用，rgba和opacity的区别，rgba的应用，rgba和渐变
实例：半透明遮罩文字的新写法
text-shadow的用法，各种参数，配合rgba的另类用途
实例：文字模糊效果
box-shadow的用法，内投影和外投影，扩展阴影
实例：CSS3按钮
实例：CSS3模拟PS的外发光效果
实例：文本框模糊效果
线性渐变的使用，简便形式，渐变方向的控制，多点渐变和rgba的结合
实例：CSS3进度条的绘制
圆形渐变的使用，中心点位置，形状和大小
实例：CSS3彩虹圈
CSS3变形和应用
transform的作用，旋转、缩放、位移、倾斜的使用，transform与内联元素
实例：各种变形的使用和组合
rotate的使用，deg，origin的使用，origin的各种写法，角度的换算
实例：CSS3时钟
scale的使用，等比缩放和拉伸，翻转和变形，scale和改变宽高的区别，CSS3属性和盒模型尺寸，scale的其他写法
实例：CSS3图片放大
实例：官网登录框淡入淡出
skew的使用，PS中的倾斜，倾斜模拟旋转
translate的使用，translate和left、top的区别
实例：CSS3倾斜导航条
多transform组合使用，顺序的问题
CSS3 3D变换，3D旋转，perspective的使用
实例：3D旋转和2D旋转的比较
实例：safari历史记录效果（官网作品展示）
3D变换的坐标系，旋转方向的分辨，perspective的两种用法
backface-visibility的使用和问题
实例：记忆力大考验游戏
实例：官网登录、注册框
backface-visibility的bug，translate另类解决方法
transform-style的使用，3D空间的继承
实例：翻书效果
实例：鼠标、键盘控制的3D盒子
实例：图片拆分、翻转
实例：3D图片环
CSS3动画
纯CSS动画animate，关键帧，格式和编写
animate的调用，时间单位和重用
animate的可选属性，运动类型、延迟、重复、重置
animate和JS的配合
实例：旋转的风车
animate和transition的比较
动画结束的检测，Mozilla的问题和解决
自定义链式动画库
JS运动和CSS3动画
实例：3D幻灯片
圆角的精确控制
CSS3多背景和背景尺寸控制
渐变高级应用，控制点、重复背景、渐变与背景结合
实例：CSS3+JS实现的图片倒影
实例：光线划过效果
本地存储
本地存储和cookie的区别，localStorage和sessionStorage的区别
localStorage的支持情况，兼容性检测
添加、删除数据，删除数据
localStorage使用的注意事项
实例：基于localStorage的待办事项
localStorage的方法和属性，setItem、getItem
清空localStorage，遍历localStorage的方法
实例：基于localStorage的记事本
localStorage的事件，onstorage的兼容性写法，事件对象的各种属性：key、oldValue、newValue、url/uri
Json对象的方法，stringify、parse，parse和eval的区别
调试工具的使用
窗口间通信
实例：所有页面保持同步的列表
实例：同步拖拽
地理信息
geolocation的用法，地理信息的定位精度，测试geolocation的方法
兼容性和兼容检测，getCurrentPosition()的使用
返回结果的作用：accuracy、latitude和longitude、altitude和altitudeAccuracy 、heading和speed
实例：配合百度地图显示当前位置
获取失败的处理，message、code，授权和常见错误
可选参数，高精度模式，超时处理
监听地理位置变化
HTML5特性、表单
contenteditable的作用
实例：基于ajax的简易excel
自定义数据的使用，兼容性，自定义数据配合JS，优点、缺点
HTML5表单特性，placeholder的使用，autocomplete和autofocus
新的input类型，控制手机输入法
实例：JS处理placeholder兼容问题
HTML5表单验证，required属性的使用，pattern属性的使用
实例：纯HTML5表单验证
|
|
第二阶段 JS开发实战
|
JS入门：事件、原理、属性、样式、函数、if判断
JS入门：style和行间样式、函数传参、属性操作两种方式
字符串和变量、字面量和变量
提取行间事件、onload、byTagName、数组
循环、全选、选项卡、innerHTML、字符串连接
调试工具的使用、如何调试JS
变量类型、typeof、JS常见类型
类型转换、parseInt、NaN、隐式转换
作用域、闭包、命名规范、运算符、流程控制
变量遮蔽
JS中的随机数、随机颜色、随机范围、随机不重复
函数返回值
深入理解函数返回值
定时器：interval、timeout、时钟、QQ资料框、自动播放选项卡、京东商城侧边栏
arguments、字符串操作、数组操作、Json
循环外i的问题、函数定义和调用的区别、不变的变量
DOM操作基础：创建、添加、删除
BOM基础：窗口操作、UA、location
BOM应用：滚动、scrollTop、offset、clientHeight、浏览器类型检测
事件对象：冒泡、clientX、keyCode、ctrl/alt/shift、默认行为、拖拽
QQ邮箱闪烁提示、回放路径的拖拽
树形菜单、多级右键菜单
|
|
第三阶段 JS高级+项目实战
|
批量设置样式：json、cssText、with
location、hash、query的处理，刷新保存页码
Date对象应用：setFullYear/Month等，时间戳、倒计时
Date高级应用
闭包的应用、封闭命名空间
ajax无刷新数据加载：创建、发送、接收、字符集和缓存
DOM应用：firstChild/lastChild、nextSibling/previousSibling
操作属性的第三种方式、自定义属性的获取、src的相对路径
offsetParent、计算元素的页面绝对位置
图片延迟加载——迅雷
简易瀑布流——花瓣
横向瀑布流——百度
DOM与innerHTML、innerHTML的bug
天猫、淘宝吸顶导航条
天猫、京东placeholder输入框
永远在页面中的右键菜单、提示图片
图片预加载、Image对象的使用
Image对象批量加载
运动基础、匀速运动、运动框架、侧边栏、淡入淡出
缓冲运动、页面提示框
多物体运动框架、万能运动框架、链式运动框架、完美运动框架
布局转换、淘宝幻灯片
运动应用：划动提示层、百度百科数字框、新浪滚动微博
永远在页面中放大的图片
无缝滚动
手风琴幻灯片、淘宝网无缝滚动幻灯片
this的用法、完美拖拽
完美封装可重用代码
完美拖拽、吸附拖拽、带框拖拽
程序思想——如何找思路，如何找规律，如何思考
碰撞检测、模拟窗口拖拽大小
窗口拖拽大小的封装和重用
自定义滚动条、鼠标滚轮
事件绑定、DOM事件流
cookie基础
ajax高级应用：用户注册和登录、表单提交
后台接口的使用、接口文档
编写AJax的基本步骤
Jsonp跨域的方法——百度下拉提示
script标签的怪异特性、callback的使用
Jsonp标签的管理
封装可重用的Jsonp方法
ajax制作简易新浪微博：后台、接口、分页、顶、页码
其他常见数据格式及用法：CSV、XML
JS中的预解析机制、script出错时的处理机制
预解析相关面试题
递归及其各种应用
递归相关面试题
递归的性能问题、递归的优化
栈溢出的原因和处理
引用、复制
JS中的异常：try...catch的使用
try的嵌套和性能问题
抛出异常、Exception对象、异常和返回值的区别及用途
JS变量生存周期、垃圾回收机制
闭包与JS垃圾回收
闭包的用法、保存i的值
JS性能优化——健壮性、维护性、性能的平衡
性能瓶颈的识别——性能检测工具的使用：Chrome profiles、YSlow等
JS阻塞加载、图片延迟加载、网络性能优化、压缩、CDN的使用
JS执行性能优化：DOM操作、循环、数组优化、局部变量、eval、parseInt、系统函数、字符串连接、正则等
实例：颜色选择器组件
实例：输入字数统计
正则表达式：RegExp对象、search方法、忽略大小写
match方法和全局匹配、量词的问题、replace方法
字符类、转义字符、行首行为、中文、单词边界、括号
正则应用：可重用的表单校验
自动表单校验、批量表单校验
表格操作：tBodies、tHead、tFoot、rows、cells
表格搜索、排序
自定义表单组件
DOM文本节点：创建、兼容、应用
firstChild怪异问题、childNodes的问题
实例：google日历
domReady事件：优点、DOMContentLoaded、defer、onload
事件队列、封装ready事件函数
事件委托（事件代理）：冒泡的使用、srcElement属性、target属性、this的检测
call的使用——解决this指向问题
mouseleave事件——作用、封装，彻底解决mouseout冒泡的问题
运动高级：弹性运动、碰撞运动
弹性应用：滑动导航
|
|
第三阶段（选修） JS面向对象
|
面向对象回顾：
什么是面向对象、对象的组成、OOP的特点、this的本质、Object对象
工厂方式构造对象、原型（prototype）、混合法构造JS对象、实例：面向对象的选项卡
JS算法基础：时间复杂度和空间复杂度
数据结构基础：线性和随机、线性表、O表示法、数据结构基本操作
线性表和排序：4大排序算法、适用范围、蜕变和劣化、移动操作开销
树和排序：树的查找、添加和平衡
散列：空间换取时间、空间利用率和算法效率
图：路径算法、预处理和随机处理
模块的规划、接口
模块的加载、依赖、循环依赖
模块作用域和export
script加载和同步、请求合并、压缩代码
模块的重用和冲突
MVC基础：3层模型和耦合度
耦合的问题和消除
数据独立性、独立数据模型
设计模式：优点、常见模式
自定义事件、事件队列管理、事件的传递、事件对象和参数、监听模式的问题
数据队列的管理、反向监听和解耦合、模块独立性
|
|
第四阶段 JQuery
|
JQuery基础：$、选择器、获取元素、添加事件
JQuery的选择器：层级、属性、伪类等
样式和属性操作：css、attr方法、JQuery的链式操作和可选参数
鼠标事件：click、hover、toggle
JQuery特效：slideDown/slideUp、fadeIn/fadeOut
JQuery动画：animate、stop、速度控制、二级菜单
mouseleave和mouseenter事件的使用
实例：JQuery选项卡
JQuery的DOM操作：创建、添加、插入、包裹、删除
JQuery的事件操作：冒泡、默认事件、事件绑定、事件委托、事件对象
JQuery中的大小、位置：height()/width()、outerHeight()、position()、offset()
JQuery中的其他操作：each、和DOM元素的转换、class操作、html()
JQuery工具：$.browser、$.trim()
JQuery的Ajax：$.get()、$.ajax()
实例：JQuery拖拽、JQuery留言板
JQuery的各种bug
JQuery插件的使用：fancybox
编写JQuery插件：静态方法、extend()
实例：自定义JQuery插件——选项卡、自定义组件
|
|
第五阶段 主流WEB后端核心技术和AJAX
|
了解 WEB开发技术的核心知识，JSP或PHP或ASP.NET
AJAX详解
AJAX的基本原理讲解、XHR对象的基本知识、JSON与XML的辨析
同步加载与异步加载、AJAX在不同浏览器中的兼容问题、原生AJAX实例讲解与应用、加载方式、jQuery中AJAX的使用、利用jQuery实现AJAX的效果开发
|
|
第六阶段 H5高级整合和Bootstrap实战
|
1,多媒体处理
音频和视频处理、表单处理、表单验证、Geolocation API、Forms API、HTML5 拖放、Web Storage AP, 离线 Web 应用、Canvas、SVG、Chart.js 框架、Two.js 框架
video、audio基础，支持和兼容性
基本形式，src属性，不支持的文字提示
可选参数：controls、autoplay、loop
文件格式支持，source标签的使用
实例：原生视频播放
各浏览器下的工具样式
实例：编写自己的播放器
play()方法、pause()方法，stop方法的模拟，currentTime属性的使用
实例：播放、暂停和停止
duration属性，durationchange事件，DOM3事件注意事项
实例：显示和控制当前播放进度
timeupdate事件，onend事件
实例：播放结束弹出“相关推荐”弹出层
progress事件，buffer对象，end()方法
实例：显示视频加载进度
muted属性，volume属性
实例：控制播放音量
canplay、canplaythrough事件的使用，loadeddata事件
error和emptied事件的区别，加载错误处理
实例：数据缓冲和错误提醒
canPlayType()的使用
实例：打开外部文件并播放
实例：用localStorage和json持久化，完成播放列表和播放进度记录
实例：绘图板铅笔工具
实例：绘图板矩形工具
实例：绘图板橡皮擦工具
drawImage()方法绘制图片，drawImage()方法的三种形式
实例：绘图板的拖拽上传图片
createPattern()方法创建平铺图案
实例：自定义填充
toDataURL()方法导出canvas图像
实例：绘图板“保存”功能的实现
实例：post将图片上传到服务器
drawImage()方法的高级应用，用精灵图实现人物行走功能
实例：行走的小人
封装ZImg对象，物体的定位、碰撞检测
canvas中的事件检测，绘制线程
实例：可以拖拽的canvas图片
实例：canvas飞机游戏
实例：绘制柱状图
实例：绘制折线图
实例：绘制饼图
实例：绘制3D柱状图
ZObject类，基本属性：位置、父级、子级，方法：appendChild()、removeChild()、draw()、ev()、pointIn()，事件：mousedown/mouseup/click/mousemove/mouseover/mouseout
实例：编写并通过继承扩展ZObject类
ZRect类、ZImg类，图片裁切，设置各种样式
实例：用ZRect类重写canvas时钟
2，Bootstrap框架详解
响应式网页、Bootstrap 基础、CSS 样式、组件、插件、BS Grid、BS Forms、BS Inputs、LESS、Bootstrap 定制
bootstrap css
网格系统
排版
表格
表单
按钮
图片
辅助类、响应式
布局组件
字体图标
下拉菜单
按钮组
输入框组
列表组
导航元素、导航栏
分页
Bootstrap提供的一些更快捷美化页面的样式
标签
徽章
超大屏幕
页面标题
缩略图
警告
多媒体对象
面板
Wells
插件
模态框插件
折叠插件
轮播图插件
滚动监听插件
3，web APP开发
兼容的触屏事件与手势事件、webAPP的新增meta属性、各平台实用私有属性、webAPP渲染加速技术
|
|
第七阶段 Vue.js全家桶实战
|
通过本课程的系统学习，学员将学会和掌握轻量、易学但功能强大的Vue.js前端开发库，以及由Vue.js及其高级工具和插件库组成的前端开发“框架”。
1. 内部指令
v-if
v-else
v-show
v-for
v-text
v-html
v-on
v-model
v-bind
v-once
v-pre
v-cloak
2. 全局api
Vue.directive 自定义指令
Vue.extend 构造器扩展
Vue.set 全局set
Vue 钩子函数
template 模板
Vue.component 全局组件
component 标签
3. 选项
propsData
computed
methods
watch
mixins
extends
4. 实例方法
$mount()
$destroy()
$forceUpdate()
$nextTick()
5. 实例事件
$on()
$once()
$off()
$emit()
6. 内置组件 slot
7. vue-router
配置路由
传递参数
重定向、alias别名
过渡动画
路由中的钩子（导航守卫）
编程式导航
|
|
选修单元 客户端缓存
|
桌面通知基础，webkitNotifications对象的使用
createNotification()方法的参数，设定通知图标，设置标题和内容
用checkPermission()检查用户授权，requestPermission()请求权限
实例：弹出桌面通知
show()、close()方法的使用
实例：通知的延时自动关闭
通知的各种事件：ondisplay、onclick、onclose、onerror
实例：点击通知后定位到指定消息
弹出HTML通知
离线应用基础，缓存离线资源，在线状态检测，本地数据存储和同步
实例：自动通知用户在线状态
manifest文件的编写，manifest文件的引入，NETWORK段、CACHE段、FALLBACK段的使用
manifest文件实例
实例：可离线使用的记事本
缓存更新的两种方法和策略，applicationCache对象的使用
UPDATEREADY状态，update()方法
navigator.onLine属性的检测
online、offline事件的使用
实例：服务器、本地缓存同步
webWorker和webSql
WebWorker基本使用，多线程的概念
创建worker，onmessage事件
通过data获取线程消息
实例：用webWorker计算菲波那切数列，与主线程分离
postMessage()方法传递数据
onerror事件
terminate()/close()方法终止线程运行
实例：用worker与服务器通信
子线程中的this
webWorker的问题
webSql基本使用
数据库的基本使用：CREATE语句、SELECT语句、INSERT语句、DELETE语句、UPDATE语句
openDatabase()方法打开数据库
transaction()方法进行事务处理，事务处理的原子性
事务上下文的使用
实例：创建数据库，并创建数据表
executeSql()方法执行Sql语句
result的属性和方法
实例：插入数据、获取数据
实例：记账管理系统
|
|
选修单元 webGL
|
webGL基础
webGL效果演示
webGL的基本组成：场景、渲染器、光源、摄像机、物体
场景：创建、添加
渲染器：SVG、canvas、webGL三种渲染器的使用和区别
光源：平行光、点光源、环境光的区别和使用，制定光源的颜色、强度、照射距离
摄像机：矩形摄像机、景深摄像机的区别，摄像机的远点、近点、宽高比等属性的设置
物体的形状和材质，简单的立方体，朗伯材质的特点和使用，制定物体颜色、光特性，mesh的使用
实例：第一个全3D网页程序
render()方法和渲染参数
物体的位置、旋转、缩放属性的设置
实例：键盘控制的3D方块
循环渲染，requestAnimationFrame()的原理和使用
实例：鼠标控制摄像机移动
高品质渲染和抗锯齿选项
线框渲染
物体投影，光源投影
实例：碰撞墙壁反弹的小球
webGL应用
系统自带标准几何形状：平面、立方体、球体、圆台、八面体、托雷斯体
实例：各种几何形状的使用
add()方法给物体添加子对象
平面体的使用
materials数组，为各个面单独指定材质
faces数组，引用各个材质面
实例：构建复杂的3D模型 摆动的钟
导入外部模型文件
骨骼的控制
让外部模型动起来
|
|
选修单元 Angular 2实战
|
本课程先通过介绍Angular 1.X框架的不足来引入新的Angular 2，再结合Ionic2框架通过理论讲解和代码演示的方式，对Angular 2的变化和优势以及核心功能进行了详细的剖析，然后通过项目实战案例，由浅入深、层次分明地讲解使用Angular 2+Ionic2开发实战项目的完整过程。
1.掌握Angular的基础知识
2.理解Angular 1.X的不足和Angular 2的变化和优势
3.掌握使用Angular 2结合Ionic框架进行项目开发
4.掌握前端自动化开发工具Grunt环境的搭建及其对插件的管理应用
|
|
选修单元 React实战
|
一次学习，随处编写
React其内部实现的虚拟DOM屏蔽了所有的底层实现，通过不同的渲染器，你编写的同一套代码可以用来构建包含浏览器/桌面操作系统/Android/iOS等几乎所有平台的用户界面。
也就是说，掌握了 React 之后，你的能力将不止局限于写网页，而是可以在几乎所有的平台上开发用户界面。
1、掌握框架和库：react 、redux、react-router
2、掌握构建工具：npm、webpack
3、脚手架的使用：create-react-app
4、掌握 React 项目当中CSS的开发：CSS Modules、Sass、PostCSS、CSS in JS
5、编辑器相关：Codepen、VS Code
|
|
选修单元 微信公众号开发
|
1、微信公众平台介绍
微信及其不同的平台
微信公众平台
功能
管理
服务
统计
设置
2、开发模式
启用开发模式
关闭编辑模式
启用开发模式
常见问题与解决方案
实现自动回复
消息交互原理分析
3、基础接口
接收用户消息
接收文本消息
接收图片消息
接收语音消息
接收视频消息
接收地理位置消息
接收链接消息
代码实现
用户回复消息
文本消息
图片消息
语音消息
图文消息
代码实现
接收事件推送消息
关注/取消关注
代码实现
4、微信支付
申请微信支付
申请流程图
开发经营类目
资费标准
常见问题
5、申请支付功能介绍
方案简介
应用场景举例
商户模块
功能接口
账号体系
商务系统对接
行业案列
支付功能常见问题
6、微信支付接口
支付基础
JS API支付接口
Native（原生）支付接口
通知接口
收货地址共享接口
7、自定义菜单和高级接口
Access Token
自定义菜单
OAuth2.0网页授权
获取用户地理位置
获取用户基本信息
获取关注者列表
用户分组管理
|
|
选修单元微信小程序开发
|
1、初识微信小程序
微信小程序开发工具
开发第一个微信小程序
认识开发工具
查看小程序效果
2、小程序页面开发
CSS样式
轮播组件与九宫格导航
3、小程序页面开发
卡片布局
个人中心
店铺列表
4、微信小程序页面JS逻辑处理
Wx.request加载网络数据
网络数据页面绑定
提交本地数据到服务端
5、认证与支付
微信小程序授权流程
授权案例分析
小程序登录接口使用
小程序支付接口使用案例分析
|
搜索课程
>>> 互联网前端开发工程师(html5+JS）开班介绍
