Use uni-app for small program development

what is uni-app

uni-app is a framework that uses Vue.js to develop all front-end applications. Developers write a set of codes that can be published to iOS, Android, Web (responsive), and various small programs (WeChat/Alipay/Baidu/Toutiao/ Feishu/QQ/Kuaishou/DingTalk/Taobao), Kuai App and other platforms.

Advantages of uni-app

uni-app has stronger advantages in eight key indicators, including the number of developers, cases, cross-terminal smoothness, expansion flexibility, performance experience, surrounding ecology, learning costs, and development costs.

Create uni-app

Select File in the toolbar, select New, select Project

Select the uni-app project, enter the project name, select the file storage location, select the template, select vue2 or vue3 according to your needs, select whether to enable the cloud development service (*If you do not check it when creating the project, you can manually generate it yourself), click Create to generate uni- app project

*Template selection

There are many templates for us to choose from when creating a project. Click to search and jump to the Dcloud plug-in market to search for more templates.

project framework

The following is an introduction to the files built into the template. Global common components need to be created in the components folder to store them.

During the development process, for better viewing and organization, classified folders were created in pages according to business functions, and functional modules were distinguished according to the homepage tabbar.

Create page

Select the folder, right click and create a new page

Enter the page name and select the required template to create it. Check "Register in pages.json" and the page will be automatically registered after creation.

uniCloud

 uniCloud  is a cloud development platform based on serverless mode and js programming provided by DCloud , Alibaba Cloud and Tencent Cloud. Provide a free service space for each developer, allowing everyone to have their own server. Developers can independently choose uniCloud 's hardware and network resource suppliers, and switch between Alibaba Cloud version and Tencent Cloud version.

Right-click the project, create a cloud development environment, and select a supplier.

Right-click the project root directory uniCloud and select Associate Cloud Service Space to bind the previously created service space or create a new service space.

After the uniCloud project creates and binds the service space, developers can create and call cloud functions (cloud objects are a type of cloud functions, and cloud functions can generally refer to ordinary cloud functions and cloud objects). After using cloud objects, the logic will be clearer, the code will be more streamlined, and the unified response body specification will be taken over by the framework to avoid the trouble of interface joint debugging.

Run applet

After completing the writing of the applet code, you can run the WeChat applet, but you need to configure the WeChat developer tool path before running it. 

After configuring the path, enter the settings of the WeChat applet and select use the system proxy in the proxy settings.

Open the service port in the security settings

 After completion, you can return to the uni-app project and run it to the WeChat applet

Jump to the WeChat applet page and display your own page to run successfully. WeChat applet has many similarities with uni-app, and the code can be modified directly in WeChat applet.

Guess you like

Origin blog.csdn.net/weixin_68155905/article/details/131306186