云开发小程序(一 模板小程序搭建和运行)

云开发小程序(一 模板小程序搭建和运行)

1、技术选型(核心就是云开发)

注意注意:

这里在微信小程序里面建立的属于微信小程序的原生写法,在HbuildX里面搭建的才是uniapp才是uniapp官方的,这里我就踩坑了!

下面开通的是微信原生云的小程序,注意注意!!!!

这里我花了19.9开了一个错误的小程序开发.....

官方网站developers.weixin.qq.com/miniprogram...

云程序最近算是比较火一些,那么最近创建和开发一个云程序应该怎么开发呢?接下来我就带你一步一步开发一个小程序。

首先我们针对技术进行一些选择,后期不够再补充,确认我们云程序主要涉及到的程序部分

🌂 小程序前端

主要就是采用uniapp+vue3这一套的方法,方便快速加载,然后拿HbuildX新建项目

🌂 小程序后端

  • 数据库

云数据库(云存储)

云数据库是云开发自带的数据库(json类型的弱关系型的基于MongoDB的数据库)

  • 后台(云开发)

基于小程序官方自研的云开发和云函数实现后台数据的管理(CMS部分)---也就是我们拿CMS网页端来管理后台

优点

主打方便快捷

  1. 无需搭建后端服务

    • 云开发提供了完整的后端服务支持(数据库、存储、云函数),开发者无需搭建和维护自己的服务器。
  2. 一站式开发环境

    • 在微信开发者工具中可以直接操作云开发的各项功能(数据库管理、云函数编辑)
  3. 弹性扩展和高可用性

    • 基于微信的分布式架构(弹性扩展、高可用性、高并发),不过你千万别拿来开发复杂应用就对了。
  4. 安全保障

    • 安全的数据访问,保护用户数据的安全性(开发什么部分都得权限和规则)。
  5. 开发效率提升

    • 云开发可以快速构建和部署小程序。
  6. 成本控制

    • 按量付费,避免传统后端服务的固定成本(除了免费额度,啥都收钱)。

功能组件:

  • 云数据库:基于 MongoDB 的数据库存储解决方案,支持实时同步、自动索引等特性。
  • 云存储:提供了持久化文件存储服务,支持图片、音频、视频等文件类型的存储和管理。
  • 云函数:类似于服务器端的函数计算,可以在云端执行业务逻辑,与数据库和存储服务集成。
  • 云调用:支持 HTTP API 调用和 WebSocket 等网络协议,小程序能够与云端服务进行通信。

2、项目搭建和创建

项目管理

这里我们直接使用Gitee去管理我们的云小程序,这一步Gitee如何搭建和创建小程序我们就直接跳过了,想看的可以去看看我文章之中关于GItee的使用 。

项目创建

接下来我们就从0开始搭建一个云的小程序,这里面涉及到CMS后台的管理,当然为了云,含泪给花了十块钱开发了一个后台

打开开发者工具,然后直接新建一个什么都没有的小程序,APPID自己记得申请一个哦!

先点击不使用云函数,然后我们去项目云函数里面去开通

项目新建以后直接在开发者工具之中打开了,我们点击这个去配置对应的云函数

好家伙,云函数已经成为了19.9一个月了,这个时候就,,只能含泪开通了,希望最后自己在这块能挣回来这19.9吧。目前打赏自己的也就2.9,心疼啊!

新用户一般都有一个月免费试用

项目创建成功以后,我们再次点击这个云函数

这个时候我们已经可以看到我们的后台各种环境和应用了

这个时候,微信给我发了一个通知,说我已经开通了云函数小程序,然后我可以去后台进行对应的体验,打开小程序以后,给了一个pc链接,是CMS的,然后直接打开我们就看到了下面这个页面!

不得不说,是非常非常方便啊!

接下来我们就进入开通我们的CMS内容管理系统试试

开通路径如下:

在最右上角设置=> 拓展功能 => 内容管理cms部分点击

点击之后会给我们进行环境初始化,需要耐心等待一会

然后成功以后我们就可以看到后台

点击打开管理端就可以进入这个界面,说实话,这里感觉他步骤涉设计的过于麻烦了一些

然后我们开始创建一个项目然后尝试一下

完成以后这里已经显示我们创建成功项目了!

接下来点击右侧

点击创建下一步我这里

然后我们开始创建一个项目然后尝试一下

这里推荐我们去安装云模板CMS,然后我们找一下,然后我发现是因为改版的原因,所以我这就是最新的CMS管理后台(奶奶个腿!!)

然后我们可以继续创建模板和相关的数据尝试一下。

3、以模板为主搭建

这里我们选择一个模板然后直接搭建,直接选择一个

这里会给我们一些提示什么的

因为上面砸门其实已经搭建了一个环境,这里我们就选择这个环境进行尝试

然后接下来就是等待完成

然后我们发现竟然还需要其他的乱七八糟,新建代码以后,会是一个原生小程序,不符合我们预期,所以我们接下来拿HbuildX搭建一个uniapp系列的uniapp-uniclound开发,之后再引入我们的云函数!

相关推荐
学不会•1 小时前
css数据不固定情况下,循环加不同背景颜色
前端·javascript·html
活宝小娜3 小时前
vue不刷新浏览器更新页面的方法
前端·javascript·vue.js
程序视点4 小时前
【Vue3新工具】Pinia.js:提升开发效率,更轻量、更高效的状态管理方案!
前端·javascript·vue.js·typescript·vue·ecmascript
coldriversnow4 小时前
在Vue中,vue document.onkeydown 无效
前端·javascript·vue.js
我开心就好o4 小时前
uniapp点左上角返回键, 重复来回跳转的问题 解决方案
前端·javascript·uni-app
Random_index4 小时前
#Uniapp篇:支持纯血鸿蒙&发布&适配&UIUI
uni-app·harmonyos
开心工作室_kaic5 小时前
ssm161基于web的资源共享平台的共享与开发+jsp(论文+源码)_kaic
java·开发语言·前端
刚刚好ā5 小时前
js作用域超全介绍--全局作用域、局部作用、块级作用域
前端·javascript·vue.js·vue
沉默璇年6 小时前
react中useMemo的使用场景
前端·react.js·前端框架
yqcoder6 小时前
reactflow 中 useNodesState 模块作用
开发语言·前端·javascript