课程简介
小程序是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或者搜一下即可打开应用。也体现了“用完即走”的理念,用户不用关心是否安装太多应用的问题。应用将无处不在,随时可用,但又无需安装卸载。
本课程从零基础开发,详细介绍小程序开发时的,环境搭建、组件、API的使用,以及开发完成后,部署上线的全部内容。
目标收益
学习小程序开发的全部功能。
学会如何在微信中运用小程序框架开发应用。
掌握在页面中使用小程序中重要组件和API的功能开发。
了解通过小程序中Video元素基本使用功能。
理解小程序中本地数据存储的方法与技巧。
培训对象
正在从事传统PC端Web页面的技术开发人员。
希望从事移动端WebApp应用开发的技术人员。
对前端技术感兴趣,希望从事这方面工作的人员。
掌握一些传统的前端开发技术,想进一步学习移动端应用开发的人员。
课程大纲
前期准备 |
1.1.下载开发工具 1.2.准备登录帐号 1.3.申请小程序开发帐号 1.4.开通服务端的接口网站 1.5.解决https和TSL版本过低的原因 |
flex布局 |
2.1.flex布局的定义 2.2.容器和项目的属性 2.3.案例一:使用flex实现骰子和网格布局 2.4.案例二:使用flex实现新闻页的反向随机布局 |
组件使用 |
3.1.双大括号绑定数据的方式 3.2.Block遍历绑定API数组 3.3.Swipe组件的使用方法 3.4.模板组件的语法与使用 3.5.sroll-view组件的上拉与下刷事件 3.6.video组件的注意事项 3.7.案例三:动画制作推出点评框,弹出键盘输入窗口 3.8.案例四:动画制作旋转、弹出、居中效果 |
重要API说明 |
4.1.如何POST提交数据 4.2.调用封装后的方法与属性 4.3.全局变量的定义与使用 4.4.案例五:使用本地存储定时缓存API接口数据 4.5.案例六:页面跳转过程中的传值与接收 |
交互API使用 |
5.1.信息提示功能 5.2.导航与信息置顶 5.3.扫码与手机振动 5.4.案例七:查看商品的二维码 5.5.案例八:显示手机中的联系人信息 |
其他API使用 |
6.1.设备信息显示 6.2.音频播放功能 6.3.地理定位显示 6.4.案例九:通过经纬度查找用户坐标 6.5.案例十:页面的上拉刷新加载更多内容 |
自定义组件与插件 |
7.1.声明自定义组件 7.2.编写组件模版 7.3.自定义组件的构造器 7.4.组件的引用和配置 7.5.组件在其他页面中的调用 7.6.第三方插件的调用方式 7.7.常用第三方插件的推荐 |
注意事项 |
8.1.网络请求异常的解决方案 8.2.图片元素加载时的无初始化 8.3.事件冒泡现象的解决方案 8.4.Scrollview组件滚动时注意事项 8.5.wxml模板不生效的原因 8.6.video标签的适配问题 |
界面UI与设计方案 |
9.1.小程序界面设计标准和要求 9.2.WeUI 前端框架 9.3.Sketch 源文件 9.4.图标与布局 9.5.菜单与面板 |
案例实战——动画展示 |
10.1.项目功能需求分析 10.2.项目功能界面效果展示 10.3.调用API接口更新状态 10.4.以动画方式弹出礼品 |
案例实战——地理查询 |
11.1.页面功能需求分析 11.2.业务逻辑分析 11.3.获取经纬度并在地图中绘点 11.4.根据绘点调用API返回商家信息 11.5.将商家绘制在地图上 |
小程序云端开发 |
12.1.云开发介绍 12.2.构建数据库 12.3.云函数 12.4.云开发控制台 |
数据集合操作 |
13.1.创建第一个集合 13.2.插入数据 13.3.读取数据 13.4.更新和删除数据 |
前期准备 1.1.下载开发工具 1.2.准备登录帐号 1.3.申请小程序开发帐号 1.4.开通服务端的接口网站 1.5.解决https和TSL版本过低的原因 |
flex布局 2.1.flex布局的定义 2.2.容器和项目的属性 2.3.案例一:使用flex实现骰子和网格布局 2.4.案例二:使用flex实现新闻页的反向随机布局 |
组件使用 3.1.双大括号绑定数据的方式 3.2.Block遍历绑定API数组 3.3.Swipe组件的使用方法 3.4.模板组件的语法与使用 3.5.sroll-view组件的上拉与下刷事件 3.6.video组件的注意事项 3.7.案例三:动画制作推出点评框,弹出键盘输入窗口 3.8.案例四:动画制作旋转、弹出、居中效果 |
重要API说明 4.1.如何POST提交数据 4.2.调用封装后的方法与属性 4.3.全局变量的定义与使用 4.4.案例五:使用本地存储定时缓存API接口数据 4.5.案例六:页面跳转过程中的传值与接收 |
交互API使用 5.1.信息提示功能 5.2.导航与信息置顶 5.3.扫码与手机振动 5.4.案例七:查看商品的二维码 5.5.案例八:显示手机中的联系人信息 |
其他API使用 6.1.设备信息显示 6.2.音频播放功能 6.3.地理定位显示 6.4.案例九:通过经纬度查找用户坐标 6.5.案例十:页面的上拉刷新加载更多内容 |
自定义组件与插件 7.1.声明自定义组件 7.2.编写组件模版 7.3.自定义组件的构造器 7.4.组件的引用和配置 7.5.组件在其他页面中的调用 7.6.第三方插件的调用方式 7.7.常用第三方插件的推荐 |
注意事项 8.1.网络请求异常的解决方案 8.2.图片元素加载时的无初始化 8.3.事件冒泡现象的解决方案 8.4.Scrollview组件滚动时注意事项 8.5.wxml模板不生效的原因 8.6.video标签的适配问题 |
界面UI与设计方案 9.1.小程序界面设计标准和要求 9.2.WeUI 前端框架 9.3.Sketch 源文件 9.4.图标与布局 9.5.菜单与面板 |
案例实战——动画展示 10.1.项目功能需求分析 10.2.项目功能界面效果展示 10.3.调用API接口更新状态 10.4.以动画方式弹出礼品 |
案例实战——地理查询 11.1.页面功能需求分析 11.2.业务逻辑分析 11.3.获取经纬度并在地图中绘点 11.4.根据绘点调用API返回商家信息 11.5.将商家绘制在地图上 |
小程序云端开发 12.1.云开发介绍 12.2.构建数据库 12.3.云函数 12.4.云开发控制台 |
数据集合操作 13.1.创建第一个集合 13.2.插入数据 13.3.读取数据 13.4.更新和删除数据 |