Mini Programs and Apps

Website, Mini Program, or App?

After building their first web product, many people start wondering: should I build an App? Should I launch a WeChat Mini Program?

Hold on — think about this core question first: where are your users?

If you're targeting international markets and users primarily access via browser, then the web is enough. Build a solid website, nail your SEO, implement PWA (Progressive Web App), and the experience is already close to a native app. In 90% of cases, the web is the best bang for your buck.

If you're targeting the domestic Chinese market, then WeChat Mini Programs are worth considering. Chinese users have very different habits from overseas users — they're accustomed to doing everything within the WeChat ecosystem, and scanning a QR code to open a mini program is far more convenient than typing a URL.

Quick Decision Table: Which to Choose

Your Situation	Recommended Approach	Reason
International users, tool-type product	Web (PWA)	Zero install friction, SEO-friendly, fastest iteration
Chinese users, lightweight service	WeChat Mini Program	User habits, WeChat Pay, viral sharing
Complex interactions / high-frequency use	App	Push notifications, offline experience, hardware access
Validating an idea quickly	Web	Lowest development cost, fastest launch
Limited budget, multi-platform coverage	Cross-platform framework	One codebase, multiple platforms
Both domestic and international	Start with Web, expand later	Don't spread yourself thin — nail one first

Core principle: Build the web version first and do it well. Once you have a stable user base and revenue, then decide whether to build a mini program or app based on user needs. Don't aim for "full platform coverage" from the start — that only leads to doing everything poorly.

The Web's Advantages: Why It's Usually Enough

Before discussing mini programs and apps, seriously consider what the web can already do:

Capability	Web Support?	Notes
Cross-platform	✅	One URL, accessible on all devices
Push notifications	✅ (PWA)	Service Worker supports Push API
Offline use	✅ (PWA)	Service Worker caching strategies
Add to home screen	✅ (PWA)	Looks like a native app icon
Camera access	✅	WebRTC API
Geolocation	✅	Geolocation API
Local storage	✅	IndexedDB, up to hundreds of MB
File read/write	✅	File System Access API
Bluetooth	✅ (limited)	Web Bluetooth API
Push + background sync	✅ (PWA)	Background Sync API

What the web can't do:

Complex background tasks (apps can run in the background for extended periods)
Deep hardware integration (NFC, fingerprint authentication, and other native APIs)
App store distribution channels
User preference for "downloading an app" in certain countries/regions

So unless your product explicitly needs any of the above capabilities, the web is your best starting point.

WeChat Mini Program Development Guide

Step 1: Register a Mini Program Account

Go to mp.weixin.qq.com and click "Register Now"
Select "Mini Program" as the account type
Enter an email (one not previously registered on the WeChat Official Accounts Platform) and password
Check your email for the verification link and click to activate
Choose your entity type:
- Individual: Only needs an ID card, but features are limited (no WeChat Pay, no virtual payments)
- Sole proprietorship: Needs a business license, can use WeChat Pay
- Enterprise: Needs a corporate business license, full feature access
Complete entity verification (individuals are exempt; enterprises need bank transfer verification or WeChat verification, costing 300 RMB/year)
Enter the Mini Program backend and get your AppID (needed for development)

Step 2: Install the Development Tools

Download the WeChat Developer Tools, log in with your WeChat account, create a new project, and enter your AppID.

Project directory structure:

my-miniapp/
├── pages/
│   ├── index/
│   │   ├── index.wxml    ← Page template (similar to HTML)
│   │   ├── index.wxss    ← Page styles (similar to CSS)
│   │   ├── index.js      ← Page logic
│   │   └── index.json    ← Page config
│   └── about/
│       ├── about.wxml
│       ├── about.wxss
│       ├── about.js
│       └── about.json
├── app.js                ← Mini program entry point
├── app.json              ← Global config
├── app.wxss              ← Global styles
└── project.config.json   ← Project config

Step 3: Use AI to Write Mini Program Code

Good news — AI is also quite proficient with mini program development. You can have it write code directly in Cursor:

Help me create a WeChat Mini Program page:
- Top: display user avatar and nickname
- Middle: a list showing recent orders (mock data is fine)
- Bottom: tabbar with Home and Profile tabs

The AI will generate complete WXML, WXSS, JS, and JSON config files. Mini program WXML syntax is very similar to HTML (<view> maps to <div>, <text> maps to <span>), and WXSS syntax is essentially the same as CSS, so the learning curve is gentle.

Mini Program Limitations

Package size: 2MB per package, 20MB max with subpackages. Large codebases require subpackage loading
Review cycle: Submission review typically takes 1-7 days, longer during holidays
Platform rules: Many restrictions — virtual payments must go through WeChat Pay (similar to Apple's tax)
AI-generated content review: If your mini program involves AI conversations or generated content, additional qualifications and review are required
Domain requirements: Backend APIs must use HTTPS with a registered (ICP-filing) domain

Cross-Platform Solutions: Taro vs uni-app

If you want a mini program, an H5 web app, and an App all at once, consider a cross-platform framework.

Taro

Taro is built by JD.com and uses React syntax. One codebase compiles to:

WeChat/Alipay/Baidu/ByteDance/QQ Mini Programs
H5 (mobile web)
React Native App

Best for: Developers who already know React. Learning cost is practically zero.

// Taro code example — identical to React
import { View, Text, Button } from '@tarojs/components'
import { useState } from 'react'

export default function Counter() {
  const [count, setCount] = useState(0)
  return (
    <View>
      <Text>Clicked {count} times</Text>
      <Button onClick={() => setCount(count + 1)}>+1</Button>
    </View>
  )
}

uni-app

uni-app is built by DCloud and uses Vue syntax. It supports even more platforms:

WeChat/Alipay/Baidu/ByteDance/QQ/JD/Kuaishou/Feishu Mini Programs
H5
iOS App (via uni-app native rendering or WebView)
Android App

Best for: Developers familiar with Vue, or projects that need to cover as many platforms as possible.

<!-- uni-app code example -->
<template>
  <view>
    <text>Clicked {{ count }} times</text>
    <button @click="count++">+1</button>
  </view>
</template>

<script setup>
import { ref } from 'vue'
const count = ref(0)
</script>

Taro vs uni-app Comparison

Dimension	Taro	uni-app
Syntax	React	Vue
Creator	JD.com	DCloud
Supported platforms	Major mini programs + H5 + RN	More mini programs + H5 + native App
App experience	React Native, good quality	WebView or Weex, average quality
Community ecosystem	Active, backed by React ecosystem	Very active, largest user base in China
Learning resources	Abundant	Very abundant, large plugin marketplace
Best suited for	React teams, App experience focus	Vue teams, broad platform coverage
AI familiarity	High (React ecosystem)	Medium

My advice: If you're already on a React tech stack, go with Taro. If you're on Vue or need to cover a wide range of mini program platforms, go with uni-app. Both are mature enough that you won't run into major issues.

Building Apps with React Native

If you genuinely need a native app but don't know Swift or Kotlin, React Native is your best bet.

Why React Native

Written in JavaScript/TypeScript — AI is extremely familiar with it
Massive community — easy to find solutions when you hit problems
Expo toolchain provides an excellent development experience
Compiled apps feel close to native (much better than WebView wrappers)

Quick Start (with Expo)

# Create project
npx create-expo-app my-app --template blank-typescript

# Navigate to directory
cd my-app

# Start dev server
npx expo start

Scan the QR code with the Expo Go app to preview on your phone. Edit code, save, and see changes instantly on your device.

A Simple RN Page

import { View, Text, StyleSheet, TouchableOpacity, FlatList } from 'react-native'
import { useState } from 'react'

interface Todo {
  id: string
  text: string
  done: boolean
}

export default function App() {
  const [todos, setTodos] = useState<Todo[]>([
    { id: '1', text: 'Learn React Native', done: false },
    { id: '2', text: 'Build an app', done: false },
  ])

  const toggleTodo = (id: string) => {
    setTodos(todos.map(t => t.id === id ? { ...t, done: !t.done } : t))
  }

  return (
    <View style={styles.container}>
      <Text style={styles.title}>Todo List</Text>
      <FlatList
        data={todos}
        keyExtractor={item => item.id}
        renderItem={({ item }) => (
          <TouchableOpacity onPress={() => toggleTodo(item.id)}>
            <Text style={item.done ? styles.done : styles.todo}>
              {item.done ? '✅' : '⬜'} {item.text}
            </Text>
          </TouchableOpacity>
        )}
      />
    </View>
  )
}

const styles = StyleSheet.create({
  container: { flex: 1, padding: 20, paddingTop: 60 },
  title: { fontSize: 24, fontWeight: 'bold', marginBottom: 20 },
  todo: { fontSize: 18, paddingVertical: 10 },
  done: { fontSize: 18, paddingVertical: 10, textDecorationLine: 'line-through', color: '#999' },
})

Using AI to write React Native code is incredibly efficient. Tell it what you want, and the generated code usually runs directly. Expo wraps most of the complex native development work, so you rarely need to touch Xcode or Android Studio.

Flutter Comparison

Flutter (Dart language) is also an option. Its UI expressiveness is strong and the apps look great. However, AI's familiarity with Flutter/Dart isn't as deep as with React Native/TypeScript, so AI's ability to help troubleshoot issues is slightly weaker. If you have no strong preference, go with React Native first.

WebView Wrapper Approach

There's an even easier path: wrap your web app in an app shell.

Using Capacitor (from the Ionic team) or Cordova, you can package your web project into an app. It's essentially still a web page, but it can be published to the App Store and Google Play.

# Turn an existing Next.js project into an app
npm install @capacitor/core @capacitor/cli
npx cap init my-app com.example.myapp

# Add platforms
npx cap add ios
npx cap add android

# Build web then sync to native projects
npm run build
npx cap sync

# Open Xcode or Android Studio
npx cap open ios
npx cap open android

This approach works well for utility and content apps. It's not suitable for apps requiring complex native interactions (maps, video editing, AR, etc.).

Publishing to App Stores

Once your app is built, here's what you need to know about getting it into app stores.

Apple App Store

Developer account: $99/year
Review time: Typically 1-3 days, possibly longer for first submission
Review strictness: Very high. They check privacy policy, feature completeness, UI guidelines, whether payments go through IAP, etc.
Rejection is normal: Don't panic — just fix the issues and resubmit. Common rejection reasons:
- Missing privacy policy link
- App is too simple ("Apple doesn't accept demo-level apps")
- Using non-IAP payment methods
- UI doesn't comply with Human Interface Guidelines

Google Play

Developer account: One-time $25
Review time: Typically 1-3 days
Review strictness: More lenient than Apple, but tightening. Note that Google Play also has policy requirements for AI-generated content
New account restrictions: Newly registered developer accounts may have their first few apps enter "closed testing," requiring a certain number of testers before publishing publicly

Domestic Chinese Android App Stores

China doesn't have a unified Google Play — you need to submit to each store individually:

Store	Required Materials	Special Requirements
Huawei AppGallery	Software copyright + business qualification	Stricter review
Xiaomi App Store	Software copyright + business qualification	Decent review speed
OPPO App Store	Software copyright + business qualification	—
vivo App Store	Software copyright + business qualification	—
Yingyongbao (Tencent)	Software copyright + business qualification	High traffic, recommended priority

Software copyright (软件著作权) is a must-have for publishing on Chinese Android stores. The application process typically takes 1-2 months. You can use an agency to speed it up (costs a few hundred to a couple thousand RMB). Plan ahead.

App Store Submission Checklist

Pre-launch checklist:

Cost Comparison

Starting from scratch, what does each approach cost?

Approach	Dev Cost	Annual Maintenance	Time to Launch	Best Stage
Web (Next.js + Vercel)	$0 (AI writes it)	$0-20 (domain)	1-2 days	Any stage
WeChat Mini Program (individual)	$0	$0	1 week (incl. review)	Validating ideas
WeChat Mini Program (enterprise)	$0 + 300 RMB certification	300 RMB/year	2 weeks (incl. certification)	Official operation
Taro / uni-app cross-platform	$0	$0-300	1-2 weeks	Multi-platform coverage
React Native (Expo)	$0	$99 (Apple) + $25 (Google)	2-4 weeks	App needed
Capacitor wrapper	$0	$99 + $25	1-2 weeks	Fast app store launch
Native iOS + Android	$5000+	$99 + $25	1-3 months	Post-funding / high requirements

The indie developer's optimal path:

Week 1-2: Build a web version with Next.js + Vercel, launch quickly
Week 3-4: Iterate based on user feedback, validate product direction
Month 2: If domestic market is needed, build a mini program version with Taro/uni-app
Month 3+: If user base is large enough and there's app demand, build with React Native

Don't skip steps. The biggest mistake indie developers make is wanting to build an app from day one — spending two months without launching anything, not even a web version, and ultimately validating nothing.

Chapter Summary

In 90% of cases, the web is the best choice. Zero cost, zero friction, fastest iteration
For the domestic Chinese market, WeChat Mini Programs are worth building. But register your account and get the required qualifications first
Cross-platform frameworks (Taro/uni-app) are great for rapid multi-platform coverage, but "jack of all trades, master of none"
React Native is the best choice for building apps. Expo makes the development experience excellent
WebView wrappers (Capacitor) are the fastest way to get an app in the store. Best for content/utility apps
Publishing to app stores has barriers. Prepare your privacy policy, screenshots, and qualifications in advance

Focus on one platform, do it exceptionally well, then consider expanding. This principle applies to nearly every indie developer.

Website, Mini Program, or App?​

Quick Decision Table: Which to Choose​

The Web's Advantages: Why It's Usually Enough​

WeChat Mini Program Development Guide​

Step 1: Register a Mini Program Account​

Step 2: Install the Development Tools​

Step 3: Use AI to Write Mini Program Code​

Mini Program Limitations​

Cross-Platform Solutions: Taro vs uni-app​

Taro​

uni-app​

Taro vs uni-app Comparison​

Building Apps with React Native​

Why React Native​

Quick Start (with Expo)​

A Simple RN Page​

Flutter Comparison​

WebView Wrapper Approach​

Publishing to App Stores​

Apple App Store​

Google Play​

Domestic Chinese Android App Stores​

App Store Submission Checklist​

Cost Comparison​

Chapter Summary​