A front-end UI framework that can improve development efficiency by 500%! Qui!

Qui framework Introduction

The qui web interface integration framework is a complete enterprise-level front-end solution consisting of Component Library, skin framework, sample project, and documentation. With this product, developers can greatly reduce the workload, increase development efficiency, and quickly build powerful, beautiful, and compatible application systems.

The qui framework has the following features:

Feature 1: greatly simplified and consistent component usage

Almost all components can be created using a tag. No js code is required.
For example:

 

The class is set to selecttree to declare that it is a tree drop-down box, and the path in the URL is used to remotely obtain JSON data.

The effect is as follows:

 

Other settings are implemented by adding attributes. For example, if the multimode = "true" attribute is added, the multi-select drop-down box is displayed.

 

 

 

Feature 2: rich component interfaces and detailed API manuals

Each component can add attributes to tags to implement various functions and meet various development requirements.

 
The Framework provides very detailed usage documents. Currently, it contains 642 chapters, covering all aspects of web development. Most of the problems encountered during the development process can be solved by viewing the corresponding chapters.

 

 

 

Feature 3: The Framework fully supports JSON data

All data-related components support the construction of asynchronous loading of JSON data.
The tree and data list components are all constructed from JSON data.
In addition, some synchronization components are provided to take care of users who use some old technologies, such as table list and option mode retained in single-choice drop-down boxes.
Form submission and editing support synchronous and asynchronous methods.

 

 

 

Feature 4: diverse data acquisition methods for components

You can use URL to obtain component data.

 

In addition to using URLs to obtain data, components also have multiple data acquisition methods. For example, you can write data directly on tags to facilitate development when the data volume is small;

 
You can also assign values to components dynamically, which is useful when the data format is uncontrollable, for example, data obtained from a third-party WebService can be processed twice at the front end and then assigned to the component.

 

 

Feature 5: All components support dynamic rendering creation and dynamic attribute change

The framework provides a render () method for each component. With this feature, you can dynamically create components or change attributes.
The method is to dynamically create DOM nodes or use XX. ATTR () to change node attributes (ATTR is the jquery syntax), and finally call the render () method for this component.

 

 

 

Feature 6: The sample project matches the Java and. Net background.

Java and. Net sample projects are provided, and typical examples are provided for scenarios in which frameworks commonly used in development interact with the background.

 
Including user management (adding, deleting, modifying, querying, importing, and exporting data lists) and Organization Management (Ajax editing of tree components) real-time table editing, upload implementation, remote acquisition of component data, and other functions (such as user logon and system lock screen ).

 

When developing a project, you can directly develop the project based on the sample project of the framework, or create a project on your own, and then refer to the background Implementation ideas of the sample project of the framework.

 

 

Feature 7: Comprehensive navigation

The framework includes more than 10 navigation architectures, such as drawer menu navigation, pop-up menu navigation, icon navigation, vertical + horizontal navigation, portal mode, and so on. Other frameworks only have the same drawer menu navigation.

 

 

 

Feature 8: beautiful and rich skin styles

The Framework has hundreds of beautiful skin templates with different styles, providing users with an overall front-end system solution. Other frameworks are just component libraries.

 

 

 

 

 

 

 

 

 

Feature 9: flexible skin Mechanism

The framework uses a unique skin mechanism. Only the skin style is introduced on the home page. All child pages read the configuration on the home page and automatically load the corresponding skin.
When changing the theme style, you only need to change the configuration on the home page. You do not need to adjust each subpage, which is very convenient.

 

 

Feature 10: excellent browser compatibility

Qui framework is compatible with all mainstream browsers, including IE6, IE7, IE8, ie9, ie10, ie11, Firefox, chrome, and safari.

 

 

For more details, see: click here

A front-end UI framework that can improve development efficiency by 500%! Qui!