[Small Program Development] Start

[Small Program Development] Start

1. Preliminary knowledge

The core technologies of applets are mainly three

  • Page Layout:WXML, similar to HTML;
  • Page style:WXSS, almost CSS (some not supported, some enhanced, but basically consistent);
  • Page script:JavaScript+WXS(WeixinScript);

insert image description here

1.1 The difference between applets and ordinary web development

  • The main development language of applets is JavaScript, and the development of applets is very similar to the development of ordinary web pages.
  • But there are some differences between the two,
  • In applets, the web page development rendering thread and the scripting thread are separated and run in different threads.
  • Web developers can use the DOM API exposed by various browsers to select and manipulate DOM
  • appletThe logic layer and the rendering layer are separated, the logic layer runs in JSCore and does not have a complete browser object, so it lacks related DOM API and BOM API.
  • This difference has led to some libraries that are very familiar to front-end development, such as jQuery, Zepto, etc., which cannot be run in small programs.
  • At the same time, the JSCore environment is different from the NodeJS environment, so some NPM packages cannot be run in the applet.

Two, start

2.1 Account Registration—Apply for AppID

Enter the mini program registration page, fill in the information according to the guidelines and submit the corresponding materials, and you can have your own mini program account.

insert image description here

Log in to the background of the applet , and we can see the AppID of the applet in the menu "Development" - "Development Settings" .

2.2 Download Mini Program Development Tool

Small program development tools

  • WeChat Developer Tools: official development tools that must be downloaded and installed
  • VSCode: Many people are more accustomed to using VSCode to write code;

WeChat developer tool download address : WeChat developer tool download address and update log

insert image description here

Use VScode to develop plug-ins recommended for download

  • Mini Program Development Assistant

insert image description here

  • WXML - Language Service

insert image description here

  • wechat-snippet

insert image description here

2.3 Create a small program project

  • Create a new project, select the applet project, select the hard disk path where the code is stored, and fill in the AppID of the applet you just applied for
  • Give your project a nice name, check "Do not use cloud services" (Note: You have to choose an empty directory to create a project)
  • Click New, and you will get your first Mini Program. Click Compile on the top menu to preview your first Mini Program in WeChat Developer Tools

insert image description here

Guess you like

Origin blog.csdn.net/qq_53664443/article/details/129875179