Introduction to the
Small program is a new way to connect users and services, wechat is now used by young and old, it can be easily obtained and spread in wechat, while having excellent use experience.
The main development language of small program is JavaScript, and the development of small program is very similar to the common web development. Moving from web development to applets is not expensive for front-end developers, but there is a slight difference (see wechat Open Documentation for details).
Web developers only need to use a browser and some auxiliary tools or editors to develop web pages. The development of small program is different, need to apply for small program account, install small program developer tools, configuration projects and so on process can be completed.
Without further ado, I’ll show you the ropes.
To start!
Apply for account
Enter the mini program registration page according to the guidance to fill in the information and submit the corresponding information, you can have your own mini program account. Log in the small program background, we can see the AppID of the small program in the left menu “development” – “development Settings”, and you can configure the server domain name, business domain name, scan the common link two-dimensional code to open the small program, these are very useful for development, specific later.
Installing development tools
Download the software from the developer tool and install the software based on your operating system. You are advised to download a stable version.
Your first applet is born
Create a new project select the applets project, select the hard disk path where the code is stored, fill in the AppID of the applets you just applied for, give your project a nice name, check “do not use cloud services” (note: You need to select an empty directory to create the project), default template, click New, you will get your first small program, click the top menu to compile, you can preview your first small program in the wechat developer tools.
The code structure
The initial structure is roughly as follows:
Json is the global configuration of the current applet, including all page paths of the applet (the first path is the first rendering page), interface performance, network timeout, bottom TAB, etc.
App.wxss wrote some global styles and added the size RPX to save the developers from conversion. Because conversion uses floating point operation, the calculation result will be a little deviation from the expected result.
App.js writes some global variables, functions, etc.
If you create a page in the Pages directory, app.json will automatically generate the corresponding path.
Other extensions extend themselves, such as creating a components, encapsulating some components, making code reusable, and calling json files in required pages.
WXML template
There are no div, p, span, etc.
View, rich-text, swiper, icon, text, Progress, button, form, input, checkbox, Radio, Picker, Slider, Switch, Textarea, label, Navigator, Audio, image, VID Eo, Camera, Map, Scrollable view container, Picker-View, Canvas movable-Area, movable-View Cover -view, cover-image, functional-page-navigator, live-player, live-pusher
Dynamic parameters for page rendering are surrounded by {{}}, for example:
There are also some things you need to know for yourself, see the WXML syntax reference
JS logic interaction
This.setdata ({MSG: “Hello World”})
Page js looks at the Page, Component JS looks at the Component.
WXSS style
CSS, but WXSS only supports some CSS selectors. For more detailed documentation, see WXSS.
Microenveloped components
Built-in components that can be used directly as needed. It also provides a library of WeUI components, which can be installed and referenced again if needed.
API
At the same time provides a variety of API for us to use, reduce the pressure of our hair loss.
You’re done
Wechat small program development needs roughly, for us to choose these things. Finally can develop a good small program, you need to further study, at the same time to practice, in the process of practice will encounter all kinds of problems. In the later stage, I will sort out the problems encountered in my development process for your reference and promote your solution.