智能前端技术与实践

目　　录
第 1章 开发环境配置 1
1．1 安装Anaconda3 1
1．2 安装TensorFlow 2 6
1．3 安装npm包管理工具 11
1．4 安装TensorFlow．js的相关包 14
1．5 使用WebStorm 18
1．6 使用Google浏览器 19
1．6．1 注册Chrome Web Store开发者 19
1．6．2 Google浏览器扩展程序 20
1．7 使用微信开发者工具 27
1．7．1 添加微信小程序插件 29
1．7．2 使用微信小程序插件 29
1．7．3 发布微信小程序 35
第 2章 前端开发基础 39
2．1 背景知识概述 39
2．2 HTML基础 40
2．2．1 HTML文档基本结构 41
2．2．2 常用标签 49
2．3 CSS基础 55
2．3．1 CSS的3种使用方法 55
2．3．2 CSS选择器 56
2．4 JavaScript基础 56
2．5 与Google扩展程序相关的JavaScriptAPI 58
2．6 深度学习中的JavaScript 61
2．6．1 JavaScript数据类型 61
2．6．2 JavaScript异步编程 63
2．7 微信小程序开发 67
2．7．1 微信小程序框架结构分析 68
2．7．2 页面描述文件 72
2．7．3 页面样式文件 87
2．7．4 逻辑层文件 88
2．7．5 小程序的事件系统 91
第3章 深度学习概述 95
3．1 深度学习环境 95
3．1．1 云端深度学习环境选择 95
3．1．2 本地深度学习环境搭建 104
3．2 深度学习框架 105
3．3 TensorFlow 2基础 113
3．3．1 数据类型 113
3．3．2 数值精度 115
3．3．3 操作和计算图 116
3．3．4 自动微分和梯度带 117
3．3．5 广播机制 118
3．3．6 框架概述 118
3．4 深度学习基础 119
3．4．1 BP神经网络 120
3．4．2 激活函数 121
3．4．3 softmax函数 126
3．4．4 损失函数 126
3．4．5 梯度下降算法 130
3．4．6 反向传播 132
第4章 TensorFlow．js框架详解 134
4．1 TensorFlow．js框架概述 134
4．2 TensorFlow．js低阶API详解 136
4．2．1 张量操作方法 136
4．2．2 数学运算 148
4．3 TensorFlow．js高阶API详解 153
4．3．1 构建模型 154
4．3．2 模型配置 160
4．3．3 模型训练 160
4．3．4 模型评估 160
4．3．5 模型转换 164
4．4 TensorFlow．js Vis库详解 166
4．4．1 Visor接口方法介绍 167
4．4．2 模型可视化 168
4．4．3 数据可视化 173
4．4．4 模型评价指标 175
4．5 其他API 176
4．5．1 数据操作 176
4．5．2 浏览器操作 183
4．5．3 性能优化 184
4．5．4 正则化 185
4．5．5 早停法 185
第5章 卷积神经网络 187
5．1 卷积神经网络概述 187
5．2 卷积层 188
5．3 池化层 192
5．4 轻量级的卷积神经网络 194
5．4．1 SqueezeNet 195
5．4．2 MobileNetV1 198
5．4．3 ShuffleNetV1 201
5．4．4 Xception 203
第6章 TensorFlow．js基础案例 206
6．1 线性回归 207
6．1．1 案例简介 207
6．1．2 代码实现 207
6．2 logistical回归 211
6．2．1 案例简介 211
6．2．2 代码实现 211
6．3 XOR问题 215
6．3．1 案例简介 215
6．3．2 代码实现 216
6．4 加载与应用MobileNet模型 220
6．4．1 案例简介 220
6．4．2 代码实现 220
6．5 《你画我猜》（MNIST手写数字版） 224
6．5．1 案例简介 224
6．5．2 代码实现 224
第7章 TensorFlow官方数据集实战 231
7．1 boston_housing数据集与实战案例 231
7．1．1 数据集介绍 231
7．1．2 房价预测实战 232
7．2 与CIFAR-10数据集相关的实战案例 235
7．2．1 数据集介绍 235
7．2．2 在Anaconda3 Jupyter Notebook中加载数据集 235
7．2．3 在Kaggle中导入CIFAR-10数据集 236
7．2．4 从本地导入CIFAR-10数据集 240
7．3 与CIFAR-100数据集相关的实战案例 248
7．3．1 数据集介绍 248
7．3．2 数据集展示 249
7．4 与MNIST数据集相关的实战案例 253
7．4．1 数据集介绍 253
7．4．2 数据集展示 253
7．5 与Fashion_MNIST数据集相关实战案例 255
7．5．1 数据集介绍 255
7．5．2 数据集加载 256
7．6 基于CNN的MNIST手写数字识别 257
7．6．1 自定义网络模型 257
7．6．2 微信小程序部署 261
第8章 基于CNN的常见水果分类识别 266
8．1 数据集介绍 266
8．2 数据集标注 269
8．3 数据预处理 277
8．3．1 数据文件读取 277
8．3．2 文件解码 278
8．3．3 文件数据类型转换 278
8．3．4 数据归一化 280
8．4 模型概览 282
8．5 模型设计 284
8．6 模型配置 284
8．7 模型训练 285
8．8 模型评估 286
8．9 模型部署 289
8．9．1 在微信小程序中加载模型 289
8．9．2 在Google浏览器中加载模型 291
第9章 基于PoseNet的人体姿态检测 293
9．1 项目概述 293
9．2 项目初始化 294
9．2．1 添加camera组件 295
9．2．2 添加canvas对象 296
9．3 模型加载 296
9．4 姿态检测 297
9．5 预测结果绘制 301
9．6 效果展示 302
第 10章 基于Coco SSD的目标检测 303
10．1 项目概述 303
10．2 项目初始化 304
10．2．1 添加camera组件 304
10．2．2 添加canvas对象 305
10．3 模型加载 305
10．4 目标检测 305
10．5 预测结果绘制 307
10．6 效果展示 307
第 11章 OCR技术 309
11．1 OCR技术概述 310
11．2 OCR工具推荐 311
11．3 微信OCR 315
11．3．1 插件配置信息 316
11．3．2 页面结构设计 317
11．3．3 页面逻辑功能 318
11．4 Google扩展程序OCR 319
11．4．1 插件配置信息 319
11．4．2 页面结构设计 320
11．4．3 页面逻辑功能 321
11．4．4 后台脚本 322
第 12章 神奇的人工智能 324
12．1 个人网站恶意评论检测 324
12．1．1 项目简介 324
12．1．2 代码实现 326
12．1．3 效果展示 330
12．2 微信同声传译 331
12．2．1 项目简介 331
12．2．2 代码实现 332
12．2．3 效果展示 333
12．3 Google面馆正式营业了 334
12．4 猜画小歌 335
12．5 Face Touch Monitor 335
12．6 Teachable Machine 336
12．7 其他案例 337