Developing WeChat Mini Programs with Tencent Cloud Serverless Functions

WeChat Mini Programs are becoming increasingly popular and powerful, offering native component and API calls that simplify front‑end development. While the front‑end can be built quickly, a robust back‑end is still required.

Modern Mini Programs are moving toward a serverless architecture. Tencent Cloud provides SCF (Serverless Cloud Functions) so developers can run Mini Programs without setting up traditional backend services.

This guide explains how to use Tencent Cloud services to develop a WeChat Mini Program.

1. Download and Run the Latest Mini Program IDE

Download address: http://git.code.oa.com/mp-public/cloud-doc/

Open the IDE, create a new Mini Program project, fill in the project directory, AppID (register if you don’t have one), and project name.

The IDE automatically compiles and runs the project, showing a preview on the left side.

1.1 Compilation

The program automatically compiles when code changes; you can also trigger compilation manually. After a successful compile, the page reloads automatically.

1.2 Remote Debugging

Remote debugging allows you to scan a QR code with WeChat to open the Mini Program in development mode on a real device. The IDE then provides Console, Network, Sources, etc., for debugging.

1.3 Cloud Console

The Cloud Console is where developers manage Mini Program cloud resources.

Environment : Create an environment (e.g., “development”) and record its ID for configuration files.

Database : View and operate on collections and documents within the selected environment.

File Management : Upload, view, rename, move, and create folders. Files can be uploaded via the console UI or programmatically using wx.cloud.uploadFile and wx.cloud.downloadFile.

Cloud Functions : View, create, edit, and test cloud functions. Functions run in the cloud (Node.js environment) and can be called from the Mini Program using wx.cloud.callFunction.

2. Project Development

2.1 Directory Structure

A typical Mini Program project includes:

.json   // JSON configuration files
.wxml   // WXML template files
.wxss   // WXSS style files
.js     // JavaScript logic files

app.js

is the entry file, app.json the configuration, and the pages folder contains page files. The cloud-functions folder stores cloud function code, which will be packaged and uploaded to the cloud.

2.2 Project Initialization and Configuration

Key configuration files related to cloud development:

project.config.json (shown in the guide image).

client/app.js (shown in the guide image) – initialize cloud services with:

wx.cloud.init({
  env: 'development', // environment ID
  traceUser: true   // enable user tracing during debugging
});

2.3 Uploading Files to the Cloud

After initializing the cloud, you can upload files using the API:

wx.cloud.uploadFile({
  cloudPath: '/example.png',
  filePath: '', // temporary file path on the device
  success: res => {
    console.log(res.fileID);
  },
  fail: err => {}
});

cloudPath

specifies the destination path in the cloud storage.

2.4 Writing Cloud Functions

Create a new cloud function via the Cloud Console, set the name, creation method, and runtime environment. You can upload the function code either through the IDE (by adding a cloud-functions folder and configuring cloudfunctionRoot in project.config.json) or by packaging the code into a ZIP file (the entry file must be index.js exposing a main_handler function).

2.5 Calling Cloud Functions

Invoke a cloud function from the Mini Program with:

wx.cloud.callFunction({
  name: 'test', // cloud function name
  data: { param: 1 },
  success: res => {
    // output: res.result
  },
  fail: err => {}
});

This API makes it easy to execute backend logic without managing servers.