Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

我猜你现在可能是这样的…

脑子里有个超棒的点子:“我想做个记录奶茶打卡的小程序!” “我想做个帮室友拼单的小程序!” “我想做个…”但一搜教程,满屏的HTML、CSS、JavaScript…要直接晕掉。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

也有可能是这样的

被老板/老师突然派活,“下周要上线一个活动报名小程序,你负责一下” 。

你表面:“好的没问题”

内心:“我连Excel函数都用不利索啊!”

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

或者

看着别人做的小程序眼红,为什么别人都能做,就我不行?

不是不想学,是真的看到代码就生理性头痛啊!!

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

别怕!有我「 WorkBuddy 」在!

不跟你说什么技术术语,我们就像朋友聊天一样,把你的想法变成真的小程序。话不多说先展示成果。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

快来跟着WorkBuddy,轻松做出你的第一个小程序。

以 Buddy 刚做的计算食物热量小程序干饭不超标为例。

第一步:选专家

先在左侧专家栏目里搜索「微信小程序开发者」,点击召唤。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

或者在提示词框下面的「 Craft 」里点击召唤专家」,搜索微信小程序开发者。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

第二步:告诉我你想做什么

不用准备什么,就像跟朋友描述你的想法一样告诉我:

比如:“帮我做一个小程序。它的主要功能是通过输入摄入食物来计算碳水、脂肪、蛋白质的含量,面向普通群众和健身爱好者,页面简单干净”。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

小提示:说得越具体越好!比如:

● 要有什么功能?

● 给谁用?

● 长什么样子的?

第三步:我帮你设计规划

听完你的想法,我就开始敲代码了!同时也会生成一个任务列表,供你查看任务进度。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

📚 创建小程序基础结构和配置文件

🔍 实现食物搜索和选择功能

📚 实现营养计算器核心逻辑

📚 设计并实现页面UI

👤 添加数据存储和历史记录功能

第四步:交付任务

几分钟过后,我「 WorkBuddy 」就会推送消息,告诉你任务完成了!

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

还会告诉你,怎么进一步使用。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

这样,小程序的基础结构就已经做好并存入你的电脑里啦,只剩后续细节调整和发布啦!

第五步:查询文件位置

点击任务条右侧「 … 」点开「打开文件夹」。或者在输入指令前新建文件夹,并在提示词框旁边选定这个文件夹,就可以把产物放在这里了。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

敲黑板!!!

一定要找到app.json所在的文件夹/一级目录,这才是小程序的项目文件夹,记住位置。

 

有时候WorkBuddy 会在任务文件夹下面创建二级小程序项目文件夹,有时候会直接就是任务文件夹根目录。因此我们可以通过app.json的所在位置识别。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

如何在微信上使用?

第一步:下载微信开发者工具

网站搜索「微信开发者平台」,下载开发工具。(根据你的需求下载相对应的版本)

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

第二步:导入代码

打开微信开发者工具扫码登陆后,点击「 + 」。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

 项目名称:按你设计的内容进行填写;

 

 目录:择WorkBuddy生成的小程序项目文件夹(上面提到的那个app.json所在的文件夹,确保app.json在这个文件夹的根目录下,对应步骤五图片中的信息);

 

 AppID:注意要选择前期工作中申请的账号,如果是预测号将无法上传代码进行审核“如申请 AppID ”见本文末尾);

 

● 点击创建。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

创建后进入开发界面

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

第三步:调试

如果下方调试器的位置,有感叹号代表着有错误。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

不用着急!直接把错误段复制,在生成代码的任务条目里粘贴发给我,并让我在本地生成的文件中修改。我就会直接帮你改掉错误代码。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

几秒钟后,你就会收到修正完的代码了。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

再去微信开发者工具里,分别点击资源管理器刷新和编译刷新。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

如果再有问题,那就继续发给我,我会一直耐心帮你解决问题!

第四步:预览

点击上方预览、编译并预览(右边的画面也是可以操作的哦!)

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

画面就是这样啦!你可以在这里面模拟用户在小程序内的各种操作。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

到这里,怎样用我「 WorkBuddy 」搭建一个可以使用的小程序就完成了!

上线发布

第一步:上传代码

在预览完成后,觉得没有问题了,就点击页面右上角「上传」。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

输入版本号,提交过后系统会自动先上传到你的微信公众平台。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

第二步:审核

打开微信公众平台,进入版本管理页面,下方开发版本框中就可以看到你所上传的版本。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

点击审核。(之后如果你要更新小程序系统只需要先给我描述你要更新的功能,之后让我更新代码,再重复上传、审核两个过程就可以。)

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

一般审核会持续1-7天,通过后会右侧的「详情」会变成「发布」,点击后你的小程序就直接更新了!

附:App ID申请方法

 

第一步:申请 App ID(测试号无法上传代码)

打开 https://mp.weixin.qq.com/cgi-bin/wx?token=&lang=zh_CN,点击前往注册

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

按顺序填写你的信息。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

点击注册后填写信息。(注意,如果你搭建的小程序是游戏,需要选择单独的游戏类目)

第二步:补充小程序信息

注册过后,页面会跳到微信公众平台的主页面。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

进入页面里,填写你的小程序的信息,包括名字、头像和一段功能介绍。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

第三步:补充小程序类目

根据小程序的功能,匹配相应的功能。比如:搭建一个计算每日摄入食物热量的小程序,它就属于工具类-计算类目。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

注意:

一定要添加合适的类目,不同类目有不同的资质要求。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

添加过后,设置主营类目。你选择的主营类目与小程序是否匹配会直接影响后续小程序的上线是否能够通过。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

第四步:微信认证

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

进入页面后,按要求填写个人信息。(个人认证30元、企业认证300元)

第五步:备案

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

点击去备案后,按照顺序填写个人信息,提交后一般5个工作日会审核完毕。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

至此,整个搭建小程序包括前期注册以及后期上传发布的流程就结束啦,全程无需你敲代码,只需要你点点鼠标、打打字就实现了!

现在就开始吧!

Buddy知道,很多有想法的文科生朋友存在一个误区:“做小程序是程序员的事,跟我没关系”。

但Buddy想说,有想法的人最珍贵。

Workbuddy教程:0基础小程序搭建教程:从开发到注册手把手教你

WorkBuddy的存在,就是让技术不再成为你的阻碍。你只需要专注于“想做什么”,“怎么实现”交给本Buddy。

有想法了吗?

跟我说说看:“我想做一个小程序…”不管多天马行空,都有Buddy在!

行业动态

从Prompt、Context到Harness,工程的三次进化与终局之战

2026-5-20 10:45:00

开源项目

last30days-skill测评:一个专治"信息焦虑"的开源研究神器

2026-3-26 23:05:01

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧