基于云开发的微信小程序实战教程(一)

最近刚开发了款小程序,在开发过程中发现,基于云开发的教程资源不是很多,而且很不详细。所以边实战边总结了下云开发的简单教程,希望对你有所帮助。

本章主要内容:什么是小程序,云开发的作用,如何建立自己的小程序

一、什么是小程序

微信小程序是个啥,就不多说了,大家应该都知道。如果不知道,看下面这个图也就明白什么是小程序了。

因为有了微信小程序,我们可以不用下载app,就能够访问同程、携程、腾讯会议、青桔单车、拼多多等,这些都属于企业的小程序。

我们也能根据自己的创意和想法,制作个人小程序。

二、小程序的云开发

1、开发前需要知道的事情

小程序其实就相当于我们平常访问的网站或app,只不过区别是它必须在微信中打开。所以其实小程序的开发和其他网站的开发原理是一样的,不仅仅需要一个前端页面的样式展示,还需要有服务器来存放用户信息、商品信息等数据。

而小程序必须基于微信打开这一特点,同样也给我们开发小程序带来了很多便利,因为我们可以直接使用微信给提供的一些方法,很容易的实现上传图片、微信支付、打开相机等功能。

2、云开发的作用

刚刚提到,一个完整的网站肯定是需要有交互的,最基础的比如用户的登录、注册,我们肯定需要把用户的信息存到某个地方,这样才能去拿用户的输入和你存下来的信息做匹配,看用户名和密码是不是正确的,再告诉用户登录成功或失败。

这个存储用户信息的地方就是服务器,正常的网站搭建是需要我们自己购买服务器、搭建环境等一系列流程,对于后端开发者而言,这些环境配置、数据库开发等也许很简单,但是没接触过后端语言的人想要完成一个完整的网站,就有一定的难度。

如果要搭建个人网站,可以参考这篇文章:如何免费从0开始搭建个人网站?)

而微信小程序的云开发则免费给我们的小程序提供了一个云服务器环境,直接就可以用,对前端开发者以及未接触过开发行业的人而言,就非常容易上手完成自己的小程序了。

三、如何建立自己的小程序

1、注册一个小程序

我们需要去微信公众平台注册一个小程序账号,一个账号对应一个小程序。注册完成之后,我们就可以在微信公众平台登录,进入自己的小程序配置后台,可以在这里修改自己小程序的名字,头像,简介等信息,还可以看到自己小程序的编号AppID 和 小程序的密钥AppSecret,后面创建小程序项目的时候,会用到这两个值。

有了这两个值,微信就能区分出来哪个小程序是你的小程序了。因为我们开发完之后要把代码提交给微信,然后他们审核觉得没有违规的地方,审核通过后,你做的小程序就能上线了,上线后大家就可以访问你的小程序了。

我们选择注册小程序,见下图

接下来,填写相关信息

完成邮箱激活后,主题类型选择「个人」,并完成主题信息登记的填写。

完成信息填写后,点击提交,就会弹出来个框,提示你注册成功,点击跳转到小程序。

这个就是小程序的后台,以后可以通过微信公众平台,通过你刚刚绑定的微信或邮箱进行登录。

在这个管理后台中,你可以完善和修改你的小程序的头像、简介和名称。补全完整信息后,我们就可以进行开发了。

这里以个人开发举例,默认只能管理员,也就是你自己一个人进行开发,如果需要和其他人一块开发,就需要点击上图中的「添加开发者」把其他开发人的微信录入进来。

点击上图中的「普通小程序开发者工具」,下载「微信开发者工具」,后续我们开发和预览小程序都是需要用到这个编辑器的。

根据自己电脑配置,选择正确的安装包进行下载,安装。

2、使用开发者工具创建小程序项目

运行微信开发者工具后,会出现如下界面,用你刚才注册小程序的微信,扫码完成登录。

选择新建小程序,项目名称和储存目录可以自己修改,也可以用它默认的项目名称和储存位置。需要注意的是,后端服务这一项选择「小程序·云开发」


修改完项目名和存储位置后,我们还需要把刚刚注册的小程序编号,AppID填写上去,这样子创建的项目就能和我们的小程序关联起来了。

AppID可以去微信开放平台,登录我们刚注册的小程序的后台,左侧导航最下面的「设置」页,滑到页面最底部,查看账号信息,找到我们的小程序编号,如下图。

信息输入完成后,点击新建,会自动构建一个基于云开发的小程序项目的官方例子。

点击新建完成后,微信开发者工具的编辑器会出现上方的界面,左侧是我们的小程序页面的预览窗口,第二栏资源管理器可以看到我们的项目代码文件夹。最右侧是我们编辑代码和查看输出日志的区域。

我们可以看到,刚刚新建的项目有一个错误,错误信息是「没有权限,请先开通云服务」,可以猜测,我们还需要去开通云服务。很简单,点击左上角的「云开发」,会出来下方的窗口。

选择「预付费」,给你的云服务环境起个名字,然后点击开通,就完成了云环境的创建。

这时候,返回我们刚刚的编辑器页面,点击编译,就能看到刚刚的报错信息已经没有了,代表我们的云环境可以用了。

下一篇,具体讲解编辑器如何使用,以及小程序云开发的目录结构等知识。

相关文章
基于云开发的微信小程序实战教程(一)
基于云开发的微信小程序实战教程(二)
基于云开发的微信小程序实战教程(三)

基于云开发的微信小程序实战教程(一)相关推荐

  1. 基于云开发的微信小程序实战教程(二)

    基于云开发的微信小程序实战教程(二) 上篇文章中,简单介绍了下小程序云开发的概念,还有开发工具的安装和配置,云开发环境已经搭建完毕. 本章主要内容:微信开发者工具如何使用,小程序云开发的基础目录结构 ...

  2. 基于云开发的微信小程序:个人相册ByUestcXiye

    基于云开发的微信小程序:个人相册ByUestcXiye 作业要求 第一次作业 第二次作业 结课作业 小程序开发入门 开发前的准备 注册微信小程序 新建一个模板小程序 开通云开发服务 第一次作业 参考资 ...

  3. 基于云开发的微信小程序-miNi相册(主页与上传图片功能)

    这节主要的是介绍主界面功能介绍. 可以看到,主要是实现上传图片的功能,然后前往大厅的话就是一个纯属跳转的按钮. 微信的个人信息(名字头像)都是在前面登录的页面已经获取存储到全局变量中. 接下来开始上代 ...

  4. 基于云开发的微信小程序-miNi相册(开发环境介绍与登录)

    首先安装Node.js 注册一个小程序拿到一个appidhttps://mp.weixin.qq.com/cgi-bin/wx 有兴趣弄代码管理的可以https://git.weixin.qq.com ...

  5. 云开发电商小程序实战教程-篇首语

    目录 写作的目的 过往的技术学习路线 寻求突破 学习的困难 真实的场景 几个场景的思考 云开发 学习的方法 写作的目的 从08年进入计算机行业后,先后做过开发.实施.运维.售前.项目管理岗位,也先后换 ...

  6. 基于云开发创建(小程序云商城,基本页面的创建及动态代码的编写)

    CSDN话题挑战赛第2期 参赛话题:万家争鸣的云计算修罗场 在这个专属于"云"的时代,各位云端弄潮儿们,请分享出你的云计算学习历程吧! 你可以从以下几个方面着手(不强制),或者根据 ...

  7. vue.js反编译_基于electron-vue开发的微信小程序反编译客户端

    开源一个小程序反编译客户端 咨询小程序反编译的同学比较多,虽然有开源库但是还是有同学不清楚如何去操作,所以索性做了一个客户端方便进行小程序的反编译 # 技术选型 网上已经有大佬实现了C#版的反编译工具 ...

  8. 云开发(微信-小程序)笔记(十四)---- 收藏,点赞(上)

    云开发(微信-小程序)笔记(十三)---- 注册登陆 1.简介 点赞,收藏等都是程序的最简单的功能,在现实的应用中也很常见.这里我就来给大家介绍一下小程序的这个功能. 图标下载地址 先去网站上http ...

  9. 云开发(微信-小程序)笔记(五)----云函数,就这(上)

    云开发(微信-小程序)笔记(四)---- 还有吗?再来点 云函数 云函数即在云端(服务器端)运行的函数.在物理设计上,一个云函数可由多个文件组成,占用一定量的 CPU 内存等计算资源:各云函数完全独立 ...

最新文章

  1. Django ModelForm操作及验证
  2. linux 占用缓存前10_Linux 中的零拷贝技术
  3. Android中measure过程、WRAP_CONTENT详解以及xml布局文件解析流程浅析(上)
  4. c++扔鸡蛋问题egg dropping puzzle(附完整源码)
  5. Linux 下用来查询安装包信息的RPM选项
  6. [活动 3.30]MAUI 跨平台应用开发实战
  7. Redis 集群使用(2)
  8. Pytorch——保存训练好的模型参数
  9. 驳熊节和Martin Fowler的Java消亡论!
  10. GIS案例练习-----------第五天
  11. 485接口EMC电路设计方案
  12. 每日一淘洞察市场消费真相,深挖三四五线城市消费者需求
  13. TriSun PDF 13.0中文版本,TriSun PDF15的发布
  14. 生产系统执行下线操作--泪奔
  15. Java回炉之File
  16. 衬线字体和非衬线字体区别
  17. SQL语句,数据库增加、删除、修改、查询
  18. 如何检查Mac配备的显卡(GPU)?
  19. 【转】使用Eclipse和BlackBerry JDE开发黑莓应用程序
  20. chapter 1 股票数据分析

热门文章

  1. homestead php.ini,Homestead安装php扩展的方法
  2. 2022浅谈前端八大UI库
  3. 【RPGMakerMV】滑冰谜题
  4. 分享 28 个你应该知道的JS 实用小技巧
  5. 大功率降压恒流驱动方案 输出电流可做6A
  6. AAFD-DU-4G故障电弧探测器在医疗场所中的应用
  7. 【2020-10-16】知网专利信息爬虫
  8. 前端如何实现微信扫描二维码下载应用,根据手机系统跳转不同页面
  9. C++17 filesystem
  10. 电池管理系统BMS,BMS菊花链通信系统