Vue.js項目開發(fā)實戰(zhàn)

目錄
前言
第1篇 背景知識
第1章 初探網(wǎng)頁開發(fā)2
1.1 網(wǎng)頁開發(fā)歷史2
1.1.1 傳統(tǒng)網(wǎng)頁開發(fā)3
1.1.2 新前端網(wǎng)頁開發(fā)5
1.2 MVVM風(fēng)格開發(fā)框架6
1.2.1 為什么會出現(xiàn)MVVM6
1.2.2 MVVM架構(gòu)的最佳實踐7
1.2.3 MVC、MVP和MVVM開發(fā)模式對比8
1.3 Vue.js來了9
1.4 Vue.js的安裝10
1.4.1 使用獨立版本11
1.4.2 使用CDN安裝13
1.4.3 “npm大法”安裝15
1.4.4 使用Chrome瀏覽器測試Vue.js的雙向綁定17
1.5 Vue.js的主要特性19
1.5.1 組件19
1.5.2 模板22
1.5.3 響應(yīng)式設(shè)計22
1.5.4 過渡效果22
1.5.5 單文件組件24
1.6 小結(jié)與練習(xí)24
1.6.1 小結(jié)24
1.6.2 練習(xí)25
第2篇 項目設(shè)計
第2章 開啟Vue.js之旅的準(zhǔn)備工作28
2.1 JavaScript運行與開發(fā)環(huán)境28
2.1.1 神奇的包管理器——npm28
2.1.2 好用的瀏覽器——Chrome31
2.1.3 Vue.js的調(diào)試神器——vue-devtools34
2.1.4 非常智能的IDE——WebStorm36
2.2 認(rèn)識ECMAScript 6（ES 6）39
2.2.1 ES 6的前世今生39
2.2.2 為什么要使用ES 640
2.3 ES 6的一些常用語法40
2.3.1 Default Parameters（默認(rèn)參數(shù)）40
2.3.2 Template Literals（模板文本）41
2.3.3 Multi-line Strings（多行字符串）41
2.3.4 Destructuring Assignment（解構(gòu)賦值）42
2.3.5 Enhanced Object Literals（增強的對象文本）42
2.3.6 Arrow Functions（箭頭函數(shù)）43
2.3.7 Promise實現(xiàn)44
2.3.8 塊作用域構(gòu)造let45
2.3.9 Classes（類）46
2.3.10 Modules（模塊）46
2.4 使用Babel進(jìn)行ES 6的轉(zhuǎn)化47
2.4.1 安裝Babel48
2.4.2 使用Babel48
2.5 精簡壓縮生產(chǎn)環(huán)境的Webpack51
2.5.1 Webpack是什么51
2.5.2 配置一個完整項目的Webpack52
2.5.3 不得不說的新版Webpack 456
2.6 小結(jié)與練習(xí)59
2.6.1 小結(jié)59
2.6.2 練習(xí)59
第3章 從一個電影網(wǎng)站項目學(xué)習(xí)Vue.js60
3.1 快速構(gòu)建第一個Vue.js程序60
3.1.1 通過CLI構(gòu)建應(yīng)用60
3.1.2 輸出Hello world！63
3.1.3 開發(fā)環(huán)境與生產(chǎn)環(huán)境66
3.2 電影網(wǎng)站的設(shè)計70
3.2.1 網(wǎng)站的功能設(shè)計70
3.2.2 網(wǎng)站的路由設(shè)計71
3.2.3 網(wǎng)站的頁面設(shè)計72
3.3 電影網(wǎng)站的技術(shù)選擇73
3.3.1 服務(wù)的堅實后盾——數(shù)據(jù)庫73
3.3.2 數(shù)據(jù)的搬運和加工——服務(wù)器端74
3.4 小結(jié)與練習(xí)74
3.4.1 小結(jié)74
3.4.2 練習(xí)75
第4章 電影網(wǎng)站數(shù)據(jù)庫的搭建76
4.1 什么是數(shù)據(jù)庫76
4.1.1 什么是SQL76
4.1.2 什么是NoSQL78
4.1.3 兩種數(shù)據(jù)庫的對比分析79
4.2 MongoDB基礎(chǔ)入門80
4.2.1 為什么選擇MongoDB80
4.2.2 安裝MongoDB81
4.2.3 啟動MongoDB83
4.2.4 安裝MongoDB的可視化界面87
4.2.5 MongoDB的基礎(chǔ)操作90
4.3 電影網(wǎng)站數(shù)據(jù)庫的建立92
4.3.1 數(shù)據(jù)庫的分析與設(shè)計93
4.3.2 數(shù)據(jù)集的建立94
4.4 小結(jié)與練習(xí)96
4.4.1 小結(jié)96
4.4.2 練習(xí)97
第3篇 Vue.js應(yīng)用開發(fā)
第5章 電影網(wǎng)站服務(wù)器端的設(shè)計100
5.1 使用JavaScript開發(fā)后端服務(wù)100
5.1.1 神奇的Node.js100
5.1.2 什么是Express101
5.2 使用Express進(jìn)行Web開發(fā)102
5.2.1 安裝Express102
5.2.2 設(shè)計后臺服務(wù)API105
5.2.3 設(shè)計路由107
5.3 服務(wù)器測試108
5.3.1 一個測試HTTP請求的Postman插件108
5.3.2 在Chrome中安裝Postman插件109
5.3.3 使用Postman插件進(jìn)行數(shù)據(jù)測試110
5.4 Express后臺代碼編寫112
5.4.1 新建工程112
5.4.2 連接數(shù)據(jù)庫115
5.4.3 使用Supervisor監(jiān)控代碼的修改118
5.5 用戶系統(tǒng)開發(fā)119
5.5.1 注冊路由122
5.5.2 登錄路由125
5.5.3 找回密碼路由128
5.5.4 提交評論路由133
5.5.5 點贊路由135
5.5.6 下載路由137
5.5.7 發(fā)送站內(nèi)信路由138
5.5.8 接收站內(nèi)信路由141
5.6 前臺API開發(fā)143
5.6.1 顯示排行榜145
5.6.2 顯示文章列表145
5.6.3 顯示文章內(nèi)容146
5.6.4 顯示用戶個人信息147
5.7 后臺API開發(fā)148
5.7.1 添加電影148
5.7.2 刪除電影151
5.7.3 更新電影152
5.7.4 獲取所有電影153
5.7.5 獲取用戶評論154
5.7.6 審核用戶評論154
5.7.7 刪除用戶評論156
5.7.8 封停用戶157
5.7.9 更新用戶密碼159
5.7.10 顯示所有用戶160
5.7.11 管理用戶權(quán)限162
5.7.12 新增文章163
5.7.13 刪除文章165
5.7.14 新增主頁推薦166
5.7.15 刪除熱點信息168
5.8 小結(jié)與練習(xí)169
5.8.1 小結(jié)169
5.8.2 練習(xí)170
第6章 Vue.js項目開發(fā)技術(shù)解析171
6.1 Vue.js實例171
6.1.1 何為構(gòu)造器171
6.1.2 實例的屬性和方法172
6.1.3 生命周期173
6.2 Vue.js路由175
6.2.1 RESTful模式的路由175
6.2.2 安裝vue-router175
6.3 Vue.js路由配置vue-router176
6.3.1 動態(tài)路由匹配176
6.3.2 嵌套路由179
6.3.3 編程式導(dǎo)航181
6.3.4 命名路由183
6.3.5 命名視圖184
6.3.6 重定向和別名186
6.3.7 路由組件傳遞參數(shù)187
6.3.8 HTML 5 History模式188
6.4 數(shù)據(jù)獲取189
6.4.1 導(dǎo)航守衛(wèi)189
6.4.2 數(shù)據(jù)獲取193
6.5 電影網(wǎng)站項目路由設(shè)計195
6.5.1 新建Vue.js項目195
6.5.2 前臺