信息资讯 | News

2018年爱创课堂前端培训课程大纲

爱创课堂Web前端开发工程师培训(文后附视频下载链接)

免费领取初中级课程视频请加QQ  2079576908

爱创课堂由前百度工程师,《javaScript设计模式》张容铭老师创立,公司秉承纯干货,不忽悠的态度专注前端培训,让每个零基础的学员都能真正的从入门到精通。目前基础班免费读!!新课程增加20个实战项目,5个月助你成为真正前端工程师。

 
Web前端开发工程师,主要职责是利用HTML、XHTML、CSS、JAVAScript、FLASH等各种Web前端技术进行客户端产品的开发。完成客户端程序(也就是浏览器端)的开发,开发JavaScript以及Flash模块,同时结合后台开发技术模拟整体效果,进行丰富互联网的Web前端开发,致力于通过技术改善用户体验。
 
第一阶段:页面制作基础
从这一基础阶段开始,正式学习Web前端开发需要的编程语言HTML,CSS和JavaScript。HTML和CSS用于Web静态内容的展示,JavaScript用于Web动态交互。完成这一阶段前端开发的学习,你就可以独立实现一个动静结合的Web前端项目啦!
 
第二阶段:主流框架应用
优秀的Web前端开发工程师一定都是追求高效率的”懒人“。这一框架阶段就是教你如何使用当今流行的Web前端框架,包括bootstrap、Angularjs等,来提高前端开发效率。在学习前端框架本身的同时,也希望你能掌握任意一种快速上手的web前端框架的方法!?
 
第三阶段:前端技术进阶
web前端开发进阶阶段的学习,主要是让大家快速掌握当今流行、实用、最新的技术,比如:less、sass、json、ajax等,并将这些前端技术快速用于实践,开发出更加符合客户体验度的web前端页面。
 
第四阶段:前端技术拓展
web前端技术发展日新月异,因此前端技术的拓展学习及实践对于web前端工程师来说非常重要。本阶段就是基于、Backbone、bootstrap等技术的拓展学习和web前端项目的实战开发演练。
 
 
2018修订 By张容铭

爱创课堂教学大纲

Web前端100天教程 V 6.1 (2018-8修订)

本次更新内容:
项目有20个
Vue,React框架有ES5语法编程改成ES6语法编程
升级了Angular6.0 版本,webpack,ajax2.0,Vuex,axios
升级 React 到 v16.20 版本,Vue 到 v2.5.13版本,Angular1.0到1.6.9版本
新增 ES2016,ES2017规范
新增 Angular6.0 项目,ReactNative项目,Vue-cli项目
新增 redux
新增 koa 框架
新增毕业设计综合项目:koa+mongodb+ES6+webpack+react+angular+vue项目
html,css,html5,css3局部更新
 
 第一部分 课程大纲

初级课

第01天 开班典礼

1、为学生配置环境

第02天 HTML第一天

1、HTTP协议
2、html是纯文本
3、html骨架
4、DTD文档类型
5、head标签
6、body标签
7、html基本语法
8、h系列的标签
9、p标签
10、img标签
11、a标签
12、div和span含义

第03天 HTML第二天

1、无序列表
2、有序列表
3、定义列表
4、表格基础
5、合并单元格
6、三个划分区域的语义标签
7、form标签
8、input标签
9、单行文本框
10、密码框
11、单选框
12、多选框
13、文本域
14、下拉菜单
15、按钮

第04天 CSS第一天

1、html注释
2、废弃标签
3、实体字符
4、css的概念
   5、css的作用
   6、css的样式
   7、css的书写位置
   8、基础选择
   9、高级选择器
   10、css的继承性
   11、css的层叠性

第05天 CSS第二天

1、color属性
2、font-size属性
3、font-family属性
4、line-height属性
5、font-weight属性
6、font-style属性
7、text-indent属性
8、text-align属性
9、text-decoration属性
10、盒模型的初步认识
11、padding详解
12、margin详解
13、border详解

第06天 CSS第三天

1、盒模型的拓展知识
2、清除默认样式
3、宽度剩余法
4、height高度设置法
5、margin特性之垂直方向上的塌陷
6、margin特性之不能用儿子去踹父亲
7、父子盒模型的特性
8、居中的几种设置方法
9、认识标准文档流
10、标准文档流的特性
11、块级元素和行内元素的特性
12、浮动的基础知识

第07天 CSS第四天

1、浮动的作用
2、浮动的特性之浮动的元素脱离标准文档流
3、浮动的特性之浮动的元素没有margin塌陷
4、浮动的特性之浮动的元素依次贴边
5、浮动的特性之浮动的元素让出标准流的位置
6、浮动的特性之字围效果
7、浮动存在的问题
8、清除浮动的方法之给父盒子加高度
9、清除浮动的方法之加clear属性
10、清除浮动的方法之加隔墙法
11、清除浮动的方法之overflow法

第08天 CSS第五天

1、a标签的伪类
2、a标签伪类的顺序不能颠倒
3、a标签伪类的应用实例之按钮实例
4、a标签伪类的应用实例之导航栏实例
5、background-color背景色的详解
6、background-image背景图的详解
7、background-repeat背景重复的详解  
8、background-position背景定位的详解
9、精灵图的使用方法及案例
10、background-attachment背景固定的详解
11、背景的应用之文字换图片案例
12、背景的应用之padding设置背景图案例

第09天 CSS第六天  

1、position:relative的详解
   2、position:relative的负值表示法
   3、position:relative的应用之元素位置微调的实例
   4、position:absolute的详解
   5、position:absolute的特性之不针对祖先元素的定位参考点
   6、position:absolute的特性之祖先元素有定位的参考点
   7、position:absolute的特性之绝对定位的顶点
   8、position:absolute的特性之利用绝对定位制作压盖效果
   9、position:absolute的特性之绝对定位的元素设置水平居中
   10、position:absolute的实例之滚动轮播图  
   11、position:fixed的详解
   12、z-index属性的详解
13、常用CSS单位
   14、html hack的详解
   15、css值hack的详解
   16、css选择器hack的详解
17、IE6的兼容性问题

第10天 项目实战

1、制作博雅互动页面
2、分析页面的结构
3、搭建html结构代码
4、搭建css样式代码

第11天 HTML5  

   1、html5的简介
   2、HTML5的新骨架和语义化标签
   3、新的input控件
   4、placeholder属性的详解
   5、autofocus属性的详解
   6、datalist标签的详解
   7、video标签的详解
   8、audio标签的详解
   9、css3的简介
   10、属性选择器的详解
   11、儿子序选择器的详解
   12、儿子类型序选择器的详解
   13、节点关系选择器的详解

第12天 CSS 3第一天

1、伪类的应用
   2、伪元素的应用
   3、border-radius属性的详解
   4、box-shadow属性的详解
   5、text-shadow属性的详解
   6、background-origin属性的详解
   7、background-clip属性的详解
   8、background-size属性的详解
   9、渐变背景的详解
   10、多背景的详解

第13天 CSS 3第二天

1、过渡的基础知识
2、2D变形的详解
3、@keyframes规则的详解
4、animation属性的详解
5、animation属性制作动画的实例
6、box-sizing属性的详解
7、响应式布局的详解
8、百分比布局的详解
9、圣杯布局
10、双飞翼布局
11、flex布局
12、固比固模型的详解
13、媒体查询的详解

第14天 BootStrap

1、Bootstrap使用步骤
2、Bootstrap栅格系统的详解
3、Bootstrap栅格系统的实例
4、Bootstrap的排版之内联子标题
5、Bootstrap的排版之引导主体副本
6、Bootstrap的排版之对齐类
7、Bootstrap的排版之强调类
8、Bootstrap的表单使用及实例
9、Bootstrap的按钮,图片的使用及实例
10、Bootstrap的字体图标
11、Bootstrap的导航等工具的使用及实例

第15天 项目实战

1、制作移动端项目的页面
2、分析页面的结构
3、搭建html结构代码
4、搭建css样式代码

第16天 项目实战

1、制作安徽龙禧项目页面
2、分析页面的结构
3、搭建html结构代码
4、搭建css样式代码

第17天 JavaScript基础

1、Javascript简介
2、Javascript的书写位置
3、alert语句
   4、console.log语句
   5、数字字面量
   6、字符串字面量
   7、变量的声明
   8、变量的赋值
   9、变量声明的提升
   10、数据类型的检测方法
   11、数据类型的转换方法

第18天 JavaScript基础

1、数学运算符
   2、Math对象的几种方法
   3、比较运算符
   4、逻辑运算符
   5、赋值运算符
   6、综合运算的顺序
   7、if语句的详解
   8、三元运算符的详解
   9、switch语句的详解

第19天 JavaScript基础

1、for循环语句的详解
   2、穷举思想的详解
   3、累加器和累成器的实例
   4、do while语句的详解
   5、while语句的详解
   6、break用法的详解
   7、continue用法的详解
   8、函数语句的声明
   9、函数语句的调用

第20天 JavaScript基础

1、函数的参数详解
   2、函数的返回值的详解
   3、函数表达式
   4、函数的数据类型
   5、函数声明的提升
   6、递归函数的详解
   7、变量的作用域
   8、局部变量和全局变量的详解
   9、作用域链的详解
   10、函数的作用域
   11、闭包的详解
   12、数组的基础知识
   13、数组的遍历

第21天 JavaScript基础

1、数组的首尾操作方法
   2、数组的合并和拆分方法
   3、数组的删除方法
   4、数组的插入方法
   5、数组的替换方法
   6、数组的排序方法
   7、数组转换为字符串的方法
   8、charAt方法的详解
   9、concat方法的详解
   10、indexOf方法的详解
   11、slice方法的详解
   12、split方法的详解
   13、substr方法的详解
   14、substring方法的详解
   15、toLowerCase方法的详解
   16、toUpperCase方法的详解

第22天 JavaScript基础

1、正则表达式的概念
   2、正则表达式的精确匹配
   3、正则表达式的预定义特殊字符
   4、正则表达式的字符集
   5、正则表达式的修饰符
   6、正则表达式的边界
   7、正则表达式的预定义类
   8、正则表达式的量词
   9、正则表达式的分组
   10、正则表达式的或操作符
   11、正则表达式分组的反向引用  
   12、正则表达式的中文
   13、正则表达式的实例

第23天 JavaScript基础

   1、arguments的详解
   2、IIFE的详解
   3、结合数组观察闭包
   4、DOM的基础知识
   5、操作html的方法
   6、操作css的方法
   7、DOM中事件的几种方法
   8、setInterval方法的详解

第24天 JavaScript基础

1、getElementsByTagName方法的详解
2、批量添加事件监听的方法
3、对应思想的实例
   4、排他思想的实例
   6、getElementsById方法的详解
   5、getComputedStyle方法的详解
   6、currentStyle方法的详解
7、对象基础知识
   8、JSON的基础知识
   9、JSON的遍历方法

第25天  jQuery

1、jQuery简介
2、使用方式
3、$函数
   4、jQuery对象
   5、选择器
   6、jQuery函数
   7、常见方法
   8、css方法
   9、show方法、hide方法
   10、slideDown方法、slideUp方法
   11、fadeIn方法、fadeOut方法
   12、html方法
   13、addClass方法、removeClass方法
   14、attr方法
   15、节点关系
16、$(this)
17、parent
18、children
19、siblings
20、连续打点
21、其它节点方法

第26天 jQuery

1、jQuery中的序号
2、eq
3、index()
4、对应
5、each()方法
6、animate()方法
7、animate()方法概述
8、哪些属性能够参与动画
9、动画的顺序
10、回调函数
11、delay()延迟
12、stop()方法
13、动画积累的防止
14、交叉淡入淡出轮播

第27天 jQuery

1、龙禧分析
2、龙溪布局
3、呼吸轮播图变种
   4、布局和CSS
   5、按钮事件
  6、火车法滚动轮播图
   7、布局和css
   8、按钮事件
   9、小圆点事件
   10、三位置法滚动轮播图

第28天 jQuery

1、间歇模型
2、手风琴效果
3、篮球计分系统
   2、普通思维
   3、数组思维
   4、异形滚动
  5、布局和css
   6、右按钮事件
   7、左按钮事件
8、异型滚动多元素参与

第29天 jQuery

1、项目实战  
2、分析页面布局
3、搭建html结构
4、书写css样式
5、书写页面交互效果

 

中级课

第30天 JavaScript进阶

1、概述
   2、DOM深入
2、DOM组成
   3、节点的类型
4、childNodes属性
5、造轮子统一浏览器表现
  4、节点属性
   5、节点关系
6、节点操作
7、创建节点和上树
   8、移动节点
   9、删除节点 removeChild()方法  
   10、替换节点 replaceChild()方法
   11、克隆节点 cloneNode()方法
12、jQuery中的节点操作
13、上树的8种方法
   14、wrap()和unwrap()、wrapAll()  
   20、replaceWith()和replaceAll()方法
   21、empty()和remove()方法
   22、clone()方法  
23、animate函数 

第31天 JavaScript进阶

1、事件流
   2、事件流概述 
   3、DOM0级事件监听方法
   4、DOM2级事件监听
   5、低版本IE的事件添加 
5、Dom0级和Dom2级之间的区别
6、移除事件
   6、事件绑定小轮子
6、event事件对象
7、事件对象的兼容问题
8、通用属性
9、拖拽
   10、阻止事件冒泡
   11、阻止默认事件
  12、限制拖拽

第32天 JavaScript进阶

1、原生JS的元素位置和尺寸
2、clientWidth、clientHeight、offsetWidth、offsetWidth
3、jQuery中的快捷尺寸
4、offsetTop和offsetLeft
5、认识offsetParent
   6、在页面中的净位置
   5、淘宝放大镜案例1
6、淘宝放大镜案例2
7、onscroll事件
8、节流

第33天 JavaScript进阶

1、鼠标滚轮事件
   2、onmousewheel
   3、火狐中的鼠标滚轮事件
   4、滚轮的滚动方向与速度
   5、区别
6、滚动轮播图
7、键盘事件
8、tabIndex属性
   9、小钢琴
  10、面向对象
11、修改面向过程为面向对象
12、构造函数
13、构造函数的四步
13、气球类

第34天 JavaScript进阶

1、气球游戏
2、原型推导
3、instanceof关键字
4、hasOwnProperty方法
5、安全类
6、继承
7、类式继承
8、构造函数式继承
9、组合式继承
10、原型式继承的缺点
11、内置构造函数
12、内置构造函数之间的关系

第35天 JavaScript进阶

1、游戏分析
2、贪吃蛇游戏
   3、游戏类
   4、蛇类
   5、食物类
   6、障碍类

第36天 JavaScript进阶

1、ES5
2、JSON对象
3、数组方法
4、判断数组
5、indexOf方法和lastIndexOf方法 讲解并实现
6、forEach方法 讲解并实现
7、map方法 讲解并实现
8、fill方法 讲解并实现
9、some方法 讲解并实现
10、every方法 讲解并实现
11、filter方法 讲解并实现
12、reduce方法 讲解并实现  reduceRight方法
13、addNum方法 讲解并实现
14、复习call和apply
15、bind方法的讲解并实现
16、日期拓展

第37天 JavaScript进阶

1、严格模式
2、全局严格模式
3、局部严格模式
4、8进制
5、arguments.callee
6、delete关键字
7、关键字、保留字、特殊变量
8、eval
9、with
10、同名属性
11、函数参数
11、特殊字符串
13、对象特性
14、对象的原型拓展
15、密封对象 seal
16、冻结对象 freeze
17、对象的创建create

第38天 大数据可视化与Git

1、highcharts  
2、标题
3、横坐标轴
4、纵坐标轴
5、提示框
6、数据点的细节
7、署名
8、图例
9、数据列
10、百度天气
11、导出图片
12、动态更新图表
13、安装git
14、linux常见指令
15、git文件状态
16、git指令
17、建立信任关系
18、上传文件
19、拉取版本库
20、seajs简介
21、seajs定义模块
22、Require模块
23、使用具有id的模块

第39天 模块化

1、异步加载模块
2、配置
3、加载css文件
4、预加载插件
5、requirejs简介
5、体验requirejs
8、requirejs定义模块
9、模块对象
10、使用具有id的模块
11、模块覆盖
12、接口暴露
13、配置
14、Css插件

第40天 移动端

1、touchstart事件
2、touchmove事件
3、touchend事件
4、touchcancel事件
5、事件对象
6、手指滑动轮播图(携程)
7、webkit-transitionend事件
8、webkit-animationstart事件
9、webkit-animationend事件
10、zepto介绍
11、地图API

第41天 CSS 3D

1、复习2d知识
2、3DtranslateZ + perspective
3、立方体案例
4、transform-style: preserve-3d
5、scaleZ
6、背面不可见属性
7、改变旋转中心
8、3d碎片轮播图动画定义
9、3d碎片轮播图布局
10、3d碎片轮播图样式
11、3d碎片轮播图代码

第42天 HTML5

1、本地存储
2、会话存储
2、评测系统案例
3、服务器
4、http协议
5、多线程一
6、多线程二
7、websql
8、事件推送
9、history pushState popState replaceState onpopstate
10、拖拽事件
11、拖拽删除案例
5、音频
6、视频

第43天 Canvas

1、canvas简介
2、坐标系的概念
3、路径的概念
4、常用API
7、绘制图片一
8、绘制图片二
9、绘制图片三
10、平移坐标系
11、旋转坐标系
12、星星
13、多个星星
14、星星连线
15、保存+恢复状态
16、绘制时钟
14、操作像素
15、融合属性

第44天 FlappyBird游戏

1、布局和分析
2、背景类
3、管子类
4、绘制管子
5、管子移动
6、鸟类
7、渲染鸟
8、鸟的升降旋转
9、碰撞检测

第45天 设计模式

1、设计模式简介
2、设计模式分类
3、简单工厂模式
4、寄生增强工厂
5、工厂方法
6、原型、继承
7、安全类
8、闭包类
9、惰性单例
10、静态变量
11、命名空间函数

第46天 设计模式

1、命名空间函数提取数据
2、观察者模式
3、微博
4、DOM2级观察者模式
5、观察者模式的注销事件
6、观察者模式实现
7、单次注册消息once方法实现
8、jQuery中的策略模式
9、表单正则策略
10、委托模式一 减少事件数量
11、委托模式二 预言未来元素
12、委托模式三 防止内存泄漏

第47天 设计模式

1、节流器模式为什么要存在——京东导航
2、节流器模式的实现(使用和停止)
3、最终节流器
4、jQuery中的迭代器
5、underscore中的迭代器
6、ES5中的迭代器
7、自己的迭代器
8、小型代码库
9、适配器模式
10、组合模式
11、jQuery实现-工厂模式
12、jQuery实现-拓展类
13、jQuery-链模式
14、命令的定义
15、命令的调用

第48天 HTTP、HTTPS与服务器

1、服务器概念介绍
2、如何访问服务器---URL
3、HTTP协议
4、HTTPS协议
5、URL访问流程
6、NodeJS简介
7、环境变量
8、NodeJS特点
9、NodeJS模块化
10、node_modules目录
11、HTTP模块搭建简单服务器
12、HTTPS模块搭建简单服务器
13、FS模块
14、PATH模块、URL模块、QueryString模块
15、静态服务器
16、MIMEType

第49天 AJAX

1、接口
2、Node处理GET接口
3、Node处理POST接口
4、AJAX简介
5、AJAX四步
6、AJAX要的是JSON以及字符串转对象的三种方式

第50天 AJAX

1、AJAX发送GET请求
2、AJAX发送POST请求
3、jQuery中的AJAX
4、jQuery中的序列化表单
5、AJAX封装
6、表单序列化
7、登录和注册

第51天 AJAX

1、瀑布流简介
2、瀑布流布局一
3、花瓣网布局
4、花瓣网数据抓取
5、发送ajax请求抓取数据并分析
6、如何将ajax请求回来的数据放入界面上
7、格式化函数
8、最终渲染
9、AJAX分页
10、本地存储优化AJAX分页

第52天 AJAX

1、域和同源策略
2、JSONP跨域
3、JSONP轮子
4、jQuery中的JSONP
5、AJAX2.0
6、AJAX2.0 跨域
7、懒加载
8、AJAX分页

第53天 框架设计

1、MVC介绍
2、M层的实现
3、V层的实现
4、C层的实现
5、MVC暴露内容
6、模块划分
7、创建视图的步骤
8、Background模块一
9、Background模块二
10、Header模块一
11、Header模块二
12、Header模块三

第54天 框架设计

1、Home模块一
2、Home模块二
3、观察者模式解决跨模块通信问题
4、Carousel模块一
5、Carousel模块二
6、Carousel模块三
7、Portfolio模块一
8、Portfolio模块二
9、Portfolio模块三
10、MVVM模式
   11、MVVM封装组件

第55天 NodeJS

01、Express简介
02、Express路由
03、Express静态化文件夹
04、Express模板(后端渲染)
05、文件上传
06、多文件上传
07、MongoDB安装
08、MongoDB常用命令一
09、MongoDB常用命令二
10、NodeJS连接MongoDB
11、项目介绍

第56天 NodeJS

01、注册布局
02、检测用户名
03、注册逻辑一
04、注册逻辑二
05、登录逻辑
06、Cookie的介绍及使用
07、Session的介绍及使用

第57天 NodeJS

01、主页
02、管理页面
03、创建相册功能
04、展示相册功能
05、删除相册功能
06、删除图片
07、上传功能

第58天 NodeJS

01、权限操作分析
02、图片修改状态
03、全部相册逻辑
04、我的相册逻辑
05、GM模块的简单使用
06、头像裁剪布局
07、头像裁剪功能
08、退出功能

第59天 NodeJS

01、聊天室功能介绍
02、AJAX轮询聊天室(布局)
03、AJAX轮询聊天室(功能)
04、Socket.io模块简介
05、Socket.io模块测试
06、Socket.io模块聊天室(布局)
07、Socket.io模块聊天室(功能一 实时聊天)
08、Socket.io模块聊天室(功能二 用户进入之后显示欢迎)
09、Socket.io模块聊天室(功能三 用户离开之后显示欢送)
10、Socket.io模块聊天室(功能四 全体禁言)

第60天 NodeJS

01、联机版贪吃蛇游戏介绍
02、登录注册
03、布局
04、创建房间
05、加入游戏
06、开始游戏
07、游戏操作
08、游戏结束

 

高级课

第61天 Gulp与Webpack工程化

1、体验gulp
2、Task任务
3、读写文件
4、监听文件
5、Globs语法
6、重命名插件
7、压缩js插件
8、压缩css插件
9、压缩html插件
10、项目实战
11、文件打包
12、语法检测
13、图片压缩
14、Webpack
15、Webpack-dev-server

第62天 ECMAScript 6

1、压缩js插件
2、图片加载机
3、环境变量与全局变量
4、Hot module
5、编译ES6
6、ES6类与继承的实现
7、Let关键字
8、常量
9、字符串位置
10、多行字符串
11、重复字符串
12、原始字符串
13、数字对象拓展
14、数学对象拓展

第63天 ECMAScript 6

1、From方法
2、Of方法
3、获取数组成员
4、数组拷贝
5、对象字面量
6、Is判断方法
7、数组迭代器方法
8、Assign方法
9、Symbol类型
10、代理
11、默认参数
12、获取剩余参数

第64天 ECMAScript 6

1、对象解构
2、数组解构
3、箭头函数
4、箭头函数作用域
5、Set对象
6、Weakset对象
7、Map对象
8、Weakmap对象
9、迭代器
10、Generator函数
11、Promise对象

第65天 KOA

1、koa简介
2、安装koa
3、搭建服务器
4、context对象
5、HTTP请求
6、静态资源与重定向
7、网页模板
8、配置路由
9、中间件与配置
10、错误处理
11、cookie和session
12、表单提交
13、文件上传
14、链接数据库
15、对比KOA与Express

第66天 LESS与SASS预编译

1、工程化编译less
2、变量
3、混合
4、方法
5、条件语句
6、内置方法
7、导入文件与JS语句
8、插值语法
9、工程化编译sass
10、变量
11、属性嵌套
12、混合
13、混合传参与获取剩余参数
14、继承
15、运算
16、插值语法
17、If条件语句与三元语句
18、For循环语句与栅格化系统
19、While循环与枚举循环

第67天 微信开发

1、微信小程序简介、注册账号与目录结构
2、测试工具
3、全局配置与项目配置
4、应用构造器,页面构造器,应用程序生命周期
5、页面生命周期,常见事件,常见全局方法
6、渲染原理,数据驱动,数据绑定与插值
7、修改数据与数据丢失
8、wxml与html,通用属性
9、绑定事件,事件对象
10、View与Text组件
11、富文本组件
12、Icon组件与图片组件
13、canvas组件
14、地图组件
15、多媒体组件(视频组件,相机组件,直播与录播组件)

第68天 微信开发

1、指令,条件指令与循环指令
2、容器组件(scroll-view swipper movable-view cover-view)
3、引入文件,城市切换结构布局
4、城市切换样式
5、城市切换交互
6、表单组件一(Input Label Botton Checkbox Radio)
7、表单组件二(Picker Picker-view Progress Slider Switch Textarea form)
8、模板组件与导入组件
9、路由导航组件
10、wxss与css、rpx与flex布局

第69天 微信开发

1、明信片项目
2、开放组件open-data,web-view与https协议
3、自定义组件
4、wxs组件
5、路由切换
6、本地存储
7、城市切换-历史访问城市
8、明信片-存储信息
9、指南针工具
10、request,downloadFile,uploadFile,chooseImage
11、getLocation, chooseLocation, openLocation, requestPayment, getWeRunData

第70天 微信开发

1、项目配置
2、首页头部,购物车,网络请求
3、商品详情样式和布局
4、首页交互逻辑
5、更新商品数量
6、订单页面
7、获取订单信息
8、订单消息页面
9、个人页面
10、打卡工具
11、上线小程序

第71天 Vue 2.0

1、vue简介
2、体验vue
3、数据绑定的实现原理
4、webpack编译
5、数据丢失
6、插值表达式与属性绑定
7、自定义过滤器
8、动态数据绑定
9、数据双向绑定
10、DOM事件与事件修饰符
11、类的绑定
12、样式的绑定
13、条件模板指令
14、循环模板指令与模板元素

第72天 Vue 2.0

1、支付宝页面
2、支付宝交互
3、过渡
4、选框元素数据双向绑定
5、下拉框的数据双向绑定
6、自定义指令
7、表单校验
8、组件
9、slot组件,component组件
10、keep-live组件、组件生命周期

第73天 VueX、Router与Vue cli

1、父组件到子组件通信
2、vue中观察者模式
3、子组件到父组件通信
4、Flux与Vuex解决组件通信问题
5、Vuex异步操作,动态数据、模块切割
7、路由
8、路由参数,默认路由与重定向
9、子路由与路由导航
10、异步请求axios库
11、webpack编译Vue组件

第74天Vue cli + Router + VueX + ES6 + Webpack项目实战

1、Vue cli架构分析
2、Vue cli搭建美团项目并配置路由
3、webpack配置美团项目并配置路由
4、安装store与axios
5、header组件
6、icons模块
7、广告模块
8、首页商品列表
10、列表页组件
11、列表页交互
12、详情页
13、监听路由变化

第75天 React

1、浏览器渲染原理
2、Layout,Repaint,Reflow
3、React与性能优化
4、创建虚拟DOM
5、组件
6、jsx语法与编译
7、殊性元素属特,插值与注释
8、样式,非元素属性,渲染列表
9、组件属性,默认属性与属性的约束
10、事件绑定
11、组件状态
12、换肤

第76天 React

1、组件创建期
2、父组件向子组件通信
3、组件存在期
4、组件销毁期
5、非约束性组件
6、约束性组件
7、单选下拉框组件的约束性
8、多选下拉框组件的约束性
9、非react类库
10、侵入式类库
11、子组件到父组件通信
12、兄弟组件间通信

第77天 React、Redux、项目实战

1、项目需求分析与架构分析
2、搭建项目环境
3、header导航模块
4、首页banner
5、首页第一个列表
6、首页第二个列表
7、起步页组件
8、起步页样式
9、抽象page页面组件
10、观察者模式解决组件通信问题
11、flux,reflux,redux
12、redux实现通信
13、react-redux

第78天 React、React Router、项目实战

1、路由
2、路由中使用redux
3、create-react-app
4、项目需求分析与架构分析
5、头部模块
6、首页
7、详情页
8、评论页
9、提交评论

第79天 ReactNative

1、安装ReactNative
2、安装SDK
3、配置环境变量
4、Android真机测试
5、IOS真机测试配置
6、安装虚拟测试设备
7、调试工具
8、定义组件
9、创建组件
10、创建样式
11、数据双向绑定
12、常见组件:Image, ScrollView, FlatList
13、异步请求
14、flex布局

第80天 Typescript与Angular 6.0

1、ES6与Typescript
2、浏览器端编译ts与数据类型
3、工程化编译TS与数组类型
4、枚举类型
5、函数定义式
6、类型推断、泛型、联合类型
7、类的定义与实现
8、继承的实现
9、interface与函数接口
10、对象接口
11、类接口
12、模块的定义与实现
13、Angular6.0简介
14、Angular cli创建项目
15、npm指令与webpack配置
16、组件、注解与元信息
17、Shadow DOM样式与设置样式三种方式

第81天 Angular 6.0

1、css预编译技术与样式指令
2、动态绑定类指令
3、事件绑定
4、事件修饰符
5、局部模板变量
6、管道
7、自定义管道
   8、自定义组件
9、父组件向子组件通信
10、子组件向父组件通信
11、条件模板指令
12、循环模板指令
13、自定义指令
14、指令到组件的通信
15、组件到指令的通信

第82天 Angular 6.0

1、实现icktShow自定义指令
2、实现icktBind自定义指令
3、实现icktClass自定义指令
4、组件生命周期
5、数据双向绑定
6、创建表单
7、表单检测
8、http服务
9、自定义服务
10、Angular6.0路由
11、jasmine与单元测试
12、单元测试组件

第83天 Ionic 3.0

1、Ionic简介
2、按钮与图标组件
3、卡片、栅格、分享、徽章组件
4、列表组件
5、表单组件
6、触屏事件
7、路由导航
8、登录与导航传参
9、搜索组件
10、欢迎页面
11、弹框
12、菜单

第84天 Angular6.0与Ionic3.0项目实战

1、QQ客户端需求分析
2、搭建环境与创建六个一级页面
3、登录页面
4、menu页面
5、禁用滚动与菜单栏页面
6、消息页面
7、动态页面
8、自定义组件
9、联系人页面
10、联系人详情页面
11、聊天页面

第85天 NodeJS项目 + Angular实现后台管理系统 + Vue实现移动端 + React实现PC端

1、项目需求与构建
2、pc端 webpack配置ReactJS+服务器
3、pc端 css3动画
4、pc端 图片加载机
5、pc端 路由模块
6、pc端 header模块
7、pc端 slider组件
7、pc端 首页组件
8、pc端 card组件
9、pc端 购买商品组件

第86天 NodeJS项目 + Angular实现后台管理系统 + Vue实现移动端 + React实现PC端

1、pc端 购买商品交互
2、pc端 分类页与搜索页
3、移动端   搭建vue环境
4、移动端   安装路由,vuex,axios
5、移动端   header模块
6、移动端   首页组件
7、移动端   卡片组件
8、移动端   购买商品组件
9、移动端   搜索组件

第87天 NodeJS项目 + Angular实现后台管理系统 + Vue实现移动端 + React实现PC端

1、服务器端 环境搭建
2、服务器端 配置mongoDB数据库
3、服务器端 home接口
4、服务器端 search接口
5、服务器端 type接口
6、后台管理系统   配置Angular6.0环境
7、后台管理系统   路由配置
8、后台管理系统   首页布局
9、后台管理系统   修改密码模块
10、服务器端   修改密码接口

第88天 NodeJS项目 + Angular实现后台管理系统 + Vue实现移动端 + React实现PC端

1、后台管理系统   登录页面
2、服务器端      登录页面接口
3、后台管理系统   检测用户登录
4、后台管理系统   创建课程页面
5、服务器端      创建课程接口
6、服务器端      课程列表接口
7、后台管理系统   课程列表页面
8、服务器端      删除课程接口
9、后台管理系统   修改课程页面
10、服务器端     修改课程接口

 

第二部分 就业指导

第89天 测试 + 项目立项

1、进行测试
2、各组进行项目筛选
3、项目确定

第90天 测试 + 项目开发

1、综合测试
2、各组晨会,进行工时估算
3、各组成员进行开发
4、各组晚会,确定今日项目进度
5、组长汇报各组情况

第91天 项目开发

1、各组晨会,进行工时估算
3、各组成员进行开发
4、各组晚会,确定今日项目进度
5、组长汇报各组情况

第92天 项目开发

1、各组晨会,进行工时估算
3、各组成员进行开发
3、各组晚会,确定今日项目进度
4、组长汇报各组情况

第93天 项目开发

1、各组晨会,进行工时估算
3、各组成员进行开发
3、各组晚会,确定今日项目进度
4、组长汇报各组情况
5、各组进行项目合并,并进行测试

第94天 项目评测

1、各组自行测试
2、交换项目进行测试
3、修改bug

第95天 项目修改

1、对昨日存在问题进行测试
2、评选优秀项目
3、 简历制作

第96天 就业指导

1、讲解简历制作
2、讲解面试注意事项,以及如何提高面试效率
3、进行简历制作
4、进行简历修改

第97天 毕业答辩

1、进行毕业答辩(模拟面试)
2、简历投递

第98天 毕业答辩

1、面试复盘
2、简历投递

第99天 集中投递

1、面试复盘
2、简历投递

第100天 集中投递

1、面试复盘
2、简历投递

 

第三部分 项目实战  共20个

初级课

01 第10天 css 项目实战 游戏网站
02 第15天 移动端 项目实战 携程网站
03 第16天 Bootstrap 项目实战 博客网站
04 第29天 jQuery 项目实战 Design Studio

中级课

05 第35天 javascript进阶 项目实战 贪吃蛇游戏
06 第44天 html5游戏 项目实战 flappy bird
07 第53天 MVC框架设计 项目实战 Zeences Design
08 第57天 nodejs 项目实战 百度相册系统
09 第59天 node socket 项目实战 直播聊天系统
10 第60天 node socket 项目实战 多人在线网络联机游戏

高级课

11 第69天 微信 项目实战 个性化明信片、指南针与打卡小工具
12 第70天 微信 项目实战 德克士订餐系统
13 第74天 Vue cli 项目实战 美团电商网站
14 第77天 React Bootstrap项目实战 BootStrap官网
15 第78天 create-react-app项目实战 腾讯新闻
16 第84天 Angular6.0 Ionic3.0 项目实战 QQ客户端
17-20 第85天 毕设项目 项目实战
(17)第85天 React PC端团购网站
(18)第86天 Vuex移动端团购网站
(19)第87天 KOA+MongDB搭建搭建服务器
(20)第88天 Angular 6.0搭建后台管理系统
注:从Vue开始(包括Vue),全部为ES6语法教学

 

第四部分 十二次测试

初级课

第1套  HTML与CSS测试
第2套   JavaScript基础测试

中级课

第3套   Javascript进阶测试
第4套   H5与设计模式测试
第5套   Ajax阶段测试
第6套   NodeJS测试

高级课

第7套   CSS预编译与工程化测试
第8套   微信测试
第9套   Angular相关测试
第10套  Vue相关测试
第11套  React相关测试
第12套  综合测试


 
目前爱创课程web前端培训的学员就业薪资一般在10K-30k

视频资源下载:

爱创课堂1000集视频下载地址:

本文章版权归爱创课堂所有,转载请注明出处。

更多详细内容请访问爱创课堂官网首页:

http://www.icketang.com/