Vue.js+Node.js開發(fā)實戰(zhàn)：從入門到項目上線

第1章  開發(fā)一個網(wǎng)站的準備  1
1.1  如何從零開始建設(shè)一個網(wǎng)站     1
1.1.1  網(wǎng)站建設(shè)流程  1
1.1.2  網(wǎng)站開發(fā)技術(shù)和工具      2
1.2  步：購買一個域名     3
1.2.1  域名簡介   4
1.2.2  如何通過阿里云購買域名     5
1.3  第二步：域名的備案和解析     8
1.3.1  域名的實名認證和備案  8
1.3.2  域名相關(guān)解析  9
1.4  第三步：購買一臺服務(wù)器 10
1.4.1  云服務(wù)器   10
1.4.2  服務(wù)器的后臺管理  11
1.5  小結(jié)與練習(xí)  13
1.5.1  小結(jié)   13
1.5.2  練習(xí)   13
第2章  Node.js Vue.js項目開發(fā)基礎(chǔ)    14
2.1  Node.js簡介 14
2.1.1  Node.js的前世今生 14
2.1.2  在Windows中安裝Node.js   15
2.1.3  在Linux中安裝Node.js 18
2.1.4  個Node.js示例——Hello World   20
2.2  Node.js后端框架Express  21
2.2.1  Express的發(fā)展 21
2.2.2  Express的安裝 23
2.2.3  Express項目示例——Hello World       25
2.2.4  RESTful API規(guī)范    25
2.3  頁面顯示框架Vue.js  27
2.3.1  Vue.js簡介       27
2.3.2  Vue.js的安裝   28
2.3.3  用Vue.js編寫Hello World——CDN方式   29
2.3.4  用Vue.js編寫Hello World——Webpack方式    30
2.3.5  其他頁面顯示框架  34
2.4  JavaScript代碼編寫——IDE的選擇       35
2.4.1  編寫基礎(chǔ)的JavaScript代碼   35
2.4.2  JavaScript開發(fā)利器——WebStorm      37
2.5  小結(jié)與練習(xí)  38
2.5.1  小結(jié)   38
2.5.2  練習(xí)   38
第3章  項目開發(fā)準備      39
3.1  初識數(shù)據(jù)庫  39
3.1.1  數(shù)據(jù)庫簡介      39
3.1.2  SQL數(shù)據(jù)庫和NoSQL數(shù)據(jù)庫      40
3.2  MongoDB介紹   41
3.2.1  為什么選擇MongoDB    42
3.2.2  在Windows中安裝MongoDB      43
3.2.3  在Linux中安裝MongoDB    44
3.3  Redis簡介    46
3.3.1  為什么選擇Redis    46
3.3.2  在Windows中安裝Redis      47
3.3.3  在Linux中安裝Redis    49
3.4  版本控制     51
3.4.1  版本控制簡介  51
3.4.2  Git和GitHub簡介  51
3.4.3  安裝和使用Git 54
3.5  測試工具     57
3.5.1  瀏覽器自帶的開發(fā)者工具     57
3.5.2  Postman插件    59
3.6  小結(jié)與練習(xí)  61
3.6.1  小結(jié)   61
3.6.2  練習(xí)   62
第4章  項目后臺技術(shù)Express 63
4.1  開發(fā)Express應(yīng)用程序      63
4.1.1  Express應(yīng)用程序生成器 63
4.1.2  Express提供的路由 66
4.1.3  使用Express托管靜態(tài)文件   68
4.2  Express和數(shù)據(jù)庫交互       70
4.2.1  連接MongoDB數(shù)據(jù)庫   70
4.2.2  使用對象模型驅(qū)動連接MongoDB       72
4.2.3  如何定義模型  73
4.2.4  Node.js和Redis集成     74
4.3  Express高級應(yīng)用       75
4.3.1  Express中的中間件 75
4.3.2  Express錯誤處理    79
4.4  小結(jié)與練習(xí)  81
4.4.1  小結(jié)   81
4.4.2  練習(xí)   81
第5章  項目前端開發(fā)之Vue.js基礎(chǔ)知識     82
5.1  Vue.js開發(fā)基礎(chǔ)  82
5.1.1  安裝Vue.js與Webpack  82
5.1.2  Webpack常用配置詳解  85
5.1.3  Vue.js條件渲染       89
5.1.4  Vue.js列表渲染       90
5.1.5  Vue.js輸入監(jiān)聽       91
5.1.6  Vue.js事件處理——v-on綁定      94
5.2  Vue.js的生命周期      97
5.2.1  生命周期與鉤子函數(shù)      97
5.2.2  演示Vue.js的生命周期  99
5.3  Vue.js的模板語法      100
5.3.1  文本   101
5.3.2  JavaScript表達式    103
5.3.3  v-bind綁定動態(tài)屬性      104
5.4  Vue.js的組件化  105
5.4.1  組件化簡介      105
5.4.2  組件的創(chuàng)建      106
5.4.3  組件的注冊      106
5.4.4  組件間的數(shù)據(jù)傳遞  109
5.4.5  監(jiān)聽子組件事件      111
5.4.6  通過插槽分發(fā)內(nèi)容  114
5.5  小結(jié)與練習(xí)  116
5.5.1  小結(jié)   116
5.5.2  練習(xí)   116
第6章  Vue.js高級應(yīng)用   117
6.1  Vue.js的vue-router庫       117
6.1.1  Vue.js的頁面路由實現(xiàn)   117
6.1.2  使用vue-cli初始化Vue.js項目    118
6.1.3  安裝和配置vue-router    122
6.1.4  動態(tài)路由匹配  123
6.1.5  路由嵌套   126
6.1.6  路由跳轉(zhuǎn)   128
6.1.7  導(dǎo)航守衛(wèi)   131
6.2  Vue.js的狀態(tài)管理庫Vuex 132
6.2.1  狀態(tài)管理與store模式    133
6.2.2  使用Vuex的情形    133
6.2.3  在Vue.js組件中獲取Vuex狀態(tài)和Getter對象   135
6.2.4  更新Vuex中的store       138
6.2.5  Vuex模塊的劃分     142
6.3  Vue UI庫     143
6.3.1  Element UI庫   143
6.3.2  Ant Design of Vue UI庫 144
6.3.3  iView UI庫      145
6.4  小結(jié)與練習(xí)  146
6.4.1  小結(jié)   146
6.4.2  練習(xí)   146
第7章  項目需求分析和功能說明  147
7.1  內(nèi)容發(fā)布網(wǎng)站的需求分析 147
7.1.1  系統(tǒng)設(shè)計需求和技術(shù)說明     147
7.1.2  后端接口需求  148
7.1.3  前端頁面需求  149
7.2  項目策劃和功能設(shè)計 150
7.2.1  項目功能策劃  150
7.2.2  項目模塊劃分  150
7.2.3  項目后端API路由定義  151
7.2.4  項目前端頁面路由定義  152
7.3  項目原型圖和流程圖 153
7.4  小結(jié)與練習(xí)  154
7.4.1  小結(jié)   154
7.4.2  練習(xí)   154
第8章  項目后端API開發(fā)      155
8.1  開發(fā)前的準備工作     155
8.1.1  初始化項目      155
8.1.2  連接數(shù)據(jù)庫      156
8.1.3  配置服務(wù)應(yīng)用列表  161
8.2  通用API開發(fā)     164
8.2.1  獲取頁面導(dǎo)航欄的API開發(fā)  164
8.2.2  獲取底部詳細內(nèi)容的API開發(fā)     167
8.2.3  獲取友情鏈接的API開發(fā)     168
8.2.4  獲取首頁輪播圖的API開發(fā)  169
8.2.5  獲取熱點文章列表內(nèi)容的API開發(fā)     171
8.2.6  獲取文章列表的API開發(fā)     173
8.2.7  獲取文章詳情的API開發(fā)     175
8.2.8  獲取文章評論的API開發(fā)     177
8.2.9  獲取分類內(nèi)容的API開發(fā)     178
8.2.10  記錄文章瀏覽量的API開發(fā)       180
8.3  用戶權(quán)限相關(guān)API開發(fā)     182
8.3.1  用戶模塊開發(fā)前的準備工作  182
8.3.2  用戶評論文章的API開發(fā)     183
8.3.3  獲取用戶資料的API開發(fā)     185
8.3.4  修改用戶資料的API開發(fā)     187
8.3.5  發(fā)送私信的API開發(fā)     189
8.3.6  獲取私信列表的API開發(fā)     191
8.3.7  獲取私信的API開發(fā)     192
8.3.8  用戶注冊的API開發(fā)     194
8.3.9  用戶登錄的API開發(fā)     196
8.3.10  文章分類列表的API開發(fā)   199
8.3.11  文章“點贊”和“踩”功能的API開發(fā)   201
8.3.12  文章收藏功能的API開發(fā)   202
8.3.13  獲取收藏文章列表的API開發(fā)   203
8.4  后臺管理相關(guān)API開發(fā)     204
8.4.1  文章添加和修改的API開發(fā)  205
8.4.2  文章發(fā)布和刪除的API開發(fā)  208
8.4.3  添加和修改分類的API開發(fā)  210
8.4.4  獲取全部用戶列表的API開發(fā)     211
8.4.5  封停用戶的API開發(fā)     213
8.4.6  修改首頁輪播內(nèi)容的API開發(fā)     214
8.4.7  修改導(dǎo)航內(nèi)容的API開發(fā)     216
8.4.8  修改底部內(nèi)容的API開發(fā)     217
8.4.9  修改友情鏈接內(nèi)容的API開發(fā)     218
8.4.10  其他權(quán)限判斷 220
8.5  小結(jié)與練習(xí)  221
8.5.1  小結(jié)   221
8.5.2  練習(xí)   222
第9章  前端頁面開發(fā)      223
9.1  項目前期準備     223
9.1.1  創(chuàng)建新項目      223
9.1.2  選擇UI庫 224
9.1.3  安裝HTTP請求庫  225
9.2  主要頁面的開發(fā)  228
9.2.1  主頁   228
9.2.2  文章總列表頁  235
9.2.3  文章分類結(jié)果頁      237
9.2.4  文章詳情頁      239
9.3  用戶相關(guān)頁面及權(quán)限的開發(fā)     244
9.3.1  登錄頁      244
9.3.2  注冊頁      247
9.3.3  用戶信息頁      251
9.3.4  在導(dǎo)航欄中增加用戶信息     256
9.3.5  私信功能   258
9.3.6  文章評論功能  262
9.3.7  文章的收藏和點贊功能  265
9.3.8  查看所有收藏  267
9.4  管理員頁面的開發(fā)     269
9.4.1  管理員頁面路由設(shè)置      269
9.4.2  文章編輯頁      271
9.4.3  文章管理頁      275
9.4.4  用戶管理頁      278
9.5  小結(jié)與練習(xí)  280
9.5.1  小結(jié)   280
9.5.2  練習(xí)   280
第10章  網(wǎng)站的部署和上線    281
10.1  遠程連接服務(wù)器       281
10.1.1  虛擬機簡介    281
10.1.2  虛擬機的安裝 282
10.1.3  遠程連接云服務(wù)器或虛擬機       288
10.2  搭建服務(wù)器部署環(huán)境       290
10.2.1  配置pm2 290
10.2.2  構(gòu)建用于發(fā)布的Vue.js程序       293
10.2.3  使用Nginx部署靜態(tài)文件    294
10.3  在服務(wù)器端部署代碼       295
10.3.1  服務(wù)器的防火墻設(shè)置    295
10.3.2  使用Git部署代碼 296
10.4  網(wǎng)站優(yōu)化常用方法   299
10.4.1  優(yōu)化應(yīng)用 299
10.4.2  使用nw.js打包項目     300
10.5  小結(jié)與練習(xí)       302
10.5.1  小結(jié) 302
10.5.2  練習(xí) 303
附錄A  檢測Node.js是否支持ES 6的語法  304
附錄B  npm安裝過慢的解決方法  306