小程序简介
小程序是一种不需要下载安装即可使用的应用,它是连接用户与服务的新方式,它实现了应用“触手可及” 的梦想。
用户扫一扫或者搜一下即可打开应用,也体现了“用完即走”的理念。
用户不用关心是否安装太多应用的问题。应用将无处不在,随时可用,但又“无需安装下载”
此篇是微信小程序开发的一个简明介绍和关键说明,微信小程序的主要开发语言是 JavaScript,如果你使用过 Vue 或者 React,你将会对微信小程序的开发有一种亲切感,它们的一些理念有一些类似,比如数据绑定、数据驱动视图等。
准备工作
- 注册小程序账号 注册地址
- 获取AppID 位于小程序管理平台的菜单 “开发”-“开发设置”
- 安装小程序开发工具 下载地址
- 配置项目
1. 打开小程序开发者工具,用微信扫码登录开发者工具
2. 新建项目
3. 选择小程序项目
4. 选择本地存放路径
5. 填写上面获取到的AppID
6.完成项目创建
一些重要的概念
- 小程序的组成 小程序包含一个描述整体程序的 app 和多个描述各自页面的 page。
- 一个小程序主体部分由三个文件组成,必须放在项目的根目录:
- app.js —— 小程序逻辑
- app.json —— 小程序公共配置
- app.wxss —— 小程序公共样式表
3. 一个小程序页面由四个文件组成:
- .js文件 —— 页面逻辑
- .wxml文件 —— 页面结构
- .json文件 —— 页面配置
- .wxss文件 —— 页面样式表
4. 最终,一个小程序的基本目录结构,大致长这个样子:
代码语言:txt复制|—pages/
| |—about/
| |—about.js
| |—about.json
| |—about.wxml
| |—about.wxss
|—app.js
|—app.json
|—app.wxss
|—project.config.js // 工具配置,存放开发者对开发工具的一些个性化配置,例如界面颜色、编译配置等
5. 宿主环境 每个小程序都是运行在它所在的微信客户端上的,通过微信客户端给他提供的运行环境,小程序可以直接获取微信客户端的原生体验和原生能力。
6. 基本架构 小程序的运行环境分为渲染层和逻辑层,其中 WXML 模板和 WXSS 样式工作在渲染层,JS 脚本工作在逻辑层。其中渲染层的界面使用 WebView 线程进行渲染,逻辑层采用 jsCore 线程运行。一个小程序存在多个界面,所以渲染层存在多个 WebView 线程,这两个线程的通信会经由微信客户端(Native)做中转,逻辑层发送网络请求也经由 Native 转发。
小程序语法
- WXML 语法参考
- WXS 语法参考
小程序发布流程
- 在开发工具里,提交代码,填写版本信息
- 在小程序管理平台提交审核
- 收到审核通过通知后,在小程序管理平台,点击发布
- 小程序将会发布到线上提供服务,可以下载二维码让别人扫码使用了