全栈技能修炼：使用Angular和Spring Boot 打造全栈应

时间：2023-02-23 06:00:01 | 来源：营销百科

时间：2023-02-23 06:00:01 来源：营销百科

全栈技能修炼：使用Angular和Spring Boot 打造全栈应用目录：第1章 技术的选型和环境搭建 1

1.1 技术选型 1

1.1.1 前端框架选型 2

1.1.2 后端框架选型 3

1.1.3 数据库选型 3

1.2 环境搭建 5

1.2.1 基础开发环境安装 5

1.2.2 IDE 的选择 7

1.2.3 字体的选择 8

1.2.4 定义通用的代码格式 9

1.3 工程项目的结构 10

1.3.1 前端项目 10

1.3.2 后端项目 13

1.3.3 整体项目工程的文件结构 14

第2章 使用Angular快速构造前端原型 17

2.1 Angular 基础概念 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 模板驱动型表单 33

2.1.8 响应式表单 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 应用 83

2.4.1 什么是容器 83

2.4.2 安装 Docker 84

2.4.3 镜像仓库加速 85

2.4.4 创建 Angular 的 Docker 镜像 85

2.4.5 启动容器 87

2.4.6 使用 docker-compose 组织复杂的环境配置 88

2.4.7 使用 .dockerignore 文件 91

第3章 何谓后端 92

3.1 创建一个 Spring Boot 工程 93

3.1.1 通过 Gradle 创建 93

3.1.2 通过 Maven 创建 99

3.1.3 通过 IDE 创建 103

3.1.4 工程项目的组织 105

3.2 API 的构建可以如此简单 109

3.2.1 API 工程结构 109

3.2.2 领域对象 111

3.2.3 构造 Controller 112

3.2.4 启动服务 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 手动创建镜像 135

3.4.2 使用 Gradle 自动化 Docker 任务 137

3.4.3 使用 docker-compose 组合服务 141

3.4.4 IDEA 中的 Gradle 支持 142

3.4.5 在容器中调试 143

第4章 登录鉴权功能的构建 145

4.1 模块化和组件化 145

4.1.1 登录的领域模型构建 145

4.1.2 前端页面设计 147

4.2 响应式编程初探 166

4.2.1 不同的视角 166

4.2.2 实现一个计数器 169

4.2.3 为什么要使用 Rx 177

4.2.4 Observable 的性质 178

4.2.5 RxJS 的调试 180

4.3 前端服务层 184

4.3.1 构建'伪'服务 184

4.3.2 构建'聪明组件' 188

4.3.3 路由处理 192

4.4 完成忘记密码前端设计 194

4.4.1 使用 RxJS 打造短信验证码控件 194

4.4.2 忘记密码向导'笨组件' 199

4.4.3 忘记密码的'聪明组件' 203

第5章 构建后端API 205

5.1 HyperMedia API 与传统 API 205

5.1.1 领域对象 205

5.1.2 API的可见控制 211

5.1.3 传统的 API 实现模式 218

5.2 Spring Data 中的查询 221

5.2.1 基础概念——Repository 221

5.2.2 查询方式 223

5.2.3 复杂类型查询 226

5.2.4 自定义查询 228

5.2.5 自定义 Repository 229

5.3 Controller 的构建 230

5.3.1 改造 TaskRepo 和 UserRepo 230

5.3.2 实现 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 构建安全的 API 接口 255

5.4.1 为什么要保护 API 256

5.4.2 什么是JWT 256

5.4.3 JWT的生成和解析 259

5.4.4 权限的设计 260

5.4.5 使用 Spring Security 规划角色安全 261

5.4.6 在 Spring Boot 中启用 Spring Security 265

5.4.7 改造用户对象 266

5.4.8 构建 JWT token 工具类 268

5.4.9 如何检查任何请求的授权信息 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 响应式的 HTTP API 处理 322

6.1.1 Angular 中的 HTTP 服务 322

6.1.2 Angular 的开发环境配置 323

6.1.3 在前端服务中使用 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 实现一个简单的 HttpInterceptor 342

6.3.2 鉴权HttpInterceptor 343

6.3.3 一个日志拦截器 345

6.4 Angular 路由 346

6.4.1 基准锚链接 346

6.4.2 Router 模块的简介 347

6.4.3 获取父路由的参数 354

6.4.4 获得前一个路由 354

6.4.5 Activated Route 354

6.5 安全守卫 355

6.5.1 激活守卫 356

6.5.2 激活子路由守卫 357

6.5.3 加载守卫 358

6.5.4 退出守卫 359

6.5.5 数据预获取守卫 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 构建用户查询 API 379

7.4 Spring Boot Actuator 和数据审计 390

7.4.1 初窥审计事件 390

7.4.2 实现应用的数据审计 394

7.4.3 JaVers 和 Spring Boot 集成 396

7.5 WebSocket 实时通信服务 401

7.5.1 HTTP 和 WebSocket 的区别和联系 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 管理状态 423

8.1.1 何时需要使用 Redux 423

8.1.2 Redux 的核心概念 424

8.1.3 在 Angular 中使用 Redux 429

8.1.4 Selector——状态选择器 434

8.2 使用 Effects管理的副作用 437

8.3 使用 @ngrx/entity 提升生产效率 441

8.4 服务端渲染 446

8.4.1 Angular Universal 的工作机理 447

8.4.2 安装依赖 447

8.4.3 添加服务器端渲染模块 448

8.4.4 使用 Node.js Express 构建服务器 450

8.4.5 服务器端渲染中出现重复请求的处理 453

第9章 Spring Cloud打造微服务 455

9.1 微服务的体系架构 455

9.1.1 服务即组件 456

9.1.2 微服务架构下的组织机构变化 456

9.1.3 产品化服务 458

9.1.4 持续集成和持续发布 458

9.1.5 监控和报警 458

9.1.6 Spring Cloud 项目依赖 459

9.2 配置服务和发现服务 461

9.2.1 配置中心是什么 461

9.2.2 发现服务 465

9.3 监控服务和路由服务 472

9.3.1 Spring Boot Admin 473

9.3.2 路由服务 478

9.4 微服务的远程调用 485

9.4.1 Feign Client 485

9.4.2 负载均衡 490

附录A 常见云服务使用问题汇总 492,第1章 技术的选型和环境搭建 1

1.1 技术选型 1

1.1.1 前端框架选型 2

1.1.2 后端框架选型 3

1.1.3 数据库选型 3

1.2 环境搭建 5

1.2.1 基础开发环境安装 5

1.2.2 IDE 的选择 7

1.2.3 字体的选择 8

1.2.4 定义通用的代码格式 9

1.3 工程项目的结构 10

1.3.1 前端项目 10

1.3.2 后端项目 13

1.3.3 整体项目工程的文件结构 14

第2章 使用Angular快速构造前端原型 17

2.1 Angular 基础概念 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 模板驱动型表单 33

2.1.8 响应式表单 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 应用 83

2.4.1 什么是容器 83

2.4.2 安装 Docker 84

2.4.3 镜像仓库加速 85

2.4.4 创建 Angular 的 Docker 镜像 85

2.4.5 启动容器 87

2.4.6 使用 docker-compose 组织复杂的环境配置 88

2.4.7 使用 .dockerignore 文件 91

第3章 何谓后端 92

3.1 创建一个 Spring Boot 工程 93

3.1.1 通过 Gradle 创建 93

3.1.2 通过 Maven 创建 99

3.1.3 通过 IDE 创建 103

3.1.4 工程项目的组织 105

3.2 API 的构建可以如此简单 109

3.2.1 API 工程结构 109

3.2.2 领域对象 111

3.2.3 构造 Controller 112

3.2.4 启动服务 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 手动创建镜像 135

3.4.2 使用 Gradle 自动化 Docker 任务 137

3.4.3 使用 docker-compose 组合服务 141

3.4.4 IDEA 中的 Gradle 支持 142

3.4.5 在容器中调试 143

第4章 登录鉴权功能的构建 145

4.1 模块化和组件化 145

4.1.1 登录的领域模型构建 145

4.1.2 前端页面设计 147

4.2 响应式编程初探 166

4.2.1 不同的视角 166

4.2.2 实现一个计数器 169

4.2.3 为什么要使用 Rx 177

4.2.4 Observable 的性质 178

4.2.5 RxJS 的调试 180

4.3 前端服务层 184

4.3.1 构建'伪'服务 184

4.3.2 构建'聪明组件' 188

4.3.3 路由处理 192

4.4 完成忘记密码前端设计 194

4.4.1 使用 RxJS 打造短信验证码控件 194

4.4.2 忘记密码向导'笨组件' 199

4.4.3 忘记密码的'聪明组件' 203

第5章 构建后端API 205

5.1 HyperMedia API 与传统 API 205

5.1.1 领域对象 205

5.1.2 API的可见控制 211

5.1.3 传统的 API 实现模式 218

5.2 Spring Data 中的查询 221

5.2.1 基础概念——Repository 221

5.2.2 查询方式 223

5.2.3 复杂类型查询 226

5.2.4 自定义查询 228

5.2.5 自定义 Repository 229

5.3 Controller 的构建 230

5.3.1 改造 TaskRepo 和 UserRepo 230

5.3.2 实现 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 构建安全的 API 接口 255

5.4.1 为什么要保护 API 256

5.4.2 什么是JWT 256

5.4.3 JWT的生成和解析 259

5.4.4 权限的设计 260

5.4.5 使用 Spring Security 规划角色安全 261

5.4.6 在 Spring Boot 中启用 Spring Security 265

5.4.7 改造用户对象 266

5.4.8 构建 JWT token 工具类 268

5.4.9 如何检查任何请求的授权信息 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 响应式的 HTTP API 处理 322

6.1.1 Angular 中的 HTTP 服务 322

6.1.2 Angular 的开发环境配置 323

6.1.3 在前端服务中使用 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 实现一个简单的 HttpInterceptor 342

6.3.2 鉴权HttpInterceptor 343

6.3.3 一个日志拦截器 345

6.4 Angular 路由 346

6.4.1 基准锚链接 346

6.4.2 Router 模块的简介 347

6.4.3 获取父路由的参数 354

6.4.4 获得前一个路由 354

6.4.5 Activated Route 354

6.5 安全守卫 355

6.5.1 激活守卫 356

6.5.2 激活子路由守卫 357

6.5.3 加载守卫 358

6.5.4 退出守卫 359

6.5.5 数据预获取守卫 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 构建用户查询 API 379

7.4 Spring Boot Actuator 和数据审计 390

7.4.1 初窥审计事件 390

7.4.2 实现应用的数据审计 394

7.4.3 JaVers 和 Spring Boot 集成 396

7.5 WebSocket 实时通信服务 401

7.5.1 HTTP 和 WebSocket 的区别和联系 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 管理状态 423

8.1.1 何时需要使用 Redux 423

8.1.2 Redux 的核心概念 424

8.1.3 在 Angular 中使用 Redux 429

8.1.4 Selector——状态选择器 434

8.2 使用 Effects管理的副作用 437

8.3 使用 @ngrx/entity 提升生产效率 441

8.4 服务端渲染 446

8.4.1 Angular Universal 的工作机理 447

8.4.2 安装依赖 447

8.4.3 添加服务器端渲染模块 448

8.4.4 使用 Node.js Express 构建服务器 450

8.4.5 服务器端渲染中出现重复请求的处理 453

第9章 Spring Cloud打造微服务 455

9.1 微服务的体系架构 455

9.1.1 服务即组件 456

9.1.2 微服务架构下的组织机构变化 456

9.1.3 产品化服务 458

9.1.4 持续集成和持续发布 458

9.1.5 监控和报警 458

9.1.6 Spring Cloud 项目依赖 459

9.2 配置服务和发现服务 461

9.2.1 配置中心是什么 461

9.2.2 发现服务 465

9.3 监控服务和路由服务 472

9.3.1 Spring Boot Admin 473

9.3.2 路由服务 478

9.4 微服务的远程调用 485

9.4.1 Feign Client 485

9.4.2 负载均衡 490

附录A 常见云服务使用问题汇总 492