Take you to wechat applet development in 3 minutes

What is wechat applet

Wechat applet is Tencent 2017 year 1 month 9 A wechat based application that doesn't need to be installed, which was officially launched on the th

What is based on wechat

Simple and crude understanding is the application running in wechat , If wechat is not installed, it cannot run

What is no installation

No need to install, just a publicity stunt , In essence, small programs also need to be downloaded and installed . However, wechat officials have strict restrictions on the size of applet installation ( Single bag 2M/ General contract 20M), So the download and installation is very fast , So that it gives users the illusion of no installation

Applets and web pages and native APP contrast

• Webpage

Running environment : browser ( You can run with a browser )

advantage : Low development cost ( A set of code can run on various platforms ), Fast propagation ( Enter the web address to use )

shortcoming : Poor user experience ( Interactive experience is not as good as native ), Poor system fit ( Many system functions cannot be used )

• Native APP

Running environment :iOS/Android/HarmonyOS

advantage : Good user experience , High system fit ( All open functions of the system can be used )

shortcoming : High development cost ( Each platform requires a separate set of code ), Slow propagation ( Downloading and installing is tedious )

• Applet ( Between web pages and native APP Between )

Running environment : WeChat

advantage : Good user experience , Low development cost , Fast propagation ( Sweep code / Chat and share / WeChat search )

shortcoming : The system fit is not as good as the original ( You can only use functions that are open to both the system and wechat )

for example : The system opens the function of taking pictures , Wechat also opens this function , Then developers can use

for example : The system opens the function of reading address book , But wechat is not open , Then developers cannot use

But you don't have to worry , The open function of wechat can fully meet the needs of most applications in the market

summary

Applet is a kind of program between web page and native APP Applications between

It has both native APP Good user experience and good system fit , It also has low development cost and excellent propagation speed of web pages
The only two points worth noting are :

In order to achieve the effect of non inductive installation, the small program has a volume limit , So too complex programs are not suitable for small programs

Small programs have their own audit mechanism , The developed applet must be reviewed by Tencent before it can be put on the shelves

Small program development preparation

Knowledge reserve

necessary :HTML/CSS/JavaScript( Grammar part )

There are no browsers and documents in the applet (Document) The concept of object , So no need BOM/DOM Related knowledge
Optional :TypeScript/SASS/LESS/NodeJS
Applets support TypeScript/SASS/LESS/NodeJS, But it won't be the same without affecting our development
Yield twice the result with half the effort : Vue/React
There is also modularity in small programs / Componentization / Life cycle / Concepts such as instructions , If you have Vue or React, It will give you a feeling of seeing your first love
Account preparation

Because wechat developer tools can only be used after logging in , So you need to register an applet account

Account registration guide :https://developers.weixin.qq.com/miniprogram/introduction/

Account registration address :https://mp.weixin.qq.com/wxopen/waregisteraction=step1

Personal developers : Register your account and get AppId Ready to dry

Team developers : After you register your account, you need to add other developers

Developer tool preparation

Download address :https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

Introduction to development tools : https://developers.weixin.qq.com/miniprogram/dev/devtools/devtools.html

The related documents /Demo

Development of guidelines : https://developers.weixin.qq.com/ebook

action=get_post_info&docid=0008aeea9a8978ab0086a685851c0a

Developing documents :https://developers.weixin.qq.com/miniprogram/dev/framework/

Demo Case study : https://github.com/wechat-miniprogram/miniprogram-demo