Detailed description of application code development for WeChat applets

This article mainly introduces the development experience of small programs (application numbers). For more information, see this article, for more information, see

Yesterday, the mini app (application number) closed beta test broke the entire technical community, and I couldn't help but follow a few waves. Unfortunately, I was not qualified for beta testing. I heard that the cracked version was released, this morning, I tried to develop the original project resources and summarized the experience.

Overall Experience

1. High development efficiency: the IDE is cracked at around, and the layout of the home page and navigation bar is completed at around. the layout of the visible pages is encapsulated, which is more efficient than the traditional front-end development.

2. The front-end can be quickly used: a skilled front-end can be quickly used. it may take only one hour to read documents and add an official example.

3. Development tools are difficult to use. many directory operations and IDE common formatting code, html matching and other functions are not currently supported.

4. Development limits many common front-end Dom and window operations, and reduces the flexibility and difficulty of development.

5. I am not qualified for beta testing. I can only download the local code for the upload experience of a small program.

The code of this article is on github

Upper

"use strict";function init() {  tools.Chrome = chrome;  var n = require("../dist/lib/react.js"),    e = require("../dist/lib/react-dom.js"),    i = require("../dist/common/loadInit/init.js"),    o = require("../dist/components/ContainController.js"),    t = require("../dist/common/proxy/startProxy.js"),    r = require("../dist/actions/windowActions.js"),    s = require("../dist/actions/webviewActions.js"),    d = require("../dist/stroes/webviewStores.js"),    u = require("../dist/common/log/log.js"), c = require("../dist/common/shortCut/shortCut.js"), l = global.appConfig.isDev;    //...}

Let's take a look at the definition of component Dropdown. isn't that the method for creating components in ES5 that we are familiar?

"Use strict"; var React = require (".. /.. /lib/react. js "), Dropdown = React. createClass ({displayName: "Dropdown", render: function () {return React. createElement ("p", {className: "dropdown"}, React. createElement ("p", {className: "dropdown-item"}, React. createElement ("img", {src :" https://mmrb.github.io/avatar/jf.jpg ", Alt:" ", className:" dropdown-item-icon "}), React. createElement ("p", {className: "dropdown-item-info"}, React. createElement ("p", null, "public account name"), React. createElement ("p", {className: "dropdown-item-extra"}, React. createElement ("img", {src :" https://mmrb.github.io/avatar/jf.jpg ", Alt:" ", className:" dropdown-item-extra-icon "}), React. createElement ("p", {className: "dropdown-item-active"}, React. createElement ("img", {src :" https://mmrb.github.io/avatar/jf.jpg ", Alt:" ", className:" dropdown-item-icon "}), React. createElement ("p", {className: "dropdown-item-info"}, React. createElement ("p", null, "public account name, public account name, public account name"), React. createElement ("p", {className: "dropdown-item"}, React. createElement ("img", {src :" https://mmrb.github.io/avatar/jf.jpg ", Alt:" ", className:" dropdown-item-icon "}), React. createElement ("p", {className: "dropdown-item-info"}, React. createElement ("p", null, "public account name"), React. createElement ("p", {className: "dropdown-item"}, React. createElement ("img", {src :" https://mmrb.github.io/avatar/jf.jpg ", Alt:" ", className:" dropdown-item-icon "}), React. createElement ("p", {className: "dropdown-item-info"}, React. createElement ("p", null, "public account name")}); module. exports = Dropdown;

The package size of the applet is limited.

At the same time, the size of the small package is limited to kB, and the cache and local files should also be controlled. this is definitely a bright spot compared to the size of the native application that does not move dozens of megabytes to hundreds of megabytes, many people on the Internet say that mini apps will also occupy mobile phone storage.

In general, it is absolutely good news for the front-end. in the short term, the front-end treatment may rise, but the threshold for developing small programs is low (lower than the front-end). one developer is working on wage-oriented programming, with the flow of developers, it will remain the same as other related technical posts for a long time. Therefore, do not be excited, or make the basic knowledge solid.

The above is to sort out the information about the mini-program. we will continue to add relevant information in the future. thank you for your support for this site!

The above is the detailed description of the application number development of small programs. For more information, please follow other related articles in the first PHP community!