概述
小程序是什么就不做过多的介绍了 这里主要对官方文档上的描述进行一个简要的整理记录让刚接触到小程序的开发人员有一个快速的了解,一切以官方文档为主
开发小程序技能要求:熟悉 html、css、javaScript 这是必备的
小程序采用的是MVVM 的开发模式开发了一套自己的模板语法,如果你有使用过类似的框架(列如:React, Vue)那么开发起来将得心应手
开发准备
- 账号申请
首先我们的申请一个小程序开发者管理后台,在这里可以管理你的小程序的权限,查看数据报表,发布小程序等操作。
点击 https://mp.weixin.qq.com/wxopen/waregister?action=step1 根据指南填写对应的信息
- 下载开发者工具
下载连接:https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html?t=18112017
根据自己的操作系统下载对应的安装包进行安装,有关开发者工具更详细的介绍可以查看 《开发者工具介绍》。
- 后台环境
后台服务器的话根据实际情况来,我这里采用的是SpringBoot、Centos7
为了安全 小程序上线强制要求采用https且在小程序后台配置的域名列表中的服务
在开发过程中可以去除https的验证
开发小程序跟开发一个web服务是一样的
创建我的第一个小程序
1. 打开下载好的小程序开发工具,选择小程序项目以开发者身份进行登录
2.创建一个小程序项目
- 项目目录:项目存放目录
- AppID:小程序管理平台 “设置”-“开发设置”
- 项目名称:项目的名称
3.编写我的小程序
4.预览
到这里就已经完成了一个简单小程序,具体的语法配置请参考官方文档 上边写的非常详细
小程序的组成
微信团队自己构建了一套针对小程序开发的语法,但是本质和html是一样的,如果你使用过Vue等Mvvm的前台框架,那么你在开发使用小程序时是非常简单的
跟目录下的是全局配置,home下面的全部是局部配置。
小程序包含一个描述整体程序的 app 和多个描述各自页面的 page。
一个小程序主体部分由三个文件组成,必须放在项目的根目录,如下:
文件 | 必需 | 作用 |
---|---|---|
app.js | 是 | 小程序逻辑 |
app.json | 是 | 小程序公共配置 |
app.wxss | 否 | 小程序公共样式表 |
以上三个文件都是针对小程序的全部配置还有一个 project.config.json 这个是个人开发习惯设置
project.config.json:
通常大家在使用一个工具的时候,都会针对各自喜好做一些个性化配置,例如界面颜色、编译配置等等,当你换了另外一台电脑重新安装工具的时候,你还要重新配置。
考虑到这点,小程序开发者工具在每个项目的根目录都会生成一个 project.config.json
一个小程序页面由四个文件组成,分别是:
文件 | 必需 | 作用 |
---|---|---|
.js | 是 | 页面逻辑(js就是用来编写我们交互脚本的地方) |
.wxml | 是 | 页面结构(可以理解为wxml就是html) |
.wxss | 否 | 页面样式表(wxss可以理解为css) |
.json | 否 | 配置文件(主要对当前页面进行局部的配置) |
上线
- 提交审核
为了保证小程序的质量,以及符合相关的规范,小程序的发布是需要经过审核的。
在开发者工具中上传了小程序代码之后,登录 小程序管理后台 - 开发管理 - 开发版本 找到提交上传的版本。
在开发版本的列表中,点击 提交审核 按照页面提示,填写相关的信息,即可以将小程序提交审核。
需要注意的是,请开发者严格测试了版本之后,再提交审核, 过多的审核不通过,可能会影响后续的时间。
- 发布
审核通过之后,管理员的微信中会收到小程序通过审核的通知,此时登录 小程序管理后台 - 开发管理 - 审核版本中可以看到通过审核的版本。
请点击发布,即可发布小程序。
更多更详细的使用说明请参考官方文档