目录
CONTENTS
基 础 篇
第1章 全栈(25min)3
第2章 开发环境准备(115min)5
2.1 Node.js5
2.1.1 Node.js介绍5
2.1.2 Node.js安装6
2.1.3 NPM国内镜像源配置和CNPM的安装12
2.1.4 YARN的介绍13
2.1.5 YARN的安装13
2.2 MongoDB13
2.2.1 MongoDB介绍13
2.2.2 MongoDB安装14
2.3 VS Code23
2.3.1 VS Code介绍23
2.3.2 VS Code安装23
2.3.3 安装VS Code扩展29
2.4 Postman41
2.4.1 Postman介绍41
2.4.2 Postman下载并安装41
2.4.3 创建Postman账户44
第3章 ECMAScript 6(285min)46
3.1 ECMAScript 6介绍46
3.2 数据类型47
3.2.1 Number47
3.2.2 String51
3.2.3 Boolean52
3.2.4 null53
3.2.5 undefined53
3.2.6 Symbol53
3.2.7 BigInt54
3.3 let和const54
3.3.1 let54
3.3.2 const55
3.4 解构赋值55
3.4.1 数组的解构赋值55
3.4.2 对象的解构赋值56
3.5 函数58
3.5.1 箭头函数58
3.5.2 默认参数58
3.5.3 剩余参数58
3.5.4 解构参数59
3.6 正则59
3.7 数组61
3.7.1 扩展运算符61
3.7.2 Array.from()方法61
3.7.3 find()方法和findIndex()方法62
3.7.4 includes()方法62
3.7.5 entries()方法、keys()方法和values()方法63
3.7.6 flat()方法和 flatMap()方法64
3.7.7 sort()方法64
3.8 对象65
3.8.1 定义对象65
3.8.2 使用计算属性名动态创建属性名65
3.8.3 对象解构66
3.8.4 对象扩展运算符66
3.9 Set和Map67
3.9.1 Set67
3.9.2 Map70
3.10 遍历73
3.10.1 for…of循环73
3.10.2 forEach() 73
3.10.3 for…in74
3.10.4 Object.entries()74
3.11 Promise对象75
3.12 async和await76
3.13 class78
3.13.1 类的定义78
3.13.2 构造函数78
3.13.3 实例方法78
3.13.4 getter()和setter()方法79
3.13.5 静态方法80
3.13.6 封装80
3.13.7 继承81
3.13.8 多态82
3.14 Generator函数83
3.15 Module84
3.15.1 导出变量和函数84
3.15.2 导入模块84
3.15.3 默认导出和导入85
3.15.4 命名空间导入85
3.15.5 动态导入86
后 端 篇
第4章 Egg.js(45min)89
4.1 Egg.js是什么89
4.2 初始化Egg.js项目89
4.2.1 环境准备89
4.2.2 初始化项目89
4.3 Egg.js的目录介绍90
4.4 Egg.js的config配置91
4.4.1 配置文件91
4.4.2 配置加载顺序92
4.5 Egg.js的中间件92
4.5.1 编写中间件93
4.5.2 配置中间件93
4.5.3 使用中间件93
4.6 Egg.js的路由94
4.7 Egg.js的控制器94
4.7.1 获取请求参数95
4.7.2 将数据返给用户95
4.7.3 渲染模板95
4.7.4 控制请求流程96
4.8 Egg.js的服务97
4.9 Egg.js的插件97
4.9.1 安装插件97
4.9.2 配置插件98
4.9.3 使用插件98
第5章 RESTful API(7min)99
5.1 REST的诞生99
5.2 RESTful API的特征99
5.3 RESTful API的规范100
第6章 RESTful API项目实战(649min)103
6.1 初始化项目104
6.2 用户系统开发106
6.2.1 安装egg-mongoose插件107
6.2.2 建立用户数据表108
6.2.3 安装egg-cors插件109
6.2.4 用户注册110
6.2.5 安装egg-validate插件113
6.2.6 错误拦截中间件118
6.2.7 用户登录120
6.2.8 用户密码SHA1加密122
6.2.9 分离逻辑到Service126
6.2.10 JWT 用户鉴权131
6.2.11 获取用户列表136
6.2.12 更新用户信息139
6.2.13 获取某个用户信息144
6.2.14 删除用户145
6.3 中间件152
6.3.1 判断是否是用户153
6.3.2 判断是否是管理员156
6.3.3 判断是否是用户自己163
6.4 Postman设置全局Token166
6.5 用户头像上传到阿里云对象存储OSS166
6.5.1 阿里云对象存储OSS介绍167
6.5.2 获取阿里云对象存储OSS相关参数167
6.5.3 安装egg-oss插件175
6.5.4 创建用户上传素材数据表175
6.5.5 编写用户上传素材数据表业务逻辑177
6.5.6 封装阿里云对象存储OSS文件上传和文件删除178
6.5.7 安装Day.js180
6.5.8 上传用户头像180
6.6 完善用户注册时头像上传的问题185
6.7 IP归属地查询190
6.7.1 购买IP归属地查询接口190
6.7.2 创建IP地址库数据表保存IP归属地查询记录194
6.7.3 封装IP归属地查询195
6.7.4 在用户注册时应用IP归属地查询197
6.7.5 测试在新用户注册时是否可以获取IP地址、IP所在地199
6.8 评论系统开发199
6.8.1 创建评论数据表201
6.8.2 增加评论202
6.8.3 上传评论图片206
6.8.4 获取评论列表207
6.8.5 查看某个评论210
6.8.6 给评论点赞212
6.8.7 给某个评论点赞的用户列表215
6.8.8 更新评论216
6.8.9 删除评论219
6.9 举报评论222
6.9.1 创建举报评论222
6.9.2 我举报的评论列表226
6.10 百度AI内容审核229
6.10.1 申请百度AI内容审核接口229
6.10.2 封装内容审核233
6.11 评论管理237
6.11.1 管理员查看评论列表237
6.11.2 管理员查看某个评论239
6.11.3 管理员修改编辑评论240
6.11.4 管理员删除评论241
6.11.5 管理员查看举报评论列表243
6.11.6 管理员处理举报评论245
6.12 用户上传素材管理248
6.12.1 管理员查看素材列表248
6.12.2 管理员删除素材251
6.13 启用CSRF253
6.13.1 启用CSRF设置253
6.13.2 创建获取CSRF Token路由 253
6.13.3 编写获取CSRF Token控制器253
6.13.4 使用Postman测试获取CSRF Token254
6.14 修改API首页界面254
6.15 发布上线255
6.15.1 购买服务器256
6.15.2 购买域名 256
6.15.3 域名备案257
6.15.4 域名解析257
6.15.5 申请SSL证书263
6.15.6 服务器环境搭建268
6.15.7 在服务器部署网站271
前 端 篇
第7章 Vue.js(429min)313
7.1 基础314
7.1.1 初始化Vue.js项目314
7.1.2 模板语法315
7.1.3 指令317
7.1.4 Data选项319
7.1.5 class的绑定320
7.1.6 内联样式Style的绑定321
7.2 条件渲染322
7.2.1 v-if和v-else322
7.2.2 v-show323
7.2.3 v-if和v-show的区别324
7.3 列表渲染324
7.3.1 在v-for里使用数组324
7.3.2 在v-for里使用对象325
7.3.3 在 v-for 里使用范围值325
7.3.4 通过key维护状态326
7.3.5 在组件上使用 v-for327
7.4 事件处理327
7.4.1 监听事件328
7.4.2 事件处理方法328
7.4.3 在内联处理器中调用方法328
7.4.4 在内联事件处理器中访问事件参数329
7.5 表单输入绑定v-model329
7.6 计算属性和侦听器331
7.6.1 计算属性computed331
7.6.2 计算属性和方法332
7.6.3 侦听器watch333
7.7 组件335
7.7.1 概念335
7.7.2 组件优势336
7.7.3 注册337
7.7.4 props340
7.7.5 传递静态或动态的props341
7.7.6 单向数据流344
7.7.7 props验证346
7.7.8 事件348
7.7.9 组件的v-model349
7.7.10 插槽349
7.7.11 命名限制353
7.8 组合式API353
7.8.1 使用组合式API354
7.8.2 使用Script Setup354
7.8.3 基本语法355
7.8.4 响应式355
7.8.5 使用组件356
7.8.6 动态组件356
7.8.7 defineProps()函数和defineEmits()函数357
7.8.8 生命周期钩子函数359
7.9 状态管理Pinia363
7.9.1 安装363
7.9.2 创建Pinia实例并挂载到根元素363
7.9.3 定义 store364
7.9.4 state365
7.9.5 getter367
7.9.6 action369
7.9.7 Pinia数据持久化373
第8章 uni-app(316min)377
8.1 HBuilder X377
8.1.1 HBuilder X介绍377
8.1.2 HBuilder X下载并安装377
8.2 创建uni-app项目382
8.3 运行项目383
8.4 基础语言和开发规范387
8.5 编译器387
8.6 运行时388
8.7 目录结构389
8.8 pages.json配置389
8.8.1 新建默认模板项目389
8.8.2 创建页面389
8.8.3 完善pages.json391
8.8.4 查看globalStyle全局样式391
8.8.5 tabBar底部导航栏392
8.9 manifest.json配置393
8.10 编译器395
8.10.1 跨端兼容395
8.10.2 条件编译395
8.11 应用生命周期399
8.12 页面生命周期400
8.13 组件生命周期404
8.14 uni-app路由411
8.14.1 组件路由412
8.14.2 API路由413
8.14.3 路由传参与接收传参418
8.15 uni-app 常用API421
8.15.1 网络请求421
8.15.2 导航条425
8.15.3 交互反馈427
8.15.4 tabBar432
8.15.5 下拉刷新和上拉加载436
8.15.6 窗口440
8.15.7 数据缓存440
第9章 项目实战(893min)470
9.1 给VS Code安装扩展和配置设置470
9.1.1 安装uni-helper470
9.1.2 安装Vue Language Features (Volar)471
9.1.3 安装Vetur472
9.1.4 安装uniapp小程序扩展472
9.1.5 设置VS Code保存自动格式化473
9.2 创建项目474
9.3 运行项目474
9.3.1 安装项目依赖474
9.3.2 运行项目475
9.3.3 JSON文件不能写注释的问题475
9.3.4 修改项目名称478
9.3.5 修改API风格478
9.4 Sass480
9.4.1 Sass简介480
9.4.2 安装Sass480
9.5 引入uni-ui组件库481
9.5.1 安装uni-ui组件库481
9.5.2 easycom引入组件481
9.6 Pinia数据持久化482
9.6.1 安装Pinia482
9.6.2 安装数据持久化插件482
9.6.3 配置数据持久化插件483
9.7 数据请求封装484
9.7.1 封装request数据请求和uploadFile文件上传484
9.7.2 封装API请求487
9.7.3 配置路径别名@489
9.8 首页490
9.8.1 首页功能预览490
9.8.2 发起评论列表请求490
9.8.3 编写布局和样式,渲染数据492
9.9 评论列表组件封装500
9.9.1 安装VS Code插件uni-create-view500
9.9.2 封装组件app-list-item500
9.9.3 测试组件app-list-item504
9.9.4 单击查看评论详情504
9.9.5 查看评论图片预览505
9.10 评论二级页面506
9.10.1 创建评论二级页面506
9.10.2 评论二级页面模板代码507
9.10.3 改造app-list-item组件508
9.10.4 评论二级页面逻辑代码510
9.10.5 评论二级页面样式代码511
9.10.6 查看二级页面演示512
9.11 用户注册512
9.11.1 创建注册页面512
9.11.2 注册页面模板代码513
9.11.3 注册页面逻辑代码515
9.11.4 注册页面样式代码518
9.11.5 在Pinia状态管理中编写用户注册和上传用户头像方法519
9.11.6 注册用户519
9.12 用户登录526
9.12.1 创建登录页面526
9.12.2 登录页面模板代码526
9.12.3 登录页面逻辑代码526
9.12.4 登录页面样式代码527
9.12.5 封装app-my-login组件527
9.13 创建写评论组件531
9.14 引用写评论组件541
9.14.1 在评论首页引用app-write-comment组件541
9.14.2 在评论二级页面引用app-write-comment组件543
9.14.3 在评论列表单击回复评论545
9.14.4 评论列表限制字数551
9.15 点赞552
9.15.1 修改app-list-item组件553
9.15.2 修改评论首页555
9.15.3 修改评论二级页面558
9.16 点赞用户列表562
9.16.1 在评论二级页面增加跳转到点赞用户列表交互562
9.16.2 创建点赞用户列表页面563
9.17 评论举报565
9.17.1 在app-list-item组件中增加举报功能565
9.17.2 在状态管理封装report方法567
9.17.3 测试举报功能567
9.18 下拉刷新、上拉加载568
9.18.1 封装app-comment-list组件568
9.18.2 修改app-list-item组件样式574
9.18.3 在评论首页引入app-comment-list组件574
9.18.4 在评论二级页面引入app-comment-list组件575
9.19 百度AI检测文本、检测图片578
9.19.1 在状态管理封装百度AI检测文本、检测图片578
9.19.2 在app-write-comment组件中引入图片检测和文本检测579
9.19.3 效果演示581
9.20 页面切换动画581
9.20.1 安装uniapp插件市场的插件581
9.20.2 页面切换动画效果测试583
9.21 用户中心583
9.21.1 创建我的页面583
9.21.2 封装app-userinfo组件586
9.21.3 创建查看用户评论页面590
9.21.4 用户设置页面591
9.21.5 修改pages.json页面配置600
9.21.6 修改app-comment-list组件适配“我的”页面和“查看用户评论”页面603
9.21.7 修改app-list-item组件增加“查看用户评论”按钮607
9.22 管理中心611
9.22.1 创建管理中心页面611
9.22.2 在pages.json文件中设置管理界面下拉刷新635
9.22.3 在工具文件中增加格式化时间635
9.22.4 在浏览器查看演示636
9.23 发布上线639
9.23.1 将后端API地址修改为线上生产环境地址639
9.23.2 构建h5应用639
9.23.3 将文件上传到服务器640
9.23.4 配置Nginx的nginx.conf配置文件641
9.23.5 测试网站可访问性646
9.23.6 监控和优化646