Introduction to the JavaScript framework-xmlplus

Xmlplus is a JavaScript framework used to quickly develop frontend and backend projects. This article mainly introduces xmlplus, which has some reference value. If you are interested, please refer to xmlplus introduction.

Xmlplus is a very unique JavaScript framework designed for rapid development of frontend and backend projects.

Component-based Design

In xmlplus, components are basic construction blocks. An important criterion for evaluating component design is encapsulation. Xmlplus-based components have a high degree of encapsulation. The following is a simple component example:

Widget: {    css: "#widget{ color: red; }",    xml: `default`,    fun: function (sys, items, opts) {        sys.widget.text("hello, world");     }}

Note that the style, XML document, and function items contained in this component are only valid for this component, and other components are completely invisible to it. This component writing method has changed the traditional application writing mode of placing CSS, JS, and HTML in different files, but it makes you more comfortable when building applications.

Components are organized by namespaces. The component reference method based on the traditional directory path makes it easier to use components. Suppose you have defined a Calendar component in the namespace // ui, you can use it on the HTML page as follows:

For how to define components, please refer to the official documentation www.xmlplus.cn/docs.

Friendly compatibility

Non-Intrusive design allows xmlplus to be integrated with almost all frameworks or libraries today.

With xmlplus's excellent integration capabilities, you can integrate existing libraries or frameworks into your project to avoid the trouble of rebuilding the wheel.

The following is an example of encapsulating the Bootstrap button component:

Button: {    xml: ``,    fun: function (sys, items, opts) {        this.addClass("btn-" + opts.type);    }}

After this encapsulation, you can use it very concisely as follows:

DefaultPrimarySuccess

One-time learning and multi-Terminal Use

Xmlplus's unique design allows it to design browser-based and server-based applications in the same way.

On the browser side, you can use it to efficiently develop single-page applications. On the server side, you can use it to develop service applications and traditional websites.

The following is the encapsulation of a simple Sqlite component on the server.

Sqlite: {    fun: function (sys, items, opts) {        var sqlite = require("sqlite3").verbose(),        return new sqlite.Database("data.db");    }}

You can use the Sqlite component as follows:

Example: {    xml: `
 
  `,    fun: function (sys, items, opts) {        let stmt = "SELECT * FROM users";        items.sqlite.all(stmt, (err, rows) => console.log(rows));    }}
 

This framework supports directly serializing and outputting HTML code in the background. Therefore, using xmlplus to develop traditional websites is extremely convenient. The following example briefly demonstrates this point:

HttpServer: {    xml: `              default          `    fun: function (sys, items, opts) {        let http = require("http");        http.createServer((req, res) => {             sys.body.text("hello,world");            res.setHeader("Content-Type", "text/html");            res.end(this.serialize(true));         }).listen(80);     }}

Through the example, you can find that after processing the service to accept the request, you can dynamically change the XML document structure, this makes xmlplus's traditional website development method quite different from PHP, JSP, and other scripting languages.

In addition, the basic features of xmlplus, including retrieval, communication, sharing, and delayed instantiation, are also exclusive. They can greatly assist application development.

The above is the detailed description of the JavaScript framework-xmlplus. For more information, see other related articles in the first PHP community!