微信小程序快速入门分享大纲

微信小程序

• 总体流程
• 开发细节

---

 

1、总体流程

一、注册小程序帐号

邮箱注册

不能使用同时注册了微信其余用途的邮箱

去邮箱激活帐号后，须要填写我的实名信息

如果第一次成为管理员，须要先补充我的实名信息

注册完成

二、填写小程序基本信息

1） 基本信息
2） 成员管理
3） 配置服务器域名 必须https

三、开发者工具

使用AppID建立一个新项目

如何真机调试

四、开发完成后，上传代码

提交审核

微信收到通知，查看审核结果

审核经过后，发布上线

 

2、开发细节

一、项目代码结构

四部分：JSON WXML WXSS JS
基本流程：先根据 json 配置生成一个界面，顶部的颜色和文字你均可以在这个 json 文件里边定义好。紧接着会装载这个页面的 WXML 结构和 WXSS 样式。最后会装载 js。

公共
在app.json中，写在 pages 的第一个页面就是这个小程序的首页（打开小程序看到的第一个页面）；
小程序启动以后，在 app.js 定义的 App 实例的 onLaunch 回调会被执行；
整个小程序只有一个 App 实例，是所有页面共享的 如globalData 。

局部
在各页面的js 中，Page 是一个页面构造器，这个构造器就生成了一个页面；
渲染完界面以后，页面实例的 onLoad 回调会被执行。

二、JSON

app.json
project.config.json
page.json

三、WXML

相似HTML
不一样：
标签不一样
指令语法不一样 （注意与VUE的区别，特别是表达式） wx:if wx:else wx:for 指令里的变量须要加双括号

模板（data 是要模板渲染的数据，data="{{...item}}" 写法是ES6的写法，item是wx:for当前项，... 是展开运算符，在模板中不须要再{{item.courseName}} 而是直接{{courseName}}）

四、WXSS

WXSS 仅支持部分 CSS 选择器
如何支持LESS

五、JS

经常使用API（好比请求、缓存等）

六、云开发

什么是云开发
怎么用

首先，开通云开发服务。

建立云开发项目demo看一下

云开发控制台的基本使用

demo在小程序代码操做数据库以前，必需要先对login文件夹执行“上传并部署”（云函数的基本用法）