內容簡介
《Vue.js+Node.js全棧開發實戰》以掌握Web全棧開發技術為目標,以Node.js和Vue.js原生開發和項目實戰為主線,詳細介紹Node.js + Vue.js全棧開發技術。本書內容豐富、實例典型、實用性強,配套示例源碼、PPT課件。
《Vue.js+Node.js全棧開發實戰》共分14章,內容包括Node.js基礎與環境搭建,Vue.js基礎介紹與環境搭建,Node.js語法基礎,Node.js中的包管理,Node.js檔案操作,Node.js網路開發,Node.js資料庫開發,Vue.js數據、方法與生命周期,Vue.js模板語法,Vue.js樣式綁定,Vue.js組件基礎,Vue.js路由,基於Vue.js+Node.js+MySQL實現學生成績管理系統開發,基於Vue.js+Node.js+jsonp實現城市信息查詢系統開發。
《Vue.js+Node.js全棧開發實戰》適合Node.js+Vue.js全棧開發的初學者、Node.js後端開發人員、Vue前端開發人員、Web套用後端開發人員、Web全棧開發人員,也適合作為高等院校或高職高專Web全棧開發課程的教材和教學參考書。
作者簡介
王金柱,擁有10多年豐富的IT從業經歷,對JavaScript、Vue.js、jQuery、Node.js、React等Web前端開發有著獨到的經驗,精通Python、Java與PHP等程式語言。曾從事過多家大型央企與上市公司的企業級Web套用系統開發工作。創作過多本前端、後端開發類的圖書,部分包括《
HTML5移動網站與App開發實戰》《Vue.js+Node.js全棧開發實戰》《Netty實戰》《
React.js 16從入門到實戰》。
圖書目錄
目 錄
第1章 Node.js基礎與環境搭建 1
1.1 Node.js基礎 1
1.1.1 Node.js簡介 1
1.1.2 Node.js的發展歷史 2
1.1.3 Node.js組織架構 3
1.1.4 Node.js的特點 4
1.1.5 Node.js套用場景 6
1.1.6 Node.js在國內的發展 6
1.2 搭建Node.js開發環境 7
1.2.1 Windows 10系統下安裝部署Node.js開發環境 7
1.2.2 測試Node.js開發環境 10
1.2.3 通過Node.js運行JavaScript檔案 12
1.3 通過Visual Studio Code開發Node套用 12
1.3.1 通過Visual Studio Code開發和管理代碼 13
1.3.2 通過Webpack構建Node應用程式架構 18
1.3.3 通過Visual Studio Code開發調試Node套用 20
第2章 Vue.js基礎介紹與環境搭建 33
2.1 Vue.js基礎 33
2.1.1 Vue.js簡介 33
2.1.2 Vue.js發展歷史 34
2.1.3 Vue.js與MVVM架構模型 34
2.1.4 雙向數據綁定 35
2.1.5 Vue.js特點 35
2.2 Vue.js快速開發環境 35
2.2.1 直接通過<script>引入本地Vue.js 36
2.2.2 通過CDN方式引入Vue.js 37
2.2.3 兼容ES Module的方式 38
2.3 Vue.js腳手架開發環境 40
2.3.1 安裝Vue.js腳手架並創建Vue項目 40
2.3.2 通過Vue.js腳手架啟動開發伺服器 41
2.3.3 Vue.js腳手架項目初探 42
2.3.4 通過Vue.js腳手架進行發布 44
2.3.5 通過Visual Studio Code開發調試Vue.js項目 46
第3章 Node.js語法基礎 52
3.1 JavaScript語法 52
3.1.1 變數 52
3.1.2 注釋 54
3.1.3 數據類型 55
3.1.4 函式 56
3.1.5 閉包 58
3.2 命名規範與編程規範 59
3.2.1 命名規範 59
3.2.2 編程規範 60
3.3 Node.js的控制台console 61
3.3.1 console對象下的各種方法 61
3.3.2 console.log()方法 62
3.3.3 console.info()、console.warn()和console.error()方法 63
3.3.4 console.dir()方法 63
3.3.5 console.time()和console.timeEnd()方法 64
3.3.6 console.trace()方法 65
第4章 Node.js中的包管理 66
4.1 npm介紹 66
4.1.1 npm常用命令 66
4.1.2 package.json檔案 69
4.2 模組載入原理與載入方式 70
4.2.1 require導入模組 70
4.2.2 exports導出模組 71
4.3 Node.js核心模組 72
4.3.1 http模組—創建HTTP伺服器、客戶端 72
4.3.2 url模組——URL地址處理 76
4.3.3 querystring模組——查詢字元串處理 77
4.4 Node.js常用模組 78
4.4.1 util模組——實用工具 78
4.4.2 path模組——路徑處理 79
4.4.3 dns模組 80
第5章 Node.js檔案操作 82
5.1 Node.js檔案系統介紹 82
5.1.1 同步和異步 82
5.1.2 fs模組中的類和檔案的基本信息 84
5.1.3 檔案路徑 85
5.2 基本檔案操作 86
5.2.1 打開檔案 86
5.2.2 關閉檔案 87
5.2.3 讀取檔案 88
5.2.4 寫入檔案 89
5.3 其他檔案操作 90
第6章 Node.js網路開發 93
6.1 構建TCP伺服器 93
6.1.1 使用Node.js創建TCP伺服器 93
6.1.2 監聽客戶端的連線 94
6.1.3 查看伺服器監聽的地址 96
6.1.4 連線伺服器的客戶端數量 97
6.1.5 獲取客戶端傳送的數據 97
6.1.6 傳送數據給客戶端 98
6.2 構建TCP客戶端 100
6.2.1 使用Node.js創建TCP客戶端 100
6.2.2 連線TCP伺服器 101
6.2.3 獲取從TCP伺服器傳送的數據 101
6.2.4 向TCP伺服器傳送數據 102
6.3 構建HTTP伺服器 103
6.3.1 創建HTTP伺服器 103
6.3.2 HTTP伺服器的路由控制 104
6.4 利用UDP協定傳輸數據與傳送訊息 106
6.4.1 創建UDP伺服器 106
6.4.2 創建UDP客戶端 109
第7章 Node.js資料庫開發 111
7.1 使用mongoose連線MongoDB 111
7.1.1 MongoDB介紹 111
7.1.2 連線MongoDB 113
7.1.3 操作MongoDB 114
7.2 直接連線MongoDB 119
7.2.1 使用node-mongodb-native連線MongoDB 119
7.2.2 使用node-mongodb-native操作MongoDB 120
7.3 連線MySQL 127
7.3.1 MySQL介紹 127
7.3.2 Node.js連線MySQL 130
7.3.3 Node.js操作MySQL 131
第8章 Vue.js數據、方法與生命周期 134
8.1 Vue.js數據 134
8.1.1 Vue.js數據同步 134
8.1.2 Vue.js數據凍結 138
8.1.3 Vue.js實例property屬性 141
8.2 Vue.js方法 143
8.2.1 觀察屬性方法 144
8.2.2 事件觸發方法 150
8.2.3 自定義事件方法 151
8.3 Vue.js生命周期 155
8.3.1 Vue.js生命周期圖示 155
8.3.2 Vue.js生命周期鉤子 157
第9章 Vue.js模板語法 166
9.1 Vue.js模板語法介紹 166
9.2 Vue.js插值 166
9.2.1 文本插值 167
9.2.2 原始HTML插值 168
9.2.3 使用JavaScript表達式 169
9.3 Vue.js指令 171
9.3.1 Vue指令概述 171
9.3.2 v-if條件表達式指令 172
9.3.3 v-show顯示指令 175
9.3.4 使用<template>元素渲染分組 177
9.3.5 v-for循環指令 180
9.4 Vue.js指令參數 183
9.4.1 Vue.js指令接收參數 183
9.4.2 Vue.js指令接收動態參數 184
9.4.3 通過Vue.js指令動態參數改變元素類型 187
9.5 Vue.js指令修飾符 189
9.5.1 Vue.js指令prevent修飾符 189
9.5.2 Vue.js指令stop修飾符 193
9.5.3 Vue.js指令once修飾符 195
9.6 Vue.js指令縮寫 197
9.7 Vue.js數據雙向綁定 201
9.7.1 v-model指令原理 201
9.7.2 .lazy修飾符 205
9.7.3 .number修飾符 207
9.7.4 .trim修飾符 210
9.8 Vue.js計算屬性 212
第10章 Vue.js樣式綁定 215
10.1 Vue.js綁定HTML Class 215
10.1.1 綁定靜態Class 215
10.1.2 綁定動態Class 217
10.1.3 綁定多個Class 220
10.2 通過數組語法綁定Class 222
10.3 Vue.js綁定HTML Style 224
10.3.1 綁定靜態Style 224
10.3.2 綁定Style對象 226
10.3.3 綁定多重值的Style 227
10.4 通過計算屬性綁定樣式 227
第11章 Vue.js組件基礎 230
11.1 Vue.js全局組件 230
11.2 Vue.js局部組件 232
11.3 通過Prop向子組件傳遞數據 234
第12章 Vue.js路由 238
12.1 安裝vue-router庫的方法 238
12.2 基於vue-router庫開發單頁面套用 239
12.3 基於vue-router庫實現動態路由 240
第13章 項目實戰:基於Vue.js+Node.js+MySQL實現學生成績管理系統 243
13.1 學生成績管理系統組織架構設計 243
13.2 構建項目套用框架 244
13.3 後台數據結構 245
13.4 功能模組組件設計 246
13.5 功能模組路由設計 256
13.6 功能模組後台服務設計 257
13.7 測試學生信息管理系統 261
第14章 項目實戰:基於Vue.js+Node.js+jsonp實現城市信息查詢系統 264
14.1 全國城市信息查詢系統組織架構設計 264
14.2 構建項目套用框架 265
14.3 後台數據獲取方式 265
14.4 功能模組組件設計 266
14.5 功能模組路由設計 270
14.6 測試全國城市信息查詢系統 271