《微信小程序:开发入门及案例详解》—— 导读

简介: 自2016年9月21日微信小程序公布以来,微信技术群中关于小程序的讨论就没间断过,这是又一次创业的好机会,尤其是对中小企业扩大网络影响力很有利。我们在抓紧时间学习小程序的过程中,总结并实践了小程序的功能,并希望通过这本书传达给广大的读者。

26d535be9ae72a0528bba7b7091626a5f4404eb2

前  言

     自2016年9月21日微信小程序公布以来,微信技术群中关于小程序的讨论就没间断过,这是又一次创业的好机会,尤其是对中小企业扩大网络影响力很有利。我们在抓紧时间学习小程序的过程中,总结并实践了小程序的功能,并希望通过这本书传达给广大的读者。我们在编写过程中正临电商行业中最忙的几个月,双11、双12、圣诞节、元旦节等需求已经堆叠如山,我和边思白天处理公司需求,晚上编写书籍,几乎没有周末,这样坚持了几个月终于完成本书,直至交稿时才如释重负。
     小程序刚发布不久,很多功能都还在不断更新中,本书内容在官方文档基础上进行补充说明,并给出实践案例,尝试给出现阶段尽可能完善的开发模式,适合小程序初学者入门。在小程序的学习过程中,我们做过很多尝试,这里我们仅仅提出了自己的一些实现方案和观点供大家参考。小程序整体推动还需要更多开发者参与,小程序还未正式公布前,便有很多公司及个人针对小程序研发过程中的痛点推出了各类三方框架,希望阅读本书后,大家也能提出自己的想法,积极参与小程序相关话题讨论,推动小程序研发方案优化与普及。

本书内容和组织结构

     本书内容大致可分为三部分。

     第一部分为基础部分,共3章,主要介绍小程序开发的基础知识。
     第1章介绍微信小程序环境搭建、运行第一个小程序demo。
     第2章介绍小程序核心知识,包括整体框架运行原理、规则,每个文件的作用,以及WXML与WXSS。
     第3章介绍CSS布局基础,讲解了盒子模型、浮动、定位以及Flex布局。

     第二部分为组件和API,共2章,主要讲解小程序组件、API相关知识。
     第4章介绍小程序组件相关知识,主要内容包括视图容器、基础组件、表单组件、导航、媒体组件、地图、画布等。
     第5章介绍小程序API相关知识,主要内容包括网络、媒体、文件、数据缓存、位置、设备、界面、开放接口等。

     第三部分为案例实践,共5章,通过实际案例介绍如何开发小程序应用,包括一些思路和框架,以及部分代码和实现技巧。
     第6章介绍如何开发豆瓣电影小程序,主要讲解一个最简单小程序的代码结构。
     第7章介绍如何开发驾考小程序,主要讲解如何利用第三方API创建小程序引用。
     第8章介绍如何开发打赏小程序,主要讲解小程序支付流程。
     第9章介绍如何开发日程表小程序。
     第10章介绍如何开发多点商城,主要讲解如何架构一个复杂小程序项目。本书创作时间较短,如有疏漏,恳请各位读者斧正。

致谢

     在这里感谢那些一直支持我们的人,感谢韩鑫、杨凯等公司领导对本书写作的支持,让我能空出时间投入到书籍编写,感谢吴怡编辑的辛勤工作,感谢龙伟湖对本书案例UI设计的友情支持,感谢杨帆、王庆平、许彬、张磊、范彩霞等同事在工作期间对我的各种支持,感谢罗东、杨小英等同事在这段时间为我分担工作,谢谢大家,正是因为你们的支持,才有了本书的面世。
     最后特别感谢我的爱人张舒,一直相信我、支持我,一直为我默默付出,让我能全身心投入到工作中。

目  录

前 言
第1章 初识小程序
1.1 简介
1.2 接入流程
1.2.1 注册小程序帐号
1.2.2 开发环境准备
1.3 第一个小程序
1.4 小结
第2章 小程序开发核心
2.1 简介
2.2 “徒手”创建小程序
2.3 框架主体文件
2.3.1 配置文件(app.json)
2.3.2 小程序逻辑(app.js)
2.3.3 全局样式(app.wxss)
2.4 框架页面文件
2.4.1 页面配置文件
2.4.2 页面逻辑文件(JavaScript)
2.4.3 页面结构文件(WXML)
2.4.4 页面样式文件(WXSS)
2.5 模块化
2.5.1 模块化简介
2.5.2 文件作用域
2.5.3 模块的使用
2.5.4 其他
2.6 小结
第3章 布局
3.1 基本知识
3.1.1 盒子模型
3.1.2 块级元素
3.1.3 行内元素
3.1.4 行内块元素
3.2 浮动和定位
3.2.1 浮动
3.2.2 定位
3.3 Flex布局
3.3.1 基本概念
3.3.2 容器属性
3.3.3 项目属性
3.4 小结
第4章 组件
4.1 组件定义及属性
4.2 视图容器
4.2.1 view组件
4.2.2 scroll-view组件
4.2.3 滑块视图组件
4.3 基础组件
4.3.1 icon
4.3.2 text组件
4.3.3 progress组件
4.4 表单组件
4.4.1 radio组件
4.4.2 checkbox组件
4.4.3 switch组件
4.4.4 label组件
4.4.5 slider组件
4.4.6 picker组件
4.4.7 picker-view组件
4.4.8 input组件
4.4.9 textarea组件
4.4.10 button组件
4.4.11 form组件
4.5 导航组件
4.6 媒体组件
4.6.1 image
4.6.2 audio
4.6.3 video
4.7 地图组件
4.8 画布组件
4.9 客服会话
4.10 小结
第5章 API
5.1 网络
5.1.1 发起HTTPS请求
5.1.2 上传、下载
5.1.3 WebSocket
5.2 媒体
5.2.1 图片
5.2.2 录音
5.2.3 音频播放控制
5.2.4 音乐播放控制
5.2.5 音频组件控制
5.2.6 视频
5.2.7 视频组件控制
5.3 文件
5.4 数据缓存
5.4.1 保存数据
5.4.2 获取数据
5.4.3 获取本地数据信息
5.4.4 删除数据
5.4.5 清空数据
5.5 位置
5.5.1 获取位置
5.5.2 选择位置
5.5.3 查看位置
5.5.4 地图组件控制
5.6 设备
5.6.1 系统信息
5.6.2 网络状态
5.6.3 重力感应
5.6.4 罗盘
5.6.5 拨打电话
5.6.6 扫码
5.7 界面
5.7.1 交互反馈
5.7.2 设置导航条
5.7.3 导航
5.7.4 动画
5.7.5 绘图
5.7.6 下拉刷新
5.8 开放接口
5.8.1 登录
5.8.2 用户信息
5.8.3 微信支付
5.8.4 模板消息
5.8.5 客服消息
5.8.6 分享
5.8.7 获取二维码
5.9 小结
第6章 案例分析——豆瓣电影
6.1 准备工作
6.1.1 豆瓣API
6.1.2 跳转层
6.2 技术架构
6.3 公共模块开发
6.3.1 业务逻辑层
6.3.2 公共模块
6.4 页面构建
6.4.1 首页
6.4.2 详情页
6.5 页面逻辑开发
6.5.1 首页
6.5.2 详情页
6.6 小结
第7章 案例分析——驾考
7.1 业务流程
7.2 项目架构
7.2.1 功能点分析
7.2.2 项目结构图
7.2.3 数据接口
7.3 代码分析
7.3.1 小程序底层代码封装
7.3.2 首页
7.3.3 答题页
7.3.4 答题结果页
7.4 小结
第8章 案例分析——打赏
8.1 登录
8.1.1 登录流程
8.1.2 源码讲解
8.2 支付
8.3 小结
第9章 案例分析——日程表
9.1 业务流程
9.2 项目架构
9.2.1 功能点分析
9.2.2 项目结构图
9.3 代码分析
9.3.1 日程详情页
9.3.2 首页
9.3.3 日程管理页
9.4 小结
第10章 案例分析——多点商城
10.1 需求分析
10.2 技术架构
10.2.1 主界面架构
10.2.2 业务逻辑层
10.2.3 代理网络请求接口
10.2.4 本地模拟接口数据
10.2.5 widgets
10.2.6 全局样式控制
10.3 页面实现
10.3.1 主界面实现
10.3.2 首页与活动页
10.3.3 分类页与搜索页
10.3.4 支付流程
10.3.5 其他页面
10.4 小结

相关文章
|
18天前
|
JSON 小程序 JavaScript
uni-app开发微信小程序的报错[渲染层错误]排查及解决
uni-app开发微信小程序的报错[渲染层错误]排查及解决
266 7
|
18天前
|
小程序 JavaScript 前端开发
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
369 1
|
1月前
|
小程序 前端开发 测试技术
微信小程序的开发完整流程是什么?
微信小程序的开发完整流程是什么?
92 7
|
29天前
|
存储 JSON 小程序
微信小程序入门之新建并认识小程序结构
微信小程序入门之新建并认识小程序结构
46 1
|
22天前
|
缓存 小程序 索引
uni-app开发微信小程序时vant组件van-tabs的使用陷阱及解决方案
uni-app开发微信小程序时vant组件van-tabs的使用陷阱及解决方案
120 1
|
27天前
|
小程序 前端开发 数据安全/隐私保护
微信小程序全栈开发中的身份认证与授权机制
【10月更文挑战第3天】随着移动互联网的发展,微信小程序凭借便捷的用户体验和强大的社交传播能力,成为企业拓展业务的新渠道。本文探讨了小程序全栈开发中的身份认证与授权机制,包括手机号码验证、微信登录、第三方登录及角色权限控制等方法,并强调了安全性、用户体验和合规性的重要性,帮助开发者更好地理解和应用这一关键技术。
43 5
|
27天前
|
小程序 前端开发 JavaScript
微信小程序全栈开发中的PWA技术应用
【10月更文挑战第3天】微信小程序作为新兴应用形态,凭借便捷体验与社交传播能力,成为企业拓展业务的新渠道。本文探讨了微信小程序全栈开发中的PWA技术应用,包括离线访问、后台运行、桌面图标及原生体验等方面,助力开发者提升小程序性能与用户体验。PWA技术在不同平台的兼容性、性能优化及用户体验是实践中需注意的关键点。
48 5
|
23天前
|
小程序 JavaScript API
微信小程序开发之:保存图片到手机,使用uni-app 开发小程序;还有微信原生保存图片到手机
这篇文章介绍了如何在uni-app和微信小程序中实现将图片保存到用户手机相册的功能。
355 0
微信小程序开发之:保存图片到手机,使用uni-app 开发小程序;还有微信原生保存图片到手机
|
18天前
|
JavaScript 小程序 开发者
uni-app开发实战:利用Vue混入(mixin)实现微信小程序全局分享功能,一键发送给朋友、分享到朋友圈、复制链接
uni-app开发实战:利用Vue混入(mixin)实现微信小程序全局分享功能,一键发送给朋友、分享到朋友圈、复制链接
200 0
|
2月前
|
小程序 JavaScript API
微信小程序开发学习之页面导航(声明式导航和编程式导航)
这篇文章介绍了微信小程序中页面导航的两种方式:声明式导航和编程式导航,包括如何导航到tabBar页面、非tabBar页面、后退导航,以及如何在导航过程中传递参数和获取传递的参数。
微信小程序开发学习之页面导航(声明式导航和编程式导航)