How to Build a WeChat Mini Program with WorkBuddy: A Beginner's Guide

@songsong
УПРОЩЁННЫЙ КИТАЙСКИЙ07 авг. 2026 г.
162K
750
156
30
1.3K

Суть

This guide demonstrates how to use WorkBuddy AI to build WeChat Mini Programs from scratch, including code generation, debugging, and cloud deployment for non-coders.

If you want to make a WeChat Mini Program, you might first be blocked by a bunch of things: WeChat Developer Tools, project directories, AppID, cloud development environments, databases, uploading, and backend version management.

What are all these? You haven't even written a line of code yet, and you're already stuck on these technicalities.

It doesn't matter. Even if you've never written code, never made a Mini Program, or don't even know what an AppID is, this article is written for you.

What it's like to build one in a single afternoon

After reading this, you will know how to:

  • Import code into WeChat Developer Tools (without needing to register an AppID first)
  • Open it on your own phone
  • Generate a QR code to send to friends for testing
  • Submit for review, go live, and be searchable

First, look at my finished product.

宋宋 - inline image

Looks decent, right? Let's get started.

I. Ten Minutes Before Starting

Open WorkBuddy, find the "WeChat Mini Program Developer" expert in the experts, skills, or connectors column, and summon it.

宋宋 - inline image

Then, don't just say "Help me make a Mini Program."

text
1I want to make a daily habit tracking Mini Program for my own use.
2First step, what do I need to communicate with you? Don't write code yet; let's discuss it first.

Replace "daily habit tracking" with your own idea.

Then it will ask you how you want to store data, how complete the first version should be, what development method you plan to use, if you need daily reminders, what the habit types are, the time granularity of reminders, visual style preferences, and finally, it will ask you to fine-tune classification dimensions, archiving/deletion, and statistical cycles.

It helps you think through all these questions you hadn't considered and sets the direction.

Don't aim for perfection initially; let it build version 1.0 first. Once you have the basic framework, you can slowly adjust and modify it. Once the direction is set, let it start working.

While it's writing the code, you can install the WeChat Developer Tools.

This is the official tool from WeChat because your Mini Program will eventually run, preview, and upload from here. Search for "WeChat Developer Tools" on the official download page, select the Stable Version, follow the prompts to install, and scan the code to log in. Once inside, it looks like this:

宋宋 - inline image

A few points to note:

💡 For your first time, keep it to one or two functions. The more functions, the more pages to generate and the more errors that might pop up. Fix the core first.

💡 Switch the model to HY3; don't leave it on auto. It's currently free for a limited time with unlimited use. (Check the backend to see if the promotion is still active when you read this.)

⚠️ It's common for menu names to differ from what I say. These software tools update frequently. If you have a problem, just throw a screenshot to WorkBuddy, and it will tell you where to click.

When the code is finished, it will give you a project folder path. Keep this path in mind; you'll need it for the next step. It usually provides import instructions; if not, just ask: "The code is ready, how do I import it into WeChat Developer Tools?"

Now, you have: a full set of Mini Program code and the WeChat Developer Tools installed.

Everything is ready. Time to preview the semi-finished product.

II. Viewing the Semi-Finished Product

Open the WeChat Developer Tools you just downloaded, scan to log in, and click the + button.

Then fill in these three:

  1. Project Name: Anything you like, as long as you recognize it.
  2. Directory: Paste the address from the previous step.
  3. AppID: It might show red; that's fine. Click "Test Account" to continue smoothly.
宋宋 - inline image

For Backend Service, select "Do not use cloud services." Click Create, then click "Trust and Run." The tool will start building automatically.

⚠️ When you must switch to a formal AppID: If you want to use WeChat Cloud Development, upload it, or let others experience it, register a free one using an email. Chapter 6 explains this in detail.

⚠️ Also, think carefully about the category before registering. You have to choose between Mini Games and others, and it cannot be changed later.

If all goes well, you'll see your Mini Program in the tool: the simulator on the left and the code on the right.

Now, you have: a Mini Program running on your computer.

Or, you might see a screen full of red error text. Don't panic; it's easy to fix.

III. Red Text Everywhere? Let the Author Fix It

It's normal to have errors during the first build.

The solution is simple: Let whoever wrote it fix it. 😂

Specifically:

  1. Find the Debugger panel in WeChat Developer Tools; all red errors are there.
  2. Copy the entire error message—don't just take a partial screenshot or paraphrase it.
  3. Send it to WorkBuddy. You don't even need to say anything; it will fix it for you.

After analyzing, it will either fix the code directly or guide you through the necessary settings.

Two things to note:

⚠️ One type of "error" isn't really an error: Mini Programs don't support some web-style coding (like certain selectors or hover effects). If it looks weird on the computer, it's because the Mini Program doesn't support it. Just tell the AI: "This effect isn't supported in Mini Programs, use another way."

⚠️ Another is a "fake" error: Changes don't take effect. Don't doubt the AI yet; click the "Compile" refresh button next to "Normal Compilation" in the top right. That usually fixes it.

Now, you have: a smooth Mini Program with no white screens or issues.

It looks great on the computer simulator, but it might not be the same on a real phone.

IV. It Looks Good on PC, but Maybe Not on Mobile

It's common for styles to be misaligned or buttons to be unclickable on a real phone even if they work in the simulator. Screen sizes and touch vs. mouse are different.

To get it on your phone, click one button: Preview.

宋宋 - inline image

The tool generates a QR code. Scan it with WeChat, and your Mini Program opens on your phone.

Here is where people get confused: Preview, Real Machine Test, and Remote Debugging all generate QR codes. What's the difference?

Action

What you get

When to use

Preview

Opens directly on phone to see effects

Quick checks after minor changes

Real Machine Test

Runs the full process; can choose Android or iOS

To see if it behaves differently on different phones

Remote Debugging

Runs on phone while showing logs on PC

When a bug happens on phone but not on PC

⚠️ Don't use Preview as a final test. Preview is just for a quick look; it doesn't mean everything works. Use Real Machine Test for confirmation.

⚠️ One more thing: To facilitate development, some checks are disabled in the tool, but they are still active on real devices. Sometimes it works on PC but fails on mobile.

Now, you have: a Mini Program that opens on your own phone.

You're probably itching to send the code to a friend. Wait, run these five checks first, or it might be full of bugs! 😂

V. Don't Let Friends Test Your Bugs

It takes five minutes. Run these five items yourself:

  1. Add: Add a new entry; does it appear in the list?
  2. Status: Toggle between completed and incomplete; does it work?
  3. Re-entry: Exit the Mini Program and reopen it; is the data you just added still there?
  4. Delete: Delete an entry; does it stay gone after refreshing?
  5. Empty Values: Click add without filling anything; it should give a prompt and not create an empty record.

Items 3 and 5 are often missed if you don't specifically test them.

After fixing any item, re-run all five. Fixing A often breaks B.

⚠️ Passing all five just means it won't crash immediately. This is a polishing process where you'll find weird issues or get new ideas. Eventually, you'll have a version you're satisfied with.

Now, you have: a polished Mini Program you're happy with.

Now you just need one last thing to send it to friends: a formal identity.

VI. Send a Code for Friends to Scan

To let others scan it, you need a formal AppID. How to register:

  1. Open the WeChat Official Accounts Platform and follow the registration process. There are several types: Official Accounts, Mini Programs, Mini Games. Choose Mini Program. ⚠️ Choosing the wrong one can't be changed; you'd have to delete and restart.
  2. Use a clean email. Enter the email, click activate, enter the verification code sent to your inbox, and set a password.
宋宋 - inline image
  1. Select Subject. For personal use, choose "Individual." It requires ID verification and a WeChat scan; it's free.
  2. Enter the backend, find AppID under Development Management. It starts with "wx"; copy it.
宋宋 - inline image

Once you have the AppID, send this to your WorkBuddy:

text
1Change the AppID in the project to my AppID: [your wx... string]

Then go back to WeChat Developer Tools and click "Upload" in the top right.

宋宋 - inline image

It will ask for a version number and notes. Use 0.0.1 for the first time. After uploading, go to the Version Management page in the WeChat backend. You'll see the version; click the down arrow to find the "Trial Version." Once set, it gives you a Trial QR code.

宋宋 - inline image

Now you can show off your Mini Program to friends! They can use it by scanning without you needing to publish or pass a formal review.

Two things to note:

First, uploading is not publishing. Uploading just puts the development version in the backend. It's not searchable yet; only people with the code can enter.

Second, Trial Versions have an expiration. Usually seven days. Just re-upload to get a new code. It's perfect for demos or sharing with a few friends.

⚠️ For many, this is enough. If it's just for personal use or friends, the Trial Version works fine. I'll explain certification and filing in later chapters.

Now you have: a Trial QR code to send to friends.

You've made a real Mini Program. But if a friend adds data and closes the app, it disappears. How do we save data?

VII. Don't Lose Data When Closing

We haven't solved where your data is stored.

If data only exists locally on the phone, it's lost if you switch phones or want to share it. You need a backend. Setting up your own backend involves servers, databases, domains, HTTPS, and filing. Let's skip the hassle and use Cloud Development. The database and logic are in the cloud; the Mini Program calls them directly.

  1. Click "Cloud Development" at the top of the tool → Activate → Note the Environment ID.

When you click activate, it might show a 19.9 RMB/month fee, but wait—it should automatically guide you to a free development environment.

宋宋 - inline image
  1. Copy the Environment ID and send it to WorkBuddy to set the globalData.env ID.
宋宋 - inline image
  1. Cloud Development Console → Database → Create collections like categories / habits / checkins. Set permissions to "Creator only can read/write." WorkBuddy will tell you which collections to create.
宋宋 - inline image
  1. Right-click cloudfunctions/loginUpload and Deploy: Install cloud dependencies. This ensures the cloud function can find the packages it needs.
宋宋 - inline image

One tip: If you can't find cloudfunctions in your project, your import folder might be wrong. Change it to the parent folder.

Now that the data landing is ready, reload the project. It will ask for the AppID and Cloud Environment ID.

⚠️ You can't use a test account for this; you need a formal AppID.

⚠️ Cloud development sometimes has promotions for new users, but they are time-sensitive.

Re-import the version that saves data, paste your AppID, and select "WeChat Cloud Development" for the backend service. Now, data is connected.

宋宋 - inline image

Data storage is done. If you want strangers to find you or use it commercially, the real challenge begins.

VIII. Letting Strangers Find You

Passing a Trial Version is different from passing an official review.

Run these six self-checks first:

  1. Is the AppID formal? Test accounts can't go live.
  2. Click every page. No white screens or crashes.
  3. Configure server domains. If your app fetches external data, those domains must be configured in the backend (Development → Development Settings). Only HTTPS and WSS are allowed, and the domain must be filed (ICP). IPs are not allowed.
  4. Uncheck "Do not verify request domain..." in the developer tools. This only works in the tool; real devices will still verify. Turn it off and test again.
  5. Fill out the User Privacy Protection Guide. If your app reads avatars, location, or contacts, you must declare it. Otherwise, those APIs will be disabled. Skip this if you don't touch user info.
  6. Complete the name, avatar, intro, and category in the backend. Choosing the wrong category is a common reason for rejection.

💡 If you use Cloud Development or don't use the internet, skip steps 3 and 4.

🔴 I've prepared this for you; just send it to WorkBuddy:

text
1I'm submitting a WeChat Mini Program for review. Help me check this project against these points.
2Fix what you can, and tell me what I need to fill in manually.
3Check if the appid in project.config.json is a test account.
4List all page paths in app.json so I can check for white screens.
5Search the project for wx.request, wx.uploadFile, wx.downloadFile, and wx.connectSocket.
6Extract all domains and group them into these four categories.
7Mark any that don't start with https/wss or use IPs so I can configure them in the backend.
8Change urlCheck in project.config.json to true if it's false.
9Search for user info APIs (avatar, location, contacts, etc.) and list which files/lines use them.
10I'll use this for the Privacy Protection Guide.
11Check for any leftover console.log debugging code.
12Finally, give me a summary table with: Check Item, Current Status, and Next Step.

⚠️ Don't skip step 2. Official reviews require a complete product. Rejection for "incomplete functionality" is common.

Then there are 4 hurdles before submission:

宋宋 - inline image

1️⃣ Mini Program Info

  • Name: Something recognizable (e.g., "Habit Tracker"). Personal accounts can't use "Official" or "WeChat."
  • Icon: 1024x1024 PNG.
  • Intro: One sentence explaining the function.
  • Service Scope: Choose "Tools > Efficiency" or "Life Services."

2️⃣ Category

Personal accounts are limited. Recommended: Tools > Efficiency or Notepad. The category determines which APIs you can use.

3️⃣ Filing (ICP)

As of 2024, all Mini Programs must have ICP filing. You need an ID photo and face verification. It takes 1-3 business days.

4️⃣ WeChat Certification (Optional but recommended)

Feature

Uncertified

Certified

Searchable

! No

! Yes

Sharing

! No official tag

! Has certification tag

Payment

! No

! WeChat Pay available

Cost

Free

300 RMB/year

Personal accounts can be certified for 300 RMB/year. If you don't want to pay, you can skip it—it won't stop you from publishing, but you won't be searchable.

Common rejection reasons: missing medical/financial qualifications, missing live-streaming permissions, or incomplete functionality. Review usually takes 1-7 days.

See? You Made It

You spoke to the AI, and the code appeared.

You filled in a path, and the page showed up.

You sent back the red text, and it fixed itself.

You scanned a code, and it ran on your phone.

You clicked upload, and friends could scan it.

From start to finish, no coding knowledge required.

Just do one thing tonight: install the WeChat Developer Tools. It takes ten minutes.

Once installed, you'll be itching to throw something in and run it. By then, you've already started.

If someone you know wants to make a Mini Program but hasn't started, send them this. It'll save them a weekend.

I am Song Song. I'll keep sharing useful content.

Переделать в YouMind

Превратите одну вирусную статью в полноценный рабочий процесс создания контента

Собирайте источники, расшифровывайте паттерны, создавайте активы, пишите черновики и публикуйте контент из одного рабочего пространства ИИ.

Исследовать YouMind
Для авторов

Превратите ваш Markdown в аккуратную статью для 𝕏

Когда вы публикуете длинные тексты, изображения, таблицы и блоки кода, форматирование в 𝕏 становится мучением. YouMind превращает полный черновик в Markdown в чистую статью, готовую к публикации в 𝕏.

Попробовать Markdown для 𝕏

Другие паттерны для анализа

Недавние виральные статьи

Смотреть другие виральные статьи