全棧技能修煉：使用Angular和Spring Boot 打造全棧應(yīng)用

第1章 技術(shù)的選型和環(huán)境搭建 1
1.1 技術(shù)選型 1
1.1.1 前端框架選型 2
1.1.2 后端框架選型 3
1.1.3 數(shù)據(jù)庫選型 3
1.2 環(huán)境搭建 5
1.2.1 基礎(chǔ)開發(fā)環(huán)境安裝 5
1.2.2 IDE 的選擇 7
1.2.3 字體的選擇 8
1.2.4 定義通用的代碼格式 9
1.3 工程項目的結(jié)構(gòu) 10
1.3.1 前端項目 10
1.3.2 后端項目 13
1.3.3 整體項目工程的文件結(jié)構(gòu) 14
第2章 使用Angular快速構(gòu)造前端原型 17
2.1 Angular 基礎(chǔ)概念 17
2.1.1 安裝 Angular CLI 17
2.1.2 依賴性注入 22
2.1.3 組件 27
2.1.4 指令 28
2.1.5 管道 30
2.1.6 模塊 31
2.1.7 模板驅(qū)動型表單 33
2.1.8 響應(yīng)式表單 46
2.2 Angular Material 介紹 55
2.2.1 組件類別 55
2.2.2 布局控件：Sidenav 57
2.2.3 Flex 布局和 Angular Flex-layout 60
2.2.4 封裝 Header/Footer/Sidebar 62
2.3 添加主題支持 78
2.3.1 Material Design 中對于主題的約束 79
2.3.2 主題的明與暗 79
2.3.3 Angular Material 中的主題 80
2.4 容器化 Angular 應(yīng)用 83
2.4.1 什么是容器 83
2.4.2 安裝 Docker 84
2.4.3 鏡像倉庫加速 85
2.4.4 創(chuàng)建 Angular 的 Docker 鏡像 85
2.4.5 啟動容器 87
2.4.6 使用 docker-compose 組織復(fù)雜的環(huán)境配置 88
2.4.7 使用 .dockerignore 文件 91
第3章 何謂后端 92
3.1 創(chuàng)建一個 Spring Boot 工程 93
3.1.1 通過 Gradle 創(chuàng)建 93
3.1.2 通過 Maven 創(chuàng)建 99
3.1.3 通過 IDE 創(chuàng)建 103
3.1.4 工程項目的組織 105
3.2 API 的構(gòu)建可以如此簡單 109
3.2.1 API 工程結(jié)構(gòu) 109
3.2.2 領(lǐng)域?qū)ο?111
3.2.3 構(gòu)造 Controller 112
3.2.4 啟動服務(wù) 113
3.2.5 測試 API 115
3.3 MongoDB 支撐的 API 116
3.3.1 什么是 NoSQL 116
3.3.2 MongoDB 的集成 119
3.3.3 HATEOAS 124
3.3.4 “魔法”的背后 129
3.3.5 讓后端也能熱更新 132
3.4 容器化后端 135
3.4.1 手動創(chuàng)建鏡像 135
3.4.2 使用 Gradle 自動化 Docker 任務(wù) 137
3.4.3 使用 docker-compose 組合服務(wù) 141
3.4.4 IDEA 中的 Gradle 支持 142
3.4.5 在容器中調(diào)試 143
第4章 登錄鑒權(quán)功能的構(gòu)建 145
4.1 模塊化和組件化 145
4.1.1 登錄的領(lǐng)域模型構(gòu)建 145
4.1.2 前端頁面設(shè)計 147
4.2 響應(yīng)式編程初探 166
4.2.1 不同的視角 166
4.2.2 實現(xiàn)一個計數(shù)器 169
4.2.3 為什么要使用 Rx 177
4.2.4 Observable 的性質(zhì) 178
4.2.5 RxJS 的調(diào)試 180
4.3 前端服務(wù)層 184
4.3.1 構(gòu)建“偽”服務(wù) 184
4.3.2 構(gòu)建“聰明組件” 188
4.3.3 路由處理 192
4.4 完成忘記密碼前端設(shè)計 194
4.4.1 使用 RxJS 打造短信驗證碼控件 194
4.4.2 忘記密碼向?qū)?ldquo;笨組件” 199
4.4.3 忘記密碼的“聰明組件” 203
第5章 構(gòu)建后端API 205
5.1 HyperMedia API 與傳統(tǒng) API 205
5.1.1 領(lǐng)域?qū)ο?205
5.1.2 API的可見控制 211
5.1.3 傳統(tǒng)的 API 實現(xiàn)模式 218
5.2 Spring Data 中的查詢 221
5.2.1 基礎(chǔ)概念——Repository 221
5.2.2 查詢方式 223
5.2.3 復(fù)雜類型查詢 226
5.2.4 自定義查詢 228
5.2.5 自定義 Repository 229
5.3 Controller 的構(gòu)建 230
5.3.1 改造 TaskRepo 和 UserRepo 230
5.3.2 實現(xiàn) Controller 231
5.3.3 登錄 234
5.3.4 注冊 235
5.3.5 忘記密碼步：驗證手機 236
5.3.6 忘記密碼第二步：重置密碼 244
5.3.7 API 的異常處理 246
5.4 構(gòu)建安全的 API 接口 255
5.4.1 為什么要保護 API 256
5.4.2 什么是JWT 256
5.4.3 JWT的生成和解析 259
5.4.4 權(quán)限的設(shè)計 260
5.4.5 使用 Spring Security 規(guī)劃角色安全 261
5.4.6 在 Spring Boot 中啟用 Spring Security 265
5.4.7 改造用戶對象 266
5.4.8 構(gòu)建 JWT token 工具類 268
5.4.9 如何檢查任何請求的授權(quán)信息 272
5.4.10 得到用戶信息 275
5.4.11 配置 Spring Security 277
5.4.12 使用 JWT 進行 API 訪問 292
5.5 跨域和 API 文檔 305
5.5.1 跨域解決方案——CORS 305
5.5.2 API 文檔 309
第6章 前端和API的配合 322
6.1 響應(yīng)式的 HTTP API 處理 322
6.1.1 Angular 中的 HTTP 服務(wù) 322
6.1.2 Angular 的開發(fā)環(huán)境配置 323
6.1.3 在前端服務(wù)中使用 HttpClient 327
6.1.4 更改注冊表單控件 331
6.2 RxJs進階 332
6.2.1 改造登錄表單 332
6.2.2 RxJs的高階操作符 333
6.2.3 合并操作符 339
6.3 HTTP 攔截 342
6.3.1 實現(xiàn)一個簡單的 HttpInterceptor 342
6.3.2 鑒權(quán)HttpInterceptor 343
6.3.3 一個日志攔截器 345
6.4 Angular 路由 346
6.4.1 基準錨鏈接 346
6.4.2 Router 模塊的簡介 347
6.4.3 獲取父路由的參數(shù) 354
6.4.4 獲得前一個路由 354
6.4.5 Activated Route 354
6.5 安全守衛(wèi) 355
6.5.1 激活守衛(wèi) 356
6.5.2 激活子路由守衛(wèi) 357
6.5.3 加載守衛(wèi) 358
6.5.4 退出守衛(wèi) 359
6.5.5 數(shù)據(jù)預(yù)獲取守衛(wèi) 359
第7章 后端不只是API 361
7.1 緩存 361
7.1.1 配置 Cache 362
7.1.2 常用的緩存注解 364
7.1.3 測試緩存是否生效 366
7.2 Redis 作為緩存框架 368
7.2.1 Redis 的安裝配置 369
7.2.2 在 Spring Boot 中集成 Redis 370
7.2.3 Redisson 373
7.3 使用 ElasticSearch 提升搜索性能 375
7.3.1 配置 375
7.3.2 構(gòu)建用戶查詢 API 379
7.4 Spring Boot Actuator 和數(shù)據(jù)審計 390
7.4.1 初窺審計事件 390
7.4.2 實現(xiàn)應(yīng)用的數(shù)據(jù)審計 394
7.4.3 JaVers 和 Spring Boot 集成 396
7.5 WebSocket 實時通信服務(wù) 401
7.5.1 HTTP 和 WebSocket 的區(qū)別和聯(lián)系 402
7.5.2 何時使用 WebSocket 403
7.5.3 STOMP 403
7.5.4 WebSocket 配置 404
7.5.5 WebScoket 安全 406
7.5.6 建立一個實時消息 Controller 409
7.5.7 測試 WebSocket 409
7.6 Spring Boot 的自動化測試 411
第8章 前端的工程化 422
8.1 使用 Redux 管理狀態(tài) 423
8.1.1 何時需要使用 Redux 423
8.1.2 Redux 的核心概念 424
8.1.3 在 Angular 中使用 Redux 429
8.1.4 Selector——狀態(tài)選擇器 434
8.2 使用 Effects管理的副作用 437
8.3 使用 @ngrx/entity 提升生產(chǎn)效率 441
8.4 服務(wù)端渲染 446
8.4.1 Angular Universal 的工作機理 447
8.4.2 安裝依賴 447
8.4.3 添加服務(wù)器端渲染模塊 448
8.4.4 使用 Node.js Express 構(gòu)建服務(wù)器 450
8.4.5 服務(wù)器端渲染中出現(xiàn)重復(fù)請求的處理 453
第9章 Spring Cloud打造微服務(wù) 455
9.1 微服務(wù)的體系架構(gòu) 455
9.1.1 服務(wù)即組件 456
9.1.2 微服務(wù)架構(gòu)下的組織機構(gòu)變化 456
9.1.3 產(chǎn)品化服務(wù) 458
9.1.4 持續(xù)集成和持續(xù)發(fā)布 458
9.1.5 監(jiān)控和報警 458
9.1.6 Spring Cloud 項目依賴 459
9.2 配置服務(wù)和發(fā)現(xiàn)服務(wù) 461
9.2.1 配置中心是什么 461
9.2.2 發(fā)現(xiàn)服務(wù) 465
9.3 監(jiān)控服務(wù)和路由服務(wù) 472
9.3.1 Spring Boot Admin 473
9.3.2 路由服務(wù) 478
9.4 微服務(wù)的遠程調(diào)用 485
9.4.1 Feign Client 485
9.4.2 負載均衡 490
附錄A 常見云服務(wù)使用問題匯總 492