微信小程序项目开发实战——用WePY、mpvue、Taro打造高效的小程

本书的原则是实战，目标是高效开发微信小程序。借助WePY、mpvue、Taro等多个框架，帮助读者从零开始迅速掌握小程序的开发步骤和技巧。全书不仅涉及小程序的前台UI，还涉及后台逻辑的编写，旨在让读者真正获得小程序项目的开发能力。本书主要分为三个部分。第一部分介绍微信小程序的组件和API，以及官方的WePY框架的下载和使用方法。第二部分是WePY框架的实战，包括问卷、传感器、富文本显示、上传文件、Canvas等常用小程序的开发。第三部分是两个常用的小程序框架mpvue和Taro的实战案例，包括“历史今日”、星座测试小程序的开发。本书适合想要制作和学习微信小程序的读者，尤其适合零编程基础的爱好者和小程序开发的初学者，读者无须理解过于基础的部分，本书以需求中的功能为开发的重点，涉及大量流行的小程序实例。本书可以快速提高读者的兴趣，进而使读者更加深入地学习相关知识。

第1章 走进微信小程序 1
1.1 小程序的起源 1
1.1.1 什么是小程序 2
1.1.2 小程序的发展 3
1.2 开发小程序的第一步 4
1.2.1 注册小程序 4
1.2.2 设置小程序 6
1.3 小程序开发工具 8
1.3.1 下载和安装 8
1.3.2 图解常用功能 11
1.4 实战1：Hello World 13
1.4.1 编写页面链接 13
1.4.2 编写新页面内容 15
1.5 什么是WePY 17
1.5.1 为什么选择WePY 17
1.5.2 WePY开发环境的安装 18
1.6 实战2：WePY版Hello World 20
1.6.1 创建HelloWorld项目 20
1.6.2 编写页面代码 23
1.7 小结和练习 26
1.7.1 小结 26
1.7.2 练习 26
第2章 微信小程序组件 27
2.1 小程序的视图容器 27
2.1.1 最基础的组件：view 28
2.1.2 可滚动视图区域：scroll-view 28
2.1.3 轮播图片：swiper 28
2.1.4 可移动视图容器：movable-view 29
2.1.5 超过原生组件的层级：cover-view和cover-image 30
2.2 小程序的基础组件 32
2.2.1 图标组件：icon 32
2.2.2 文字组件：text 33
2.2.3 富文本组件：rich-text 34
2.2.4 进度条组件：progress 34
2.2.5 表单组件：form 35
2.2.6 极其重要的按钮组件：button 36
2.3 媒体组件和导航组件 37
2.3.1 导航组件：navigator 37
2.3.2 图片组件：image 38
2.3.3 视频组件：video和API：wx.createVideoContext 43
2.3.4 拍照组件：camera和API：wx.createCameraContext 45
2.4 地图组件和画布组件 50
2.4.1 地图组件：map 50
2.4.2 画布组件：Canvas和API：wx.createCanvasContext 51
2.5 小程序提供的HTML支持和开放能力支持 54
2.5.1 开放数据域：open-data 55
2.5.2 HTML等网页支持：web-view 56
2.5.3 开发者的收入来源：ad 58
2.5.4 小程序引导关注公众号：official-account 59
2.6 小结和练习 60
2.6.1 小结 60
2.6.2 练习 60
第3章 微信小程序API 61
3.1 小程序基础――网络请求API 62
3.1.1 发起请求 62
3.1.2 上传和下载 64
3.1.3 WebSocket 65
3.2 实战：简单的socket聊天小程序 68
3.2.1 服务器端开发 68
3.2.2 客户端开发 70
3.3 小程序的基础API――更新和设备信息 77
3.3.1 小程序的自动更新 77
3.3.2 获取用户终端信息 79
3.3.3 获取小程序相关信息 81
3.3.4 获取设备Wi-Fi状态 81
3.3.5 获取设备加速计、陀螺仪和方向 83
3.3.6 获取设备蓝牙和NFC 84
3.3.7 设备屏幕API 86
3.3.8 设备的扫码和振动 87
3.3.9 获取设备的剪贴板 88
3.3.10 获取设备位置的API 88
3.4 路由页面跳转和数据缓存API 90
3.4.1 页面之间的跳转 90
3.4.2 数据缓存添加和获取API 92
3.4.3 数据缓存删除API 94
3.5 小程序界面交互API 95
3.5.1 提示框和模态框 95
3.5.2 导航栏的单独设置 97
3.5.3 Tab Bar的设置 98
3.5.4 字体和滚动 101
3.5.5 其他显示API 102
3.6 媒体和文件 102
3.6.1 图片相关API 102
3.6.2 视频相关API 104
3.6.3 录音相关API 105
3.6.4 文件相关API 106
3.7 其他开放接口 108
3.7.1 客服API 108
3.7.2 转发API 110
3.7.3 收货地址 111
3.8 小结和练习 112
3.8.1 小结 112
3.8.2 练习 112
第4章 微信小程序的服务器端 113
4.1 后台API编写入门 113
4.1.1 后台技术的选择 114
4.1.2 后台技术环境搭建 114
4.1.3 直接上手的框架 117
4.1.4 搭建一个简单的框架服务器 117
4.1.5 MySQL的使用 120
4.1.6 对于后端技术的说明 121
4.1.7 路由创建 121
4.2 用户系统的搭建 122
4.2.1 用户系统的逻辑 122
4.2.2 用户系统的实现编码 124
4.2.3 用户系统的测试 132
4.3 其他常用服务器API 135
4.3.1 二维码API 135
4.3.2 运动数据API 140
4.3.3 获取用户手机号 148
4.4 小结与练习 151
4.4.1 小结 151
4.4.2 练习 151
第5章 实战：问卷小程序 152
5.1 问卷小程序简介 152
5.1.1 为什么需要问卷调查 153
5.1.2 需求分析 153
5.2 问卷小程序具体编码 154
5.2.1 后端编写 154
5.2.2 小程序编写 162
5.3 小结和练习 168
5.3.1 小结 168
5.3.2 练习 168
第6章 实战：摇一摇游戏 169
6.1 项目分析 169
6.1.1 摇一摇功能分析 170
6.1.2 摇一摇项目规划 171
6.1.3 摇一摇接口定义 172
6.2 项目编码 173
6.2.1 摇一摇小程序的后台 173
6.2.2 摇一摇小程序的首页 185
6.2.3 摇一摇小程序的填写页面 188
6.2.4 摇一摇小程序的摇动页面 194
6.2.5 摇一摇小程序排行榜 202
6.3 小结和练习 204
6.3.1 小结 204
6.3.2 练习 205
第7章 实战：百度图片识别API 206
7.1 项目分析 206
7.1.1 流行的识别技术 207
7.1.2 功能设计 207
7.1.3 路由设计 208
7.2 具体编码 208
7.2.1 系统后台编码 208
7.2.2 上传图片功能 215
7.2.3 小程序图片解析显示 219
7.3 小结和练习 221
7.3.1 小结 221
7.3.2 练习 221
第8章 实战：文字信息发布小程序 222
8.1 项目需求 222
8.1.1 功能划分 223
8.1.2 路由划分 223
8.2 具体编码 224
8.2.1 后台实现 224
8.2.2 新建小程序项目 233
8.2.3 首页实现 234
8.2.4 首页逻辑编写 237
8.2.5 首页样式编写 239
8.2.6 文章详情页实现 241
8.2.7 文章内容显示 243
8.2.8 文章评论显示 246
8.2.9 文章点赞功能 248
8.3 小结和练习 251
8.3.1 小结 251
8.3.2 练习 251
第9章 实战：使用Canvas绘制图片 252
9.1 如何使用Canvas绘制生成图片 252
9.1.1 为什么需要绘制生成图片 253
9.1.2 绘制生成图片的必要因素 253
9.2 实战1：在微信小程序中绘制需要的图片 254
9.2.1 需求分析 254
9.2.2 创建小程序 255
9.2.3 创建组件 256
9.2.4 图片主页 257
9.2.5 绘制图片 261
9.3 实战2：流行的手机背景生成小程序 262
9.3.1 系统规划设计 262
9.3.2 后台路由设计 264
9.3.3 系统后台编码 264
9.3.4 小程序页面编写 266
9.3.5 小程序逻辑编写 269
9.3.6 小程序绘制逻辑编写 273
9.4 小结和练习 275
9.4.1 小结 275
9.4.2 练习 275
第10章 实战：使用mpvue实现“历史今日”小程序 276
10.1 支持Vue.js语法的mpvue框架 276
10.1.1 mpvue框架基础 277
10.1.2 mpvue框架环境搭建 277
10.1.3 mpvue快速入门 280
10.1.4 项目工程文件说明 281
10.2 使用mpvue创建“历史今日”小程序 285
10.2.1 项目规划 285
10.2.2 项目新建页面 287
10.2.3 请求接口逻辑编写 288
10.2.4 项目显示编写 291
10.2.5 项目生成 295
10.3 小结和练习 296
10.3.1 小结 296
10.3.2 练习 297
第11章 实战：使用Taro实现星座测试小程序 298
11.1 支持React语法的Taro框架 299
11.1.1 什么是Taro 299
11.1.2 Taro快速入门 300
11.2 使用Taro框架创建星座测试小程序 303
11.2.1 接口说明 303
11.2.2 新建Taro小程序 304
11.2.3 星座测试小程序主页 305
11.2.4 星座测试小程序主页的组件 307
11.2.5 星座测试详情页 310
11.3 项目编译与生成 314
11.3.1 编译为微信小程序 314
11.3.2 编译为百度小程序 315
11.3.3 编译为支付宝小程序 318
11.3.4 编译为其他小程序 321
11.4 小结和练习 321
11.4.1 小结 321
11.4.2 练习 321

张帆，
巨人网络（上海）公司网页开发工程师。喜欢在博客、GitHub和简书上持续分享各种开发技术和编程实例，有丰富的项目经验，喜欢新兴技术和开发方式，喜欢JavaScript系的React.js、vue.js等技术。精通网页后台开发、相关的项目管理等。