1. Introduction

Recently, various domestic agent tools are running promotions, and I got a bunch of free credits that I can't use up. So I set myself a small goal: use AI to launch a mini program from 0 to 1, running the entire process to see how far AI can actually help and which steps still depend on myself.

Here's the finished product👇👇👇

"Card Game Score Tracking", a WeChat mini program for keeping score in card games. Search it in WeChat to try it. Open a room, scan to join, tap an avatar to record scores, and at the end one tap calculates the minimum-transfer plan for "who pays whom how much". It also includes voice announcements and statistics of past results.

Now I'll go through the actual order: how I defined requirements, how AI collaborated, the pitfalls along the way, how I passed review and launched, and finally how individual mini programs can make money.

2. Defining Requirements

To make a mini program, the first step is not writing code but defining requirements. AI can help you here, but the decision is yours.

First, a hard constraint: mini programs have many restrictions for individual developers. UGC content is basically not allowed, AI-related content is extremely restricted, and only simple tool-type features are possible. If you choose the wrong direction, review will reject you. So when defining requirements, consider two things: the scenario must be real, ideally a pain point you yourself encounter and people around you recognize; and the content must be safe, avoiding sensitive categories like UGC and AI generation.

Once I settled on the requirements, I gave them to AI to turn into a proper PRD (using workbuddy, with model glm 5.3 flash).

A key insight here: the more detailed the PRD, the less likely AI will drift later.

Don't just say "make a bookkeeping mini program". Better to describe data structures, state transitions, edge cases. If you slack off at this step, everything later becomes pits.

3. Preparations

Before starting, set up the environment and accounts:

1. Download and install WeChat Developer Tools: link
2. Register a WeChat mini program: link, get AppID (Console => Development Management => Development Settings)
3. Open WeChat Developer Tools, select the project directory, fill in AppID, choose "WeChat Cloud Development" for backend, and check the "Cloud Development Service Agreement"
4. Click the "Cloud Development" button on the left of the toolbar to open the cloud console, follow the prompts to enable and create a cloud environment, then get the environment ID

Also, if you need to use WeChat's plugin capabilities (like text-to-speech), individual accounts must apply separately in the WeChat Service Market; otherwise the related APIs won't work.

4. AI Collaboration Process

4.1 Choosing the Tech Stack

I chose the uni-app CLI framework for a simple reason: cross-platform, one codebase supports both mini programs and H5, making it easy to extend to other platforms later.

4.2 Letting AI Produce Design Drafts

UI design is the part I dread most. My approach was to give AI a few adjectives—"simple", "clean", "easy to use"—ask it to follow Ant Design style and go with a blue color theme, then use MiniMax M3.1 flash to design four pages: home, room, settlement, and statistics.

The generated design drafts went into the design/ directory, each page an HTML file containing layout styles, proportion relationships, overview, as well as global theme, color scheme, rounded corners, shadows.

The value of this step is that AI turns "a feeling I can't describe" into a visible, confirmable draft. You don't need to know design, but you can see which one looks good.

4.3 Setting Up Engineering Rules for AI

This is the most worthwhile thing in the entire process.

The biggest problem with AI writing code is that it doesn't know your project conventions and tends to write inconsistently. So I first built a set of rules for it: breaking the project standards into several files placed in a rules directory, with a scenario routing table so AI loads the relevant rules by task type instead of reading everything; each change leaves a trace recording what was changed and why, keeping everything auditable; and turning the design style into reusable prompts so later pages stay consistent.

With that, AI has a basis for each job and output quality is much more stable.

4.4 Step-by-Step Implementation with Confirmation

I gave AI the AppID and cloud environment ID (these are not secrets, no worry about leakage) and let it plan implementation steps according to the PRD, with me confirming after each step.

My feeling is that AI isn't writing code for you; it's executing steps you've already thought through. You handle decisions and acceptance; it handles implementation. Treat it as a teammate with strong execution, but you need to explain the requirements clearly.

5. Pitfalls

Running through the whole process, the pitfalls concentrated in these categories:

1. AI cannot directly operate the WeChat cloud development console, but it tells you the steps to configure manually—database key names, cloud function uploads, cloud storage all need to be done yourself.
2. Even with design drafts, there was constant fine-tuning; performance and interaction experience—AI's first version is never the final version.
3. You need some development experience: knowing what effect you want (maybe you've seen it but can't describe it), how to lay out buttons, how to make page transitions more logical—AI can't replace your judgment there.
4. Free cloud development storage has quota limits, so resources like avatars might not fit unless you upgrade to a paid plan.
5. The free trial environment has a trap: each mini program account can create 1 free trial environment, but once the mini program has a production release, the free environment only lasts 15 more days, then you must switch to a paid plan or it stops.
6. Cloud functions respond slower than self-hosted CDN, but they're cheaper and integrate nicely with WeChat's ecosystem, enough for individual developers.
7. Scan, share, and Canvas are the three biggest platform pitfall areas; AI-generated code breaks there most easily, so verify on real devices.

6. Launching the Project

1. Click Submit in WeChat Developer Tools, fill in version number and description, click Upload.
2. The uploaded version is a trial version. You can add trial accounts, which can view it via scanning a QR code in WeChat.
3. Submit the trial version for review. After approval, click Publish and the production version appears in the mini program.
4. Personal certification: click Certify in the mini program console, fill in info and wait for review. Each attempt costs 30 yuan, non-refundable, and don't miss the phone call.
5. After certification, you must also file the mini program (备案) by filling in information in the backend.
6. Once all done, it becomes searchable in WeChat's search.

One last reminder: before review, carefully go through the on-page copy and feature descriptions, clearly state the boundaries of what the app does, so it doesn't get misjudged as forbidden content.

7. How Individual Mini Programs Make Money

Once the tool is built, how do you make money? Individual developers have two main routes: ads and virtual payments.

Previous article: Development of personal WeChat mini programs: category selection / monetization methods / cost control and server integration guide

7.1 Ad Monetization

WeChat's ad components are available to individual accounts, but only after cumulative unique visitors reach 1,000 can you enable the Traffic Master.

Common ad placements are four types:

Ad Type	Description	Suitable Scenarios
Banner	Fixed position on page	Bottom of home or list pages
Rewarded Video	Users watch video to get reward	Unlock premium features, view full reports
Interstitial	Pops when page switches	After completing action, exiting page
Native Template	Card embedded in page content	In list feeds

A few practical suggestions: rewarded videos have the best value, high unit price, users watch willingly without annoyance, good for "watch a video to unlock a feature"; don't pop interstitials on entering the page, that's a terrible experience and loses users; place ads naturally in context, don't force them next to core action buttons.

Ad revenue is still very low initially; you need stable daily active users for it to matter, so early focus should be on making the product solid. Don't sacrifice experience for monetization; too many ads and hard paywalls will drive users away.

7.2 Virtual Payments

Virtual payments in mini programs require opening a WeChat Pay merchant account, and individual accounts are subject to more restrictions. Common patterns are virtual goods (points, membership, skins, stickers), subscription memberships (monthly or yearly, unlocking ad-free, cloud sync), and various added-value features (advanced statistics, export reports, custom content).

Also, compliance first: anything involving payments must go through WeChat's official payment, don't use third-party collection.

8. Conclusion

AI can help you write code, draw design drafts, search for information, but how to define requirements, how to design architecture, what to do and what not to do, how to pass review—these are the real hurdles.

The technology of mini programs isn't complicated, especially now with AI, the barrier is almost zero.

The key is whether you can find a real, small pain point and polish it to the extreme; otherwise it's just self-indulgence, because you'll have no income and no users.

Wishing everyone can build your first mini program with AI.

That's it for this sharing. I'm Peng Duoduo, a front-end technical creator. If you found it helpful, feel free to comment, follow, like, share. See you next time~

PS: Press F12 on this page, type in console document.getElementsByClassName('panel-btn')[0].click(); for a surprise.

Previous articles

• Page closed still receiving notifications: browser offline notification development tutorial
• New era! OpenSpec+SDD specification-driven AI agent development project practical guide
• Trae uses Pencil to create design drafts and a hands-on tutorial for migrating Figma design files
• React-OAuth for Google/GitHub login tutorial and cases
• Pure front-end face recognition: face-api.js hands-on deep analysis tutorial
• Development of personal WeChat mini programs: category selection / monetization methods / cost control and server integration guide
• Editor's evil tricks? Inventory of VS Code evil/fun extensions
• Let web pages have App experience? PWA turns web pages into desktop applications in a step-by-step tutorial
• Using nvm to manage node.js versions and changing npm to Taobao mirror