[个人向]超快速了解微信小程序看这篇就够了+相关简要说明

本文精炼微信小程序开发文档相关内容,旨在对初次接触并准备开发小程序的童鞋(比如自己)提供一个快速了解攻略。其中包括注册相关、语言、框架模式、相关配额等说明。在具体深入小程序文档之前可以大概浏览浏览~

1 定位与介绍

微信小程序是一种全新的连接用户与服务的方式,它可以在微信内被便捷地获取和传播,同时具有出色的使用体验。是一种无需安装即可使用的手机“应用”。微信小程序的四个特点:1.无需安装随时可用、2.触手可及、3.用完即走、4.无需卸载。

2 注册相关

小程序注册 è 登记主体信息 è 登记管理员信息。具体操作如下参考链接:

https://developers.weixin.qq.com/miniprogram/introduction/#%E5%B0%8F%E7%A8%8B%E5%BA%8F%E6%B3%A8%E5%86%8C

3 开发相关

3.1开发工具

微信小程序开发工具

工具开发界面如下:


另外,vscode添加相关插件也能进行开发。

3.2开发文件与编译语言

小程序中文件类型主要包括:

  • json 后缀的 JSON 配置文件 èJSON扮演的静态配置的角色。
  • wxml 后缀的 WXML 模板文件 è描述当前这个页面的结构,组件(标签)要素,相当于HTML。
  • wxss 后缀的 WXSS 样式文件 è描述页面的样子、尺寸布局等,相当于CSS
  • js 后缀的 JS 脚本逻辑文件 è界面与用户做交互:响应用户的点击、获取用户的位置等,以及与后台、控制层进行交互。(和web开发的JS功能类似)。

补充一下小程序开发和传统web开发的一些差异:

网页开发渲染线程和脚本线程是互斥的,这也是为什么长时间的脚本运行可能会导致页面失去响应。网页开发者可以使用到各种浏览器暴露出来的 DOM API,进行 DOM 选中和操作。

而在小程序中,开发渲染线程和脚本线程是分开的,分别运行在不同的线程中。小程序逻辑层运行在 JSCore 中,并没有一个完整浏览器对象,因而缺少相关的DOM API和BOM API。这一区别导致了前端开发非常熟悉的一些库,例如 jQuery、 Zepto 等,在小程序中是无法运行的。同时 JSCore 的环境同 NodeJS 环境也是不尽相同,所以一些 NPM 的包在小程序中也是无法运行的。

3.3小程序宿主环境

微信客户端给小程序所提供的环境为宿主环境。小程序借助宿主环境提供的能力,可以完成许多普通网页无法完成的功能。详情点这里

3.3.1渲染层和逻辑层

小程序的运行环境分成渲染层逻辑层,其中 WXML 模板和 WXSS 样式工作在渲染层,JS 脚本工作在逻辑层。

小程序的渲染层和逻辑层分别由个线程管理:渲染层的界面使用了进行渲染;逻辑层采用线程运行脚本。一个小程序存在多个界面,所以渲染层存在多个线程,这两个线程的通信会经由微信客户端(下文中也会采用来代指微信客户端)做中转,逻辑层发送网络请求也经由转发,小程序的通信模型下图所示。

3.3.2组件

小程序提供了丰富的基础组件给开发者,开发者可以像搭积木一样,组合各种组件拼合成自己的小程序。就像 HTML 的 div, p 等标签一样,在小程序里边,你只需要在 WXML 写上对应的组件标签名字就可以把该组件显示在界面上

3.3.3API

为了让开发者可以很方便的调起微信提供的能力,例如获取用户信息、地理位置、分享、下拉刷新、时间选择器、微信支付等等,小程序提供了很多现成的API给开发者去使用。

3.4开发模式和流程

参考了开发文档的一些例子,查阅了网上一些相关案例。发现有将小程序作为一个前端,用php搭建服务器、甚至结合Java开发中SpringMVC搭建后台框架的。

此次开发的小程序整体架构模式应该算是一种类MVC模式。view层由上文提到的wxml与wss构成,control层由js对module层数据进行封装,拿到view层进行展示。Module层可以像传统web开发一样,通过后台服务器,加之MySql等数据库进行数据持久化。在这里使用的是微信小程序自带的云开发(云函数、云存储与云数据库,之后会针对云开发详细介绍)

更为详细一点来说,就是将各种表和记录存放在云数据库、一些需要上传下载的图片存放在云存储。编写云函数对其进行操作,逻辑控制层函数调用云函数并接收其结果。User通过页面视图层中的一些事件(刷新、点击等)调用控制层相应函数进而传输数据,达到一个前后端的交互的过程。

下图是一个小程序云开发架构模型:(画的有点问题:云函数应该也是属于云端的)

4 云开发

云开发为开发者提供完整的原生云端支持和微信服务支持,弱化后端和运维概念,无需搭建服务器,使用平台提供的 API 进行核心业务开发,即可实现快速上线和迭代,同时这一能力,同开发者已经使用的云服务相互兼容,并不互斥。

云开发提供了几大基础能力支持:

云开发管理控制台:

下面将分别对云函数、云数据库、云存储进行介绍,其后将介绍云开发的一些配额说明等。

4.1云数据库

云数据库是一个JSON格式的文档型数据库。

官方似乎只提供了一个数据库,可建多张表(集合)。可手动添加或删除记录,也可以由JSON格式导入或导出。提供一个默认的不可删除的PrimeryKey:_id,添加记录时可自由修改,不改则默认为一个长字符串。

每张表的每个记录里的格式不用完全相同。常用数据类型包括:String:字符串;Number:数字;Object:对象;Array:数组;Bool:布尔值;Date:时间。

crud操作与传统的后台开发思路类似,最大的不同在于返回类型为JSON格式。查询处理同样也能够进行聚合函数操作、连接查询(刚开始没搞明白,走了不少弯路)。另外也支持事务操作(这部分没太明白)。

操作权限:在前端也能够直接访问云数据库,但只允许创建者进行写操作。通过云函数调用访问则没这一限制了。

读写权限:小程序前端单次读取数据库最多条,云函数单次读取数据库最多条。

4.2 云存储

云存储提供高可用、高稳定、强安全的云端存储服务,支持任意数量和形式的非结构化数据存储,如视频和图片,并在控制台进行可视化管理。

以一个图片为例,调用api上传到云存储空间后生成fileID和下载地址。fileID用于描述文图片的位置,下载地址可调用函数进行下载。

4.3云函数

云函数即在云端(服务器端)运行的函数。在物理设计上,一个云函数可由多个文件组成,占用一定量的 CPU 内存等计算资源;各云函数完全独立;可分别部署在不同的地区。开发者无需购买、搭建服务器,只需编写函数代码并部署到云端即可在小程序端调用,同时云函数之间也可互相调用。

一个云函数的写法与一个在本地定义的 JavaScript 方法无异,代码运行在云端 Node.js 中。当云函数被小程序端调用时,定义的代码会被放在 Node.js 运行环境中执行。我们可以如在 Node.js 环境中使用 JavaScript 一样在云函数中进行网络请求等操作,而且我们还可以通过云函数后端 SDK 搭配使用多种服务,比如使用云函数 SDK 中提供的数据库和存储 API 进行数据库和存储的操作,这部分可参考数据库和存储后端 API 文档。

云开发的云函数的独特优势在于与微信登录鉴权的无缝整合。当小程序端调用云函数时,云函数的传入参数中会被注入小程序端用户的 openid,开发者无需校验 openid 的正确性因为微信已经完成了这部分鉴权,开发者可以直接使用该 openid。

4.4相关配额

云开发控制台上就有:

资源生命周期具体没查到,不过并非到期后存储内容消失,应该是重新分配空间。

由于我并没有花钱,上述是免费版的配额:数据库2G,数据库请求数5万次/日,存储容量5G。

(ps:CDN的全称Content Delivery Network,即内容分发网络。本原理是广泛采用各种缓存服务器,将这些缓存服务器分布到用户访问相对集中的地区或网络中,在用户访问网站时,利用全局负载技术将用户的访问指向距离最近的工作正常的缓存服务器上,由缓存服务器直接响应用户请求。)

另外,官方也推出了许多付费版的以满足更大需求:

其中包括均衡型、数据库资源消耗型、云函数资源消耗型等以满足不同种类的需求。

配额详情

5 个人开发感受

云开发模式的小程序开发效率确实挺高。从完全没接触过到完成投票app大概花了不到一个月,除前端页面部分排版样式是参考开源程序外,大部分逻辑函数、对数据库操作的云函数的编写、数据表设计,均参照官方开发文档及api完成,一边学一边写,遇到问题现查先用。优点是上手速度快、开发简洁、调试方便;缺点是容易卡壳,后面实在写不动了才会想着研究手册,导致很多前面写的代码(特别是操作数据库)非常之low和不规范,查询效率应该也是大打折扣。

不过云开发也有缺点,个人感受在于1、数据库不够规范(主外键约束之类的可能需要自己搞定)2、对文档型数据库的一些较为复杂的操作感觉比关系型sql语句复杂(可能是自己因为不太熟悉)。

最后附上:

数据库不够规范(主外键约束之类的可能需要自己搞定)2、对文档型数据库的一些较为复杂的操作感觉比关系型sql语句复杂(可能是自己因为不太熟悉)。

最后附上:

小程序开发文档

小程序个人中心

[个人向]超快速了解微信小程序:看这篇就够了!(注册、语言、框架、配额等简要说明)相关推荐

  1. 上传文件 微信小程序input_快速上手微信小程序UI框架

    本课程属于 微信小程序 A计划,不单独售卖,加入 A 计划可免费观看本课程及所有 微信小程序 收费课程~ 微信小程序 A计划永久有效期购买链接: http://www.sikiedu.com/clas ...

  2. 只需两步快速获取微信小程序源码

    第一次在掘金这样高大上的社区写文章,忐忑地敲下我获取小程序源码过程中的经验分享. 最近在学习微信小程序开发,半个月学习下来,很想实战一下踩踩坑,于是就仿写了某个小程序的前端实现,过程一言难尽,差不多两 ...

  3. 如何快速开始微信小程序开发?

    如何快速开始微信小程序开发? 小游戏是微信小程序中的一种分类,如果要做一款微信小游戏,就是在微信小程序中开发. 一个微信小程序是如何开发的呢?很多人尤其程序员会对这个问题感兴趣,本文将介绍如何快速注册 ...

  4. 【微信小程序开发学习篇】

    微信小程序开发学习篇 概述 相关信息 笔记制作时间:2022-9-25 参考视频:黑马视频 参考文档:微信小程序官方开发文档 文章目录 微信小程序开发学习篇 概述 相关信息 小程序基础 1.数据绑定与 ...

  5. 微信小程序第五篇:页面弹出效果及共享元素动画

    系列文章传送门: 微信小程序第一篇:自定义组件详解 微信小程序第二篇:七种主流通信方法详解 微信小程序第三篇:获取页面节点信息 微信小程序第四篇:生成图片并保存到手机相册 目录 一.page-caon ...

  6. 微信小程序仿淘票票之登录注册讲解

    微信小程序仿淘票票之登录注册讲解(这也是我学习的第一步嘛) 前言 一.登录以及注册的业务逻辑 二.核心代码 1.register代码 2.login代码 总结 前言 愉快的期末,终于结束了,我准备把程 ...

  7. 手把手带你学习微信小程序 —— 项目实战篇

    微信小程序项目实战篇 WeChat-applet 1.支付宝界面展示 2.微博发帖功能实现 3.时间格式化案例 4.微信红包界面展示 5.微信消息删除案例 6.微信icon 组件 6.1 支付成功界面 ...

  8. 微信小程序第四篇:生成图片并保存到手机相册

    系列文章传送门: 微信小程序第一篇:自定义组件详解 微信小程序第二篇:七种主流通信方法详解 微信小程序第三篇:获取页面节点信息 目录 一.封装分享组件 二.定义用户授权方法 三.调用流程 首先我们看一 ...

  9. 微信小程序教程入门篇

    微信小程序教程入门篇: 微信小程序怎么做?做一个微信小程序要多少钱呢? 作为Z时代,Y时代的我们,做一个微信小程序难道还要去看书学代码吗? 不存在的各位. 现在制作一个微信小程序,只需要动动鼠标键盘, ...

最新文章

  1. C语言 字符型操作(就自己做个笔记储存一下)
  2. 【python】一次移动平均算法
  3. 在.NET Core 3.0中发布单个Exe文件(PublishSingleFile)
  4. Ranger-AdminServer安装Version2.0.0
  5. 前端世界起争端,你是现代 Web 技术体系的坚定捍卫者吗?
  6. Could not open Hibernate Session for transaction, 数据库连接超时解决方法
  7. crm客户管理软件的精髓
  8. 配置思科交换机冗余链路汇聚
  9. 城市大脑标准体系与评价指标总体框架
  10. 卷积神经网络应用领域和基本结构
  11. oracle 左连接 简写,SQL左连接
  12. hssfrow 单元格样式_poi导出excel单元格中画斜线_AnyReport报表
  13. [C语言] 混合or连续使用getchar,scanf所出现的错误
  14. 生成对抗网络训练_生成对抗网络
  15. TM1638驱动显示板(8数码管+8LED+8按键)单片机C语言程序(按键功能)
  16. 器:Linux - 断点续传文件
  17. POJ3278抓牛Catch That Cow
  18. 关于在win8下面安装虚拟机出现的一些问题
  19. el-table 表格内容多一根线的解决办法
  20. leetcode 883. 三维形体投影面积(python)

热门文章

  1. 公司如何监控员工电脑屏幕?
  2. 如何用api实现量化交易?
  3. 快来智影:微电影的特征有哪些?
  4. jarvis oj Web By Assassin
  5. powersploit Invoke-Portscan模块
  6. vue项目引入彩色iconfont图标
  7. java swing 图片显示_在Java Swing中显示图像
  8. 【无标题】内部表和外部表的区别
  9. go桌面计算机,GO桌面快速找到应用程序方法教程
  10. 精心整理计算机热门视频教程免费下载[特集A](1-50)