无需懂代码，用这三个平台傻瓜式做简单微信小程序开发

一个低调的青年

已于 2025-02-20 23:04:01 修改

阅读量1.8k

点赞数 27

分类专栏： Ai 文章标签：微信小程序 AI编程 uni-app

于 2025-02-20 22:43:12 首次发布

本文链接：https://blog.csdn.net/qq_45579521/article/details/145716969

版权

Ai 专栏收录该内容

1 篇文章

订阅专栏

话不多说，开始操作。

下载软件

为了便于大家快速上手开发，请先下载以下三款必备软件：

HBuilder X 4.45

Cursor（需要科学上网）

微信开发者工具

为了方便下载，以下是相关软件的官方网站链接：

https://dcloud.io/hbuilderx.html
https://www.cursor.com/cn
https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

为了方便小白更好的理解微信小程序的结构，创建微信小程序分为以下三个方面：
在这里插入图片描述

其中，前端小程序是用户看到的“店面”。云服务器是背后的“仓库”和“服务员”，负责存储数据和响应请求。后台管理面板是“老板的办公室”，用来管理和控制数据。

前端页面

首先在HBuilder中新建项目，选择默认模板，点击启用uniCloud，点击阿里云，VUE版本选择2。
创建好之后，点击上面运行，点击微信开发者工具。
使用微信开发者工具打开你在HBuilder创建的文件，关闭编译器和调试器。
打开Cursor，打开刚刚创建好的微信小程序的代码。点击右上角的设置按钮，点击Models模型，勾选上deepseek-V3。

在这里插入图片描述

使用快捷键control+i，呼出composer。输入你想创建的前端需求，输入完需求之后，加入“空格”+@codebase

@codebase是为了让deepseek阅读创建整个代码文件的结构。

在这里插入图片描述

点击确认修改，打开微信开发者工具，就直接显示AI编写的前端页面了。

前端页面就已经顺利完成，现在我们可以进行下一步了

关联云服务器

打开HBuilder，右键uniCloud，点击关联云服务空间或项目。

注意： 若打开该网页显示错误，说明你的账号没有实名或者是你没有该账号，需要实名更新后才能使用。打开该网址，进行实名认证。https://unicloud.dcloud.net.cn/

点击新建服务空间，创建免费版本的阿里云就可以了。
查看状态显示正常就可以下一步了 5. 返回到HBuilder，点击刷新就可以与其相连接了。

上述操作，我们已经把前端页面和云服务器成功的关联起来了。前面我们说：云服务器是背后的“仓库”和“服务员”。对应的仓库指的是云服务器，用来存储和管理数据。而服务员指的是云函数，处理复杂的逻辑和数据操作。下面我们将创建云函数和云数据库：

创建云函数与云数据库

打开Cursor，在Composer中输入

在 @cloudfunctions 中创建一个unicloud云函数。并在 @database 中创建一个feedback.schema.json的文件，向unicloud云数据库中传送用户的姓名，联系方式和反馈内容，请在已有的文件夹中直接创建，不要重复创建cloudfunctions的文件夹。（可以仿照我的输入命令deepseek）

自动生成代码后，点击apply就可以了。返回到HBuilder，在uniCloud下有其对应的cloudfunctions和database
在这里插入图片描述

依次按照以下步骤进行操作。
操作成功以后，右键unicloud，点击打开控制台。
选择云数据库，就可以看到刚刚deepseek创建的数据库文件。
连接成功后，可以在微信小工具上输入相关信息，在自己的阿里云数据库上可以查看到输入的相关信息。

如果到这一步进行报错的话：“提交失败：应用未关联服务空间，请在uniCloud目录右键关联服务空间”。如果遇到这种错误时，先把微信开发者工具和HBuilder关掉，重新打开HBuilder，重新关联一下云服务空间或项目。按照前端页面步骤的第二部重新打开微信开发者工具，点击微信开发者工具“编译”就可以继续了。

完成到这一步的话，现在已经完成了前端小程序和对应的云数据库以及云函数。为了方便数据管理，现在开始制作后台管理面板。

后台管理面板

和前端创建项目的方式一样，按照图片依次点击创建项目。
点击创建好以后，前端小程序和后台管理面板应该连接在同一个云数据库当中，这样的目的就是实现一个数据的互通。点击下一步，最后点击替换。
可以在uniCloud控制台查看项目安装进度，显示初始化完成就说明我们的项目创建成功了。
打开HBuilder，刚刚创建好的后台管理面板，点击关联云服务空间或项目。点击绑定其他项目的服务空间，选择你前面创建的小程序，点击关联就可以了。
双击打开后台管理面板，点击确认覆盖。
数据库也是相同的操作。
创建后台的管理员代码。找到database下的feedback.schema.json，右键schema2code。这个功能就是帮助我们去开发用户意见反馈这项功能所对应的后台管理员面板的代码了。
点击pages_init.json,点击确定，注册，合并。
点击完成后，可以在后台管理面板文件夹下面打开feedback下的list.vue。点击运行到chrome。