Vue.js前端開發(fā)基礎(chǔ)與項目實戰(zhàn)

第 1篇 基礎(chǔ)準備篇
第 1章 關(guān)于前端開發(fā)你需要知道的事．． 02
1．1 網(wǎng)頁開發(fā)的前世今生． 02
1．1．1 是否還記得曾經(jīng)的前端開發(fā) ． 02
1．1．2 大前端時代的來臨． 03
1．2 MVC、MVP、MVVM 傻傻分不清楚．． 05
1．2．1 MVC 小解． 05
1．2．2 MVP 小解． 06
1．2．3 MVVM 小解 06
1．2．4 三者的區(qū)別和優(yōu)劣． 08
1．3 工欲善其事，必先利其器 08
1．3．1 開發(fā)者的眼——Chrome 08
1．3．2 開發(fā)者的手——VS Code．． 10
1．3．3 開發(fā)者的心——Terminal． 11
1．4 小結(jié) 12
第 2章 關(guān)于Vue．js 的一些小事． 14
2．1 從安裝開始 14
2．1．1 直接引入 14
2．1．2 腳手架的配置．． 15
2．1．3 腳手架的使用．． 16
2．2 Vue．js 初體驗． 21
2．2．1 項目文件內(nèi)容介紹． 21
2．2．2 必不可少的Helle World．． 23
2．2．3 經(jīng)典的TodoList 25
2．3 了解一些特性． 31
2．3．1 新建實例 31
2．3．2 生命周期 32
2．3．3 模板語法． 34
2．3．4 計算屬性與過濾器．． 34
2．3．5 樣式的修改．． 36
2．3．6 條件與列表渲染． 40
2．3．7 事件的處理．． 43
2．3．8 雙向綁定． 46
2．4 小結(jié) 49
第3章 組件詳解．． 51
3．1 組件概念．． 51
3．1．1 什么是組件．． 51
3．1．2 為什么要使用組件．． 52
3．2 組件創(chuàng)建．． 53
3．2．1 組件基礎(chǔ)． 53
3．2．2 組件注冊． 55
3．3 組件通信．． 55
3．3．1 父組件與子組件通信 56
3．3．2 子組件與父組件通信 58
3．3．3 子組件之間的通信．． 59
3．4 插槽 60
3．5 特殊情況．． 62
3．6 小結(jié) 65
第4章 ES6 的日常使用 66
4．1 關(guān)于ES6 你需要知道的事 66
4．1．1 ES 的發(fā)展歷史 66
4．1．2 ES6 和JS 的關(guān)系． 67
4．1．3 為什么要使用ES6 68
4．2 ES6 常用語法簡介． 70
4．2．1 Demo 的分析．． 70
4．2．2 用戶獲取數(shù)據(jù)的方法 72
4．2．3 輸出用戶輸入信息的方法．． 73
4．2．4 判斷最喜歡地點的方法． 74
4．2．5 判斷支出類型的方法 75
4．2．6 保存數(shù)據(jù)． 76
4．3 Babel 的支持．． 76
4．3．1 Babel 是什么． 76
4．3．2 Babel 文件配置．． 78
4．3．3 Babel 的實際調(diào)用 80
4．4 小結(jié) 81
第5章 項目的構(gòu)建 82
5．1 前端項目構(gòu)建——Webpack．． 82
5．1．1 Webpack 是什么．． 82
5．1．2 Webpack 的特點．． 83
5．1．3 Webpack 配置規(guī)范 83
5．1．4 Webpack 整體配置一覽．． 87
5．1．5 Webpack 使用． 88
5．1．6 Webpack4．X 的新特性 89
5．2 前端常用插件的介紹． 90
5．2．1 Axios． 90
5．2．2 Element．． 93
5．2．3 Sass．． 97
5．2．4 Esl int．． 100
5．3 后端項目構(gòu)建——Koa．． 102
5．3．1 為什么選擇Koa． 102
5．3．2 構(gòu)建Koa 項目．． 105
5．3．3 koa-router 的優(yōu)化． 106
5．4 數(shù)據(jù)庫——MySQL 108
5．4．1 MySQL 簡介．． 108
5．4．2 MySQL 的安裝 109
5．4．3 Sequelize 的使用．． 111
5．5 小結(jié)．． 114
第 2篇 項目實戰(zhàn)篇
第6章 項目分析與設(shè)計． 118
6．1 我們要做一個什么項目． 118
6．2 實現(xiàn)哪些功能，需要哪些頁面． 121
6．2．1 需求分析 121
6．2．2 頁面設(shè)計 121
6．2．3 提取公用插件．． 123
6．3 路由的分配．． 123
6．3．1 一級路由的確定 123
6．3．2 二級路由的確定 124
6．4 數(shù)據(jù)庫內(nèi)容的確定．． 125
6．4．1 根據(jù)需求確定數(shù)據(jù)表結(jié)構(gòu)． 125
6．4．2 主要字段的配置 126
6．5 小結(jié)．． 128
第7章 基礎(chǔ)頁面的開發(fā)． 129
7．1 主頁的開發(fā)．． 129
7．1．1 頁面主體header 框架開發(fā) 129
7．1．2 主頁路由配置．． 131
7．1．3 主頁header 剩余內(nèi)容開發(fā) 132
7．1．4 第三方ICON 庫的引入． 133
7．1．5 首頁主體框架開發(fā)． 134
7．1．6 首頁右側(cè)側(cè)邊欄次組件開發(fā)．． 136
7．1．7 首頁右側(cè)側(cè)邊欄主組件開發(fā)．． 138
7．1．8 主頁列表外內(nèi)容效果展示． 140
7．1．9 內(nèi)容列表表頭開發(fā)． 140
7．1．10 模擬數(shù)據(jù)獲?。?142
7．1．11 列表元素開發(fā)． 143
7．1．12 列表操作按鈕開發(fā) 145
7．1．13 列表系列組件的調(diào)用． 147
7．1．14 首頁列表效果展示 149
7．2 登錄注冊頁面的開發(fā) 150
7．2．1 確定登錄頁背景框架．． 150
7．2．2 登錄頁靜態(tài)內(nèi)容 152
7．2．3 登錄頁表單驗證等相關(guān)內(nèi)容．． 154
7．2．4 登錄頁信息提示及整體效果．． 157
7．3 注冊登錄功能實現(xiàn)．． 158
7．3．1 數(shù)據(jù)表的確定．． 158
7．3．2 用戶注冊功能實現(xiàn)． 161
7．3．3 用戶登錄登出與信息存儲． 164
7．4 小結(jié)．． 169
第8章 文章和問題的日常操作． 170
8．1 圖片和富文本的處理 170
8．1．1 富文本插件的使用． 170
8．1．2 文章編輯頁header 組件開發(fā)． 172
8．1．3 文章編輯頁主組件開發(fā) 174
8．1．4 文章編輯頁路由注冊與效果展示． 175
8．1．5 文章編輯頁發(fā)布文章方法． 176
8．1．6 圖片的上傳接口開發(fā)．． 177
8．1．7 圖片上傳前端開發(fā)． 179
8．1．8 富文本組件中的圖片上傳． 180
8．2 文章的增、刪、改、查． 182
8．2．1 文章新增頁面的跳轉(zhuǎn)．． 182
8．2．2 文章相關(guān)數(shù)據(jù)表配置．． 182
8．2．3 文章增加刪除接口的開發(fā)． 185
8．2．4 文章查詢更新接口開發(fā) 188
8．2．5 文章列表開發(fā)．． 190
8．2．6 文章詳情頁面開發(fā)． 192
8．2．7 文章跳轉(zhuǎn)鏈接修改． 195
8．3 問題的增、改 195
8．3．1 問題增加更新前端模塊開發(fā)．． 196
8．3．2 問題增加修改與header 部分修改 198
8．3．3 問題數(shù)據(jù)表新建 200
8．3．4 問題增加更新接口開發(fā) 201
8．4 小結(jié)．． 203
第9章 評論、回答和狀態(tài)的操作．． 204
9．1 問題回答的相關(guān)操作 204
9．1．1 問題詳情前端頁面開發(fā) 204
9．1．2 問題詳情前端邏輯開發(fā) 207
9．1．3 新建回答數(shù)據(jù)表 210
9．1．4 回答查找、刪除和更新接口．． 211
9．1．5 問題答案的查詢接口．． 214
9．1．6 問題回答的前端展示．． 216
9．2 評論的相關(guān)操作． 219
9．2．1 評論新建前端開發(fā)． 219
9．2．2 新建評論數(shù)據(jù)表 222
9．2．3 評論新建查找刪除接口開發(fā)．． 223
9．2．4 新建評論效果展示． 226
9．2．5 評論展示前端開發(fā)． 227
9．2．6 評論功能組件開發(fā)． 228
9．2．7 評論功能組件調(diào)用． 231
9．2．8 一級評論效果展示． 233
9．2．9 評論列表的循環(huán)調(diào)用．． 234
9．2．10 多級評論效果展示 236
9．2．11 評論個數(shù)展示． 236
9．3 狀態(tài)的相關(guān)操作． 238
9．3．1 狀態(tài)的更新． 238
9．3．2 狀態(tài)中特殊情況的處理 242
9．4 小結(jié)．． 243
第 10章 個人主頁的開發(fā)． 245
10．1 個人信息的修改 245
10．1．1 個人信息頁面的新建． 245
10．1．2 個人信息頁面查看修改接口開發(fā) 248
10．1．3 個人信息頁面的跳轉(zhuǎn)． 249
10．1．4 個人座右銘的修改 252
10．1．5 用戶頭像修改． 254
10．2 個人主頁列表開發(fā)． 258
10．2．1 列表框架的構(gòu)建．． 258
10．2．2 作者回答查詢接口開發(fā)．． 261
10．2．3 作者回答查詢接口調(diào)用．． 262
10．2．4 作者回答刪除功能開發(fā)．． 264
10．2．5 作者回答編輯功能開發(fā)．． 267
10．2．6 作者文章的查看功能開發(fā) 270
10．2．7 作者文章的刪除功能開發(fā) 272
10．2．8 作者文章的編輯功能開發(fā) 273
10．2．9 提問的列表 275
10．3 小結(jié)． 278
第 11章 項目的部署．． 279
11．1 服務(wù)器的購買與配置．． 279
11．2 服務(wù)器的連接與配置．． 280
11．2．1 服務(wù)器連接的兩種方法．． 281
11．2．2 服務(wù)器環(huán)境安裝．． 282
11．2．3 服務(wù)器數(shù)據(jù)庫詳細配置．． 283
11．2．4 服務(wù)器項目文件夾創(chuàng)建．． 286
11．3 服務(wù)部署 286
11．3．1 前端項目部署． 286
11．3．2 后端項目部署． 289
11．4 小結(jié)． 291
第 12章 總結(jié)．． 293
12．1 第 1 篇內(nèi)容回顧 293
12．2 第 2 篇內(nèi)容回顧 294
12．3 小結(jié)． 295