- 第一階段
- 第二階段
- 第三階段
- 第四階段
- 第五階段
階段1.前端核心基礎
01.HTML +_CSS核心
DIV + CSS布局
CSS文本屬性
CSS基本選擇器
CSS復合選擇器
盒子模型原理
盒模型內邊距
盒模型外邊距
盒模型外邊距合并
盒模型外邊距塌陷
浮動布局
清除浮動的幾種方式
相對定位布局
絕對定位布局
固定定位布局
圖標字體的下載和應用
PhotoShop的使用及切圖
icon圖標制作及使用
02.JavaScript基礎
JS 基本語法與變量
JS 基本數據類型
JS 基本運算符與表達式
JS 變量格式轉換
if 語句 循環語句
函數創建與使用
數組 array
聲明與使用 數組遍歷
MAP（字典）
DOM 定義
DOM 訪問節點
DOM 的節點操作
網頁加載事件
鼠標操作事件
常用事件
Window、Navigator 對象 彈窗提示
計時器的使用
03.JavaScript面向對象
面向對象的基本概念
封裝、繼承、多態
聲明類，構造函數和屬性
get 取值器、
set 設值器 閉包
內建對象
JS 原型
擴展內建對象
工廠模式
正則表達式
表單驗證、表單事件
JSON 數據格式介紹 跨域
AJAX 原理
PHP 后臺交互
天氣預報界面練習
04.jQuery框架
JQuery 簡介
JQuery 語法
JQuery 選擇器
JQuery 事件
JQuery 效果
JQuery 的 DOM 操作
JQuery 遍歷
JQuery 兄弟節點等操作
JQuery 插件的使用和介紹
瀑布流插件
創可貼項目開發或者是堆糖網
JQuery 控件
廣告框 輪播圖 無縫輪播圖
Scroll 事件
JJQ AJAX 的學習
階段2.HTML5 + CSS3 + 移動端核心
01.Bootstrap+響應式
Less 基礎
響應式開發
Viewport 視口
媒體查詢
實戰項目—寵物網開發
框架的基本模板
全局 CSS 部分介紹
排版表單按鈕
bootstrap 組件
Glyphicons 字體圖標
下拉菜單 按鈕組
輸入框 導航
分頁媒體bootstrap
JQ 插件 彈出的模態框
下拉菜單 滾動監聽
PhotoShop的使用及切圖
標簽頁 折疊頁 工具提示
彈出框 輪播圖
微金所項目實戰
02.HTML5 新特性
語義化標簽
語義化標簽布局
狀態標簽
列表標簽
注釋標簽
標記標簽
input新屬性
音頻視頻
新屬性 SVG SVG+圖表
HTML5 存儲
本地緩存
離線緩存（離線記事本）
地理定位
音階導航
自定義播放器
響應式布局
媒體選擇器
03.Canvas
canvas 繪圖基礎
canvas 繪制圖形、文字、圖片
canvas 進階
canvas 封裝庫使用
Canvas簽名
Canvas圓形
Canvas圓弧
Canvas位移
Canvas縮放
Canvas旋轉
Canvas變換基點兩種形式
Canvas時鐘效果
Canvas加載圖片
Canvas飛鳥效果
Canvas線性漸變
Canvas徑向漸變
04.CSS3新特性
交集選擇器
基本屬性選擇器
包含屬性選擇器
目標偽類實現圖片切換
checked狀態偽類
自定義單選按鈕
CSS3結構類實現尺子效果
否定選擇器
CSS3結構類
CSS3結構類實現尺子效果
否定選擇器
偽元素::first-line
偽元素::first-letter
偽元素::before
CSS3項目實戰
階段3.技術專題
01.版本控制工具
SVN版本管理工具
git版本管理工具
SVN服務端常見操作
linux常見命令
創建本地倉庫
檢出、克隆本地倉庫
拉取遠程代碼
分支的操作
處理沖突實戰
svn與git對比
git中差異對比
git中版本回退
github的使用
github創建組織
github的pullRequest操作
github的issues
githubPages的使用
02.模塊化
CommonJs服務器端模塊化
CommonJs瀏覽器端模塊化
AMD模塊化
CMD模塊化
ES6模塊化分別暴露
ES6模塊化統一暴露
ES6模塊化默認暴露
模塊化暴露的本質
如何引入模塊
模塊互相引用
如何合理使用模塊化
構建工具介紹
模塊化同構建工具的配合使用
03.瀏覽器兼容性
瀏覽器內核介紹
瀏覽器版本檢測
navigator 介紹
userAgent 介紹
IE 兼容模式
IE 怪異模式
兼容模式下的事件綁定
兼容模式下 ajax 的實現
優雅降級和漸進增強
IE 各個版本 hack
前端優化和構建
npm/wekpack/bower
css圖層
圖層的合理應用
css、js阻塞
重繪重排
04.項目構建工具
Grunt的插件和API
Grunt打包
Grunt編碼規范
Grunt自動化構建
Gulp插件和API
Gulp自動化構建
Webpack工作原理
Webpack核心
Webpack的loader與plugin
Webpack模塊
webpack tree shaking
webpack代碼分離
webpack懶加載
DIY webpack配置環境
webpack打包優化
階段4.前端高級框架
01.Node.Js
Node 基礎
服務器響應 get、post
響應請求
登錄注冊請求（封裝）
npm 包管理器
熟悉中間件 中間件的應用
熟悉語句 了解機制
引用 cookie、session Cookie 簽名
封裝登錄注冊使用 cookie、session
設置存儲空間
修改后綴名
創建 express 的路由功能
監聽路由
Less變量 混合使用
數據庫原理
管理數據庫工具
Sql 語句
新聞客戶端項目實戰（前后端不分離）
02.Vue框架基礎
安裝
目錄結構
模板語法
雙向數據綁定
判斷循環
顯示隱藏
V-bind 綁定屬性
V-on @click
熟悉使用 vue 事件語法
過濾器 filteredData 交互
Get、post、jsonp 請求
引用 axios
熟悉 vue 生命周期原理機制
computed 使用場景
數據監聽 watch 使用
組件
創建組件
組件通信
03.Vue框架進階
路由 router
vuex 引用
vuex 使用場景
vue源碼分析: 數據劫持
vue源碼分析: setter,getter分析
vue源碼分析: Object.defineProperty
斷點調試
數據劫持
插值解析
指令解析
單向數據綁定
雙向數據綁定
MVVM原理圖
MVC和MVVM區別
Vue項目項目實戰：管理商城
階段5.小程序
01.小程序入門
開發者工具
項目創建
小程序項目結構目錄
小程序語法
WXML與HTML區別
WXSS與CSS區別
JS在小程序與瀏覽器中的區別
小程序在生命周期
App.js生命周期函數
page頁面生命周期函數
小程序渲染機制
小程序數據綁定方法
微信：for渲染列表的用法
微信：if與hidden的區別
setData機制
02.小程序進階與實戰
小程序常用組件
view組件
swiper組件
sroll-view組件
button組件
input組件
navigator組件
image組件
canvas組件
小程序內跳轉傳值
小程序外跳轉傳值
小程序webview傳值
小程序跳轉小程序傳值
項目實戰：在線購物商城
