A low-code application rapid construction method
By using a low-code application rapid build method, application modules can be built visually by non-professionals, solving the problem of slow build speed in traditional development mode and improving build speed and user-friendliness.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2023-01-09
- Publication Date
- 2026-03-24
AI Technical Summary
In the traditional development model, application setup requires professionals to edit code one by one, which is slow in both setup and data upload speeds, making it difficult to meet the rapid response needs of grassroots business operations.
Employing a low-code application rapid building method, this approach allows non-professionals to build application modules through data preparation, visual page building, and drag-and-drop page design. The designer saves component configuration information as metadata, which is then compressed, uploaded, and decoded to generate the application.
It improves application setup speed and user-friendliness, eliminating the need for professionals to edit code step by step. The source code upload speed is also faster during the setup process, enabling rapid response to the needs of basic business operations.
Smart Images

Figure CN116204168B_ABST
Abstract
Description
TECHNICAL FIELD
[0001] The application relates to the technical field of low-code application construction, and particularly relates to a low-code application rapid construction method. BACKGROUND
[0002] Throughout the internal power enterprises, the traditional development mode has been adopted, and with the transformation and upgrading of digital construction, the traditional single system construction and operation or single micro application independent construction and operation mode cannot meet the needs of the current micro service mode. The business and technical quality of grassroots personnel is continuously improved, and a certain IT foundation is possessed. With the increasing number of grassroots business demands, the traditional development method cannot meet the response speed of the demands, and in the aspect of application construction, professional personnel are needed to build, which is not conducive to the self-building of users. In the building process, for the construction of low-code applications, the building process needs to edit the code one by one, the building speed is slow, and in the building process, the uploading of the code causes the generation speed of the code to decrease.
[0003] Therefore, a low-code application rapid construction method needs to be provided to solve the problem. SUMMARY
[0004] In order to solve the problem that the current application construction needs professional personnel to build, the professional personnel edit the code one by one, the speed is slow, and the data volume of the uploading of the code in the building process is large and the uploading speed is slow, the purpose of the application is to provide a low-code application rapid construction method, and non-professional personnel can directly build the application module needed by themselves, and the application building speed and user friendliness are improved.
[0005] In order to achieve the above purpose, the application provides the following technical scheme.
[0006] A low-code application rapid construction method comprises the following steps:
[0007] Step 1: data preparation: according to the application scene design data model, the data is processed and analyzed by the data set design tool provided by the method, and the input and output parameters are set, the target result data meeting the application scene is formed, and the data obtained in the interface design is prepared;
[0008] Step 2: Application construction: After obtaining the resource construction data, a drag-and-drop design page for generating application functions on the web is generated. Users design the required application functions by dragging and dropping functions, and developers arrange and operate these requirements on the designer. The designer saves these component configuration information as metadata. When the page is initialized, the metadata is loaded to restore the layout display of the components, the rules and implementation of business logic processing, and finally form an executable program. Low-code application construction builds pages, business logic, and data structures through visual construction. The designer saves the results of these operations in the form of metadata into intermediate files (engineering files, packaged from JSON and other descriptive language files).
[0009] Step 3: Application release: After the application design is completed and determined by the user, the application construction data is compressed again, uploaded to the GitLab repository, and then published through automated operation tools.
[0010] Step 4: Construction completion: After testing the script configuration through the test module and ensuring that the application is correct, the construction of the application is completed. After compression and uploading, the rendered application module is finally generated.
[0011] Preferably, in step 1, the construction resource data first creates a data source according to the database connection information (including URL, username, and password). Currently, multiple data sources are supported, including Oracle, HANA, MySQL, DB2, MaxCompute, etc. The data source can be tested for connection. After testing, the data source is created. According to the created data source information, create a data set containing special syntax tags (SQL statements for adding, deleting, modifying, and querying, as well as different tags for parameter passing), business parameters, and sample data. When used, the algorithm parser will parse and convert the special syntax tags into SQL statements that can be normally executed in the database. The resource construction data is provided by the business database, and the business database is stored with the corresponding application code set in advance.
[0012] Preferably, in step 1, the method uses JSON / XML format metadata to describe the attributes and page layout of front-end components. The construction system uses a grid layout, and the designer guides the user to complete the layout based on a nestable grid. The user first places the grid, then places page elements in the grid, and the designer records the configuration of the grid and the relationship between elements in the grid in the metadata. At runtime, the platform will escape the grid to HTML+CSS, restore the relationship between page elements and the grid, and complete page rendering according to the size of the browser. During data retrieval, the obtained resource construction data is compressed and uploaded before decoding.
[0013] Preferably, in step 1, the compression and decoding of the source code are performed by using Huffman coding to compress and decompress the file source code.
[0014] Preferably, in step 2, the application design is entirely operated by the webpage, as shown in the following figure: Figure 2 As shown in the figure, the data design module is directly provided by the data source configuration intervention business database or the middle office service to complete data preparation.
[0015] Preferably, in step 2, the construction module provides rich customized function components and page layouts. The page layouts mainly include three types, including advanced layout, adaptive layout, and layout tool. The function components include three types, including basic component, advanced component, and chart component. Through the JSON data storage component's attributes, data, and events, the attributes, data, and events of the component can be configured. The business personnel places and configures the page elements through the drag-and-drop mode. The development tool automatically generates executable program code according to the information, including creating control elements and other page elements, setting the position of the elements, adjusting the style of the elements, and the like. In the program running, these program codes will be called to restore the drag-and-drop operation of the developer gradually, and finally display the drag-and-drop design interface.
[0016] Preferably, in step 2, the interface starts to generate code after the page layout and component selection, style and event setting, and data binding. The code generation includes the following steps: header imports CSS file, custom CSS attribute, generates component page structure in HTML according to component attributes, generates initialization JavaScript script according to component data, generates binding events of the page according to component events, and adds the JavaScript file to be imported in the tail. When the page is published, the context path of CSS and JavaScript in the system page can be replaced according to the GitLab or Nginx publishing mode. The GitLab publishing mode has a standard Spring Boot project template program, provides a unified data access interface, can modify the parameters in the template program configuration file, and obtains the data source and data set information contained in the current system to generate the initialization SQL script of the system, and publishes it to GitLab. Through the Nginx publishing mode, all static pages and resource files under the current system are published to the Nginx server.
[0017] Preferably, in step 3, the compression and decoding of the source code are also performed by using Huffman coding to compress and decompress the file source code.
[0018] Preferably, in step 3, the GitLab repository stores the compressed file after obtaining it, which is convenient for the user to extract the previous design for secondary design and change. The GitLab repository is not limited to storing the previous release.
[0019] Preferably, in step 4, the application module is generated after synchronization generation application icon.
[0020] The application firstly carries out data preparation, obtains construction resource data required by application construction, compresses and uploads to a construction module, and then the construction module decompresses data and designs page design application functions in a drag mode through visual construction of a page, business logic and data structure.
[0021] Compared with the prior art, the application has the beneficial effects that:
[0022] The application patent compresses and uploads the decompression of data after designing page design application function modules through drag design, decompresses after compression upload, and directly builds the required application module for professional personnel or non-professional personnel in application building, improves the application building speed and user friendliness, and the professional personnel do not need to edit the code one by one, but compresses all source codes during the building process, uploads and then decodes, the source code upload speed is faster, so as to make the application building speed more rapid and convenient. BRIEF DESCRIPTION OF DRAWINGS
[0023] Figure 1 The flowchart of the application.
[0024] Figure 2 The function architecture diagram of the application.
[0025] Figure 3 The data preparation logic diagram of the application.
[0026] Figure 4 The overall architecture diagram of the application. DETAILED DESCRIPTION
[0027] The application will be described in more detail by way of example, and these examples are only illustrative and do not limit the scope of the application.
[0028] As shown in Figure 1 , a technical solution: a low-code application rapid construction method, comprising the following steps:
[0029] Step 1: data preparation: as shown in Figure 3 , the data model is designed according to the application scene, the data is processed and analyzed by the data set design tool provided by the method, and the input and output parameters are set to form the target result data conforming to the application scene, so as to prepare for data acquisition in interface design;
[0030] Step 2: application construction: the application design is all operated by a webpage, as shown in Figure 2As shown, the data design module is directly provided by the data design module, and the data design module is configured by the data source to intervene in the business database or the middle office service to complete the data preparation. After the resource construction data is obtained, the application function of the webpage generation is dragged and designed. The user designs the required application function by dragging the function. The developer arranges and operates these requirements on the designer. The designer saves these component configuration information as metadata. When the page is initialized, the metadata is loaded to restore the layout display of the component, the rules and implementation of the business logic processing, and finally form an executable program; and the low-code application construction constructs the page, business logic and data structure through visualization. The designer will save the results of these operations in the form of metadata into an intermediate file (engineering file, packaged from a descriptive language file such as JSON);
[0031] Step 3: Application release: after the application design is completed and determined by the user, the application construction data is completed, the source file is compressed again, uploaded to the GitLab repository, and then published through the automatic operation and maintenance tool;
[0032] Step 4: Construction completion: after the test module audits the script configuration and tests the application without error, the application construction is completed, and the application module is finally generated after the compressed upload is decoded and rendered.
[0033] As shown in Figure 4 The project design interface is implemented by the front-end framework Vue.js. Vue.js is a progressive framework for building user interfaces. Developers only focus on the view layer, and it is very easy to learn and integrate with other libraries or existing projects. On the other hand, Vue has the ability to drive complex single-page applications developed with single-file components and libraries supported by the Vue ecosystem. The drag-and-drop component in this project is based on draggable. Draggable is a Vue component based on Sortable.js. The preview interface is implemented based on the Bootstrap framework. Bootstrap is a front-end framework for quickly developing web applications and websites.
[0034] The backend code is developed by Spring Boot+MyBatis framework. Spring Boot discards the cumbersome XML configuration process and uses a large number of default configurations to simplify the Spring development process. The permission is integrated with the Shiro framework. Shiro is a powerful and easy-to-use Java security framework that performs authentication, authorization, password, and session management. The release version is uploaded to GitLab and published through the Nginx component. GitLab is an online code repository hosting software based on Git, which can audit code submissions and issues. Nginx is a high-performance HTTP server / reverse proxy, supports high concurrency, low resource consumption such as memory, and stable operation.
[0035] Embodiment one:
[0036] First, data preparation, get the build resource data required for application construction, and call through the business database, and then compare the source code through the compression module and upload it to the build module for decoding to obtain the build resource data.
[0037] Second, application construction, after obtaining the resource construction data, generate the drag and drop design page of the application function on the web page, and the user designs the required application function through the drag and drop function. After the application construction is completed, the page is confirmed to enter the next step. The data modeling of the method can be divided into table structure design and query view design. Business personnel construct table structure and view through visual method on the interface, and the platform automatically converts it into SQL statement of corresponding database to directly operate the database with SQL statement, and omits the steps of generating metadata and parsing metadata. The adjustment of table structure by business personnel on the designer is translated into corresponding SQL statement and executed on the database. At the same time, the designer can obtain the table structure in the database through the structure (Schema) query ability provided by the database and display it in the designer. On this basis, the method needs to unify the database design capabilities of different versions to ensure that the application developed by using the method can be seamlessly integrated with third-party software at data level, which means that the method needs to develop data structure and data access mechanism for various databases respectively to "flatten" the differences between databases in data types, query operations and other fields. According to the ability boundary and encapsulation granularity of the low-code application construction system, the components used to carry business logic are abstracted into metadata definition, such as component point selection, drag and drop, attribute, data event configuration, and the developer arranges and operates these components on the designer. The designer saves these component configuration information as metadata, and restores the layout display, business logic processing rules and implementation methods of the components through loading these metadata during page initialization, and finally forms an executable program. The low-code application construction system saves the results of these operations in the form of metadata into intermediate files (engineering files, packaged by descriptive languages such as JSON) through visual construction of pages, business logic and data structure. In the deployment stage, the developer preprocesses (including but not limited to validity check, compression, encryption, etc.) the intermediate files through the designer, and packs and publishes them to the server. The server acts as a runtime role to automatically parse the metadata in the intermediate files, and finally forms an application.
[0038] After the application is designed and determined by the user, the application construction data is compressed again, uploaded to the GitLab repository, and then decoded and published through the automatic operation tool.
[0039] After the final build is complete, the script configuration is reviewed by the test module, and the application is tested and found to be error-free. The application is then built, compressed and uploaded again, decoded and rendered, and finally the application module is generated.
[0040] Example 2:
[0041] In Example 1, the following steps are added:
[0042] In step 1, the resource data construction first creates a data source based on the database connection information (including URL, username, and password). Currently, multiple data sources are supported, including Oracle, HANA, MySQL, DB2, and MaxCompute. A connection test can be performed on the data source; once the test is successful, the data creation is complete. Then, a dataset is created based on the created data source information, containing SQL statements with special syntax tags (CRUD operations and parameter passing are identified by different tags), business parameters, and sample data. During use, an algorithm parser will parse the special syntax tags and convert them into SQL statements that can be executed normally in the database. The data for resource construction is provided by the business database. The database is pre-configured to store the corresponding application code. This method uses JSON / XML format metadata to describe the attributes of front-end components and page layout. The build system adopts a grid layout. The designer guides the user to complete the layout based on nestable grids. The user first places the grid and then places page elements in the grid. The designer records the grid configuration and the relationship between elements in the grid in the metadata. At runtime, the platform will convert the grid into HTML+CSS, restore the relationship between page elements and grids, and then complete the page rendering according to the browser size. During the data retrieval process, all the retrieved resource build data is compressed and uploaded before being decoded. The compression and decoding of the source code is achieved by using Huffman coding to compress and decompress the file source code.
[0043] First, data preparation involves acquiring the build resource data required for application construction and retrieving it from the business database. After retrieval, the data is compressed and uploaded to the build module after comparison with the source code. The build module decodes the data to obtain the build resource data. The build resource data first creates a data source based on the database connection information (including URL, username, and password). Currently, multiple data sources are supported, including Oracle, HANA, MySQL, DB2, and MaxCompute. A connection test can be performed on the data source; once the test is successful, the dataset is created. This dataset includes SQL statements with special syntax tags (CRUD operations and parameter passing are identified by different tags), business parameters, and sample data. During use, an algorithm parser parses the special syntax tags and converts them into SQL statements that can be executed correctly in the database. The resource construction data is provided by the business database, which stores the corresponding application code in advance. This method uses JSON / XML metadata to describe the attributes of front-end components and the page layout. The build system uses a grid layout, and the designer guides the user based on nested... The grid layout is completed by the user first placing the grid, and then placing page elements within the grid. The designer records the grid configuration and the relationship between elements within the grid in the metadata. At runtime, the platform converts the grid into HTML+CSS, restores the relationship between page elements and the grid, and then completes page rendering according to the browser size. During the data retrieval process, all the retrieved resource construction data is compressed and uploaded before decoding. The compression and decoding of the source code is achieved by using Huffman coding to compress and decompress the file source code. Next, the application is built. After the resource construction data is obtained, a drag-and-drop design page for the application functions is generated on the webpage. The user designs the required application functions through drag-and-drop functionality. After the application is built, the user confirms on the page to proceed to the next step. The data modeling in this method can be divided into two parts: table structure design and query view design. Business personnel build the table structure and view visually on the interface, and the platform automatically converts them into corresponding SQL statements for direct database operations, omitting the generation and parsing of metadata. The adjustments made to the table structure by business personnel in the designer are translated into corresponding SQL statements and executed on the database.Meanwhile, the designer can obtain the table structure in the database in real time through the schema query capability provided by the database and display it in the designer. On this basis, this method needs to unify the design capabilities of different versions of databases to ensure that applications developed using this method can be seamlessly integrated with third-party software at the data level. This means that this method needs to develop data structures and data access mechanisms for various databases separately, "smoothing out" the differences between databases in data types, query operations, and other areas for business users. The low-code application building system, based on its own capability boundaries and encapsulation granularity, abstracts the components used to carry business logic into metadata definitions, such as component selection, drag and drop, attributes, and data event configurations. Developers arrange and manipulate these components in the designer, and the designer saves these component configuration information as metadata. When the page initializes, it loads this metadata to restore the layout display of the components and the rules and implementation of business logic processing. The process involves visually building pages, business logic, and data structures. The designer saves the results of these operations as metadata in intermediate files (project files, packaged from descriptive languages such as JSON). During deployment, developers preprocess the intermediate files using the designer (including but not limited to validity checks, compression, and encryption) and package and publish them to the server. The server acts as the runtime, automatically parsing the metadata in the intermediate files to form the application. After the application design is completed and confirmed by the user, the application build data is compressed again, uploaded to the GitLab repository, and decoded and published using automated operation and maintenance tools. Finally, the build is completed, the script configuration is reviewed by the test module, and after the application is tested and found to be error-free, the application build is completed. After compression and uploading, the decoded rendering is performed, ultimately generating the application module.
[0044] Example 3:
[0045] In Example 2, the following additional steps are added:
[0046] In step 2, the application design is entirely handled by the web page, directly provided by the data design module. This module prepares the data by configuring the data source to access the business database or middleware service. The building module provides a rich set of customizable functional components and page layouts. Page layouts are categorized into three types: advanced layouts, adaptive layouts, and layout tools. Functional components fall into three main categories: basic components, advanced components, and chart components. The properties, data, and events of these components are stored in JSON data. These properties, data, and events can be configured. Business users can place and configure page elements by dragging and dropping. The development tool automatically generates executable program code based on this information, including creating controls and other page elements, setting element positions, and adjusting element styles. During program execution... These program codes are invoked, gradually recreating the developer's drag-and-drop operations, ultimately displaying the drag-and-drop design interface. The interface generates code after page layout, component selection, style and event settings, and data binding. Code generation includes including a header CSS file, custom CSS properties, generating the component's page structure in HTML based on its attributes, generating initialization JavaScript based on component data, generating page binding events for components, and adding necessary JavaScript files at the end. When the page is published, the context paths of CSS and JavaScript in the system page can be replaced depending on whether GitLab or Nginx is used. GitLab deployment uses a standard Spring Boot project template program, providing a unified data access interface. Parameters in the template program configuration file can be modified, and the data sources and datasets contained in the current system can be obtained. The system's initialization SQL script is generated and published to GitLab. Nginx deployment retrieves all static pages and resource files in the current system and publishes them to the Nginx server.
[0047] First, data preparation involves acquiring the build resource data required for application construction and retrieving it from the business database. After retrieval, the data is compressed and uploaded to the build module after comparison with the source code. The build module decodes the data to obtain the build resource data. The build resource data first creates a data source based on the database connection information (including URL, username, and password). Currently, multiple data sources are supported, including Oracle, HANA, MySQL, DB2, and MaxCompute. A connection test can be performed on the data source; once the test is successful, the dataset is created. This dataset includes SQL statements with special syntax tags (CRUD operations and parameter passing are identified by different tags), business parameters, and sample data. During use, an algorithm parser parses the special syntax tags and converts them into SQL statements that can be executed correctly in the database. The resource construction data is provided by the business database, which stores the corresponding application code in advance. This method uses JSON / XML metadata to describe the attributes of front-end components and the page layout. The build system uses a grid layout, and the designer guides the user based on nested... The grid layout is completed by the user first placing the grid, and then placing page elements within the grid. The designer records the grid configuration and the relationship between elements within the grid in the metadata. At runtime, the platform converts the grid into HTML+CSS, restores the relationship between page elements and the grid, and then completes page rendering according to the browser size. During the data retrieval process, all the retrieved resource construction data is compressed and uploaded before decoding. The compression and decoding of the source code is achieved by using Huffman coding to compress and decompress the file source code. Next, the application is built. After the resource construction data is obtained, a drag-and-drop design page for the application functions is generated on the webpage. The user designs the required application functions through drag-and-drop functionality. After the application is built, the user confirms on the page to proceed to the next step. The data modeling in this method can be divided into two parts: table structure design and query view design. Business personnel build the table structure and view visually on the interface, and the platform automatically converts them into corresponding SQL statements for direct database operations, omitting the generation and parsing of metadata. The adjustments made to the table structure by business personnel in the designer are translated into corresponding SQL statements and executed on the database. Meanwhile, the designer can obtain the table structure in the database in real time through the schema query capability provided by the database and display it in the designer. On this basis, this method needs to unify the design capabilities of different versions of the database to ensure that the application developed using this method can be seamlessly integrated with third-party software at the data level. This means that this method needs to develop data structures and data access mechanisms for various databases separately to "smooth out" the differences between databases in terms of data types, query operations and other fields for business users.Low-code application building systems, based on their own capability boundaries and encapsulation granularity, abstract the components used to carry business logic into metadata definitions, such as component selection, drag and drop, attributes, and data event configurations. Developers orchestrate and manipulate these components in the designer, and the designer saves these component configuration information as metadata. When the page is initialized, by loading this metadata, the layout and display of the components, the rules and implementation methods for handling business logic are restored, and finally an executable program is formed.Furthermore, low-code application building utilizes a visual framework to construct pages, business logic, and data structures. The designer saves the results of these operations as metadata in intermediate files (project files, packaged from descriptive languages such as JSON). During deployment, developers preprocess these intermediate files using the designer (including but not limited to validity checks, compression, and encryption) and package and publish them to the server. The server then acts as the runtime, automatically parsing the metadata in the intermediate files to ultimately form the application. Application design is entirely handled by the web page, directly provided by the data design module. This module prepares data by intervening in the business database or middleware service through data source configuration. The build module provides rich customizable functional components and page layouts. Page layouts are categorized into three types: advanced layouts, adaptive layouts, and layout tools. Functional components fall into three main categories: basic components, advanced components, and chart components. Component attributes, data, and events are stored using JSON data storage, allowing for configuration of these attributes, data, and events. In this setup, business users place and configure page elements by dragging and dropping. The development tool then automatically generates executable code based on this information, including creating page elements such as controls, setting element positions, and adjusting element styles. During program execution, this code is called, gradually recreating the developer's drag-and-drop operations to ultimately display the drag-and-drop design interface. The interface generates code after page layout and component selection, style and event settings, and data binding. Code generation includes including a CSS file in the header, customizing CSS properties, generating the component's page structure in the HTML based on its attributes, generating initialization JavaScript based on component data, generating page binding events for components, and adding necessary JavaScript files at the end. When the page is deployed, the context paths of the CSS and JavaScript in the system page can be replaced depending on the GitLab or Nginx deployment method. The GitLab deployment method uses a standard Spring deployment... The Boot project template program provides a unified data access interface, allowing modification of parameters in the template program configuration file. It retrieves data source and dataset information for the current system, generates the system's initialization SQL script, and publishes it to GitLab. Then, it uses Nginx to publish all static pages and resource files to the Nginx server. After application deployment, once the application design is complete and user-approved, the application build process is finished. The source files are compressed again, uploaded to the GitLab repository, and decoded and published using automated operations tools. Finally, the build is complete, the script configuration is reviewed by the testing module, and after successful testing, the application is built again, compressed again, and then rendered to finally generate the application module.
[0048] Example 4:
[0049] In Example 3, the following steps are added:
[0050] In step 3, the source code compression and decoding are also performed by using Huffman coding to compress and decompress the source code file. After the GitLab repository obtains the compressed file, it is stored so that users can extract and modify the previously completed design if they need to redesign. The GitLab repository is not limited to storing the previous release.
[0051] In step 4, the application module generates the application icon synchronously after the application is generated.
[0052] First, data preparation involves acquiring the build resource data required for application construction and retrieving it from the business database. After retrieval, the data is compressed and uploaded to the build module after comparison with the source code. The build module decodes the data to obtain the build resource data. The build resource data first creates a data source based on the database connection information (including URL, username, and password). Currently, multiple data sources are supported, including Oracle, HANA, MySQL, DB2, and MaxCompute. A connection test can be performed on the data source; once the test is successful, the dataset is created. This dataset includes SQL statements with special syntax tags (CRUD operations and parameter passing are identified by different tags), business parameters, and sample data. During use, an algorithm parser parses the special syntax tags and converts them into SQL statements that can be executed correctly in the database. The resource construction data is provided by the business database, which stores the corresponding application code in advance. This method uses JSON / XML metadata to describe the attributes of front-end components and the page layout. The build system uses a grid layout, and the designer guides the user based on nested... The grid layout is completed by the user first placing the grid, and then placing page elements within the grid. The designer records the grid configuration and the relationship between elements within the grid in the metadata. At runtime, the platform converts the grid into HTML+CSS, restores the relationship between page elements and the grid, and then completes page rendering according to the browser size. During the data retrieval process, all the retrieved resource construction data is compressed and uploaded before decoding. The compression and decoding of the source code is achieved by using Huffman coding to compress and decompress the file source code. Next, the application is built. After the resource construction data is obtained, a drag-and-drop design page for the application functions is generated on the webpage. The user designs the required application functions through drag-and-drop functionality. After the application is built, the user confirms on the page to proceed to the next step. The data modeling in this method can be divided into two parts: table structure design and query view design. Business personnel build the table structure and view visually on the interface, and the platform automatically converts them into corresponding SQL statements for direct database operations, omitting the generation and parsing of metadata. The adjustments made to the table structure by business personnel in the designer are translated into corresponding SQL statements and executed on the database. Meanwhile, the designer can obtain the table structure in the database in real time through the schema query capability provided by the database and display it in the designer. Based on this, this method needs to unify the design capabilities of different database versions to ensure that applications developed using this method can seamlessly integrate with third-party software at the data level. This means that this method needs to develop separate data structures and data access mechanisms for various databases, "smoothing out" the differences between databases in data types, query operations, and other areas for business users. Low-code application building systems, based on their own capability boundaries and encapsulation granularity,The components used to carry business logic are abstracted into metadata definitions, such as component selection, dragging and dropping, attributes, and data event configurations. Developers orchestrate and manipulate these components in the designer, which saves these component configuration information as metadata. During page initialization, this metadata is loaded to reconstruct the component layout, business logic processing rules and implementation methods, and ultimately form an executable program. Low-code application building uses a visual approach to construct pages, business logic, and data structures. The designer saves the results of these operations as metadata in intermediate files (project files, packaged from descriptive languages such as JSON). During deployment, developers preprocess the intermediate files using the designer (including but not limited to validity checks, compression, and encryption) and package and publish them to the server. The server acts as the runtime, automatically parsing the metadata in the intermediate files to ultimately form the application. Application design is entirely handled by the web page and directly provided by the data design module. The data design module prepares data by intervening in the business database or middleware service through data source configuration. The build module provides rich customizable functional components and page layouts. Page layouts are mainly of three types: advanced layout, adaptive layout, and layout tools. The functional components comprise three main categories: basic components, advanced components, and chart components. Component properties, data, and events are stored in JSON data. These properties, data, and events can be configured. Business users can place and configure page elements via drag-and-drop. The development tool automatically generates executable code based on this information, including creating controls and other page elements, setting element positions, and adjusting element styles. During program execution, this code is called, gradually recreating the developer's drag-and-drop operations to ultimately display the drag-and-drop design interface. The interface generates code after page layout, component selection, style and event settings, and data binding. Code generation includes including a CSS file in the header, customizing CSS properties, generating the component's page structure in the HTML based on its properties, generating initialization JavaScript based on component data, generating page binding events for component events, and adding necessary JavaScript files at the end. When the page is deployed, the context paths of CSS and JavaScript in the system page can be replaced according to the GitLab or Nginx deployment method. The GitLab deployment method uses a standard Spring... The Boot project template program provides a unified data access interface, allowing modification of parameters in the template program configuration file. It retrieves data source and dataset information for the current system, generates the system's initialization SQL script, and publishes it to GitLab. Then, it uses Nginx to publish all static pages and resource files from the current system to the Nginx server. After the application is deployed, its design is completed and approved by the user, the application build is finished, and the source files are compressed again.After being uploaded to the GitLab repository, the code is decoded and released using automated operation and maintenance tools. The source code compression and decoding also utilize Huffman coding to compress and decompress the source code files. The GitLab repository stores the compressed files, allowing users to easily extract and modify previously completed designs for future modifications. The GitLab repository is not limited to storing previous releases. Finally, after the build is complete, the script configuration is reviewed by the testing module. Once the application is tested and found to be error-free, the application build is complete. It is then compressed, uploaded again, decoded, and rendered, ultimately generating the application module. An application icon is generated simultaneously with the application module.
[0053] Although embodiments of the invention have been shown and described, it will be understood by those skilled in the art that various changes, modifications, substitutions and alterations can be made to these embodiments without departing from the principles and spirit of the invention, the scope of which is defined by the appended claims and their equivalents.
Claims
1. A method for rapidly building low-code applications, characterized in that: Includes the following steps: Step 1: Data Preparation: Design a data model based on the application scenario, construct resource data, process and analyze the data using dataset design tools, set input and output parameters, and form target result data that conforms to the application scenario, in order to prepare for data acquisition in interface design. Step 2: Application Building: After acquiring the resource data, a drag-and-drop design page for the application functions is generated on the webpage. Users design the required application functions through drag-and-drop functionality. Developers arrange and manipulate these components in the designer. The designer saves the configuration information of these components as metadata. When the page is initialized, this metadata is loaded to restore the layout and display of the components, the rules and implementation methods of business logic processing, and finally form an executable program. Application building involves visually constructing pages, business logic, and data structures, and the designer saves the results of these operations as intermediate files in the form of metadata. Step 3: Application Deployment: After the application design is completed and confirmed by the user, the application build data is completed, the source files are compressed again, uploaded to the GitLab repository, and then deployed through automated operation and maintenance tools. Step 4: Build complete: After the script configuration is reviewed through the test module and the application is tested and found to be error-free, the application is built, compressed and uploaded again, and then rendered after decoding to finally generate the application module; In step 1, a resource data creation dataset is built, which includes SQL statements with special syntax tags, business parameters, and sample data. When used, the special syntax tags are parsed by an algorithm parser and converted into SQL statements that can be executed normally in the database. The data for building the resource data is provided by the business database, which stores the corresponding application code in advance. In step 1, metadata in JSON / XML format is used to describe the attributes of front-end components and page layout. The build system adopts a grid layout. The designer guides the user to complete the layout based on nestable grids. The user first places the grid and then places page elements in the grid. The designer records the grid configuration and the relationship between elements in the grid in the metadata. At runtime, the platform converts the grid into HTML+CSS, restores the relationship between page elements and grids, and then completes page rendering according to the browser size. During the data retrieval process, all the retrieved build resource data is compressed and uploaded before being decoded. In step 2, the building module provides a wealth of customizable functional components and page layouts. There are three types of page layouts: advanced layout, adaptive layout, and layout tools. The functional components include three main categories: basic components, advanced components, and chart components. The properties, data, and events of the components are stored in JSON data. The properties, data, and events of the components are configured. Business users place and configure page elements by dragging and dropping. The development tool then automatically generates executable program code based on this information, including creating control page elements, setting the position of elements, and adjusting the style of elements. When the program runs, this program code is called, gradually recreating the developer's drag-and-drop operation, and finally displaying the drag-and-drop design interface.
2. The method for rapid construction of low-code applications according to claim 1, characterized in that: In step 1, metadata compression and decoding are achieved by using Huffman coding.
3. The method for rapid construction of low-code applications according to claim 1, characterized in that: In step 2, the application design is entirely performed via a web page and is directly provided by the data design module. The data design module completes data preparation by intervening in the business database or middleware service through data source configuration.
4. The method for rapid construction of low-code applications according to claim 1, characterized in that: In step 2, the interface generates code after page layout and component selection, style and event settings, and data binding. Code generation includes including the header CSS file, custom CSS properties, generating the component's page structure in the HTML based on the component's attributes, generating initialization JavaScript scripts based on the component's data, generating page binding events for the component's events, and adding the necessary JavaScript files at the end. When the page is published, the context paths of the CSS and JavaScript in the system page are replaced according to the GitLab or Nginx publishing method. The GitLab publishing method has a standard Spring Boot project template program that provides a unified data access interface. The parameters in the template program configuration file are modified, and the data source and dataset information contained in the current system are obtained to generate the initialization SQL script of the system and publish it to GitLab. The Nginx publishing method obtains all static pages and resource files in the current system and publishes them to the Nginx server.
5. The method for rapid construction of low-code applications according to claim 1, characterized in that: In step 3, the compression and decoding of the source code are achieved by using Huffman coding.
6. The method for rapid construction of low-code applications according to claim 1, characterized in that: In step 3, the GitLab repository stores the compressed file after obtaining it, so that users can extract and modify the previously completed design if they need to redesign. The GitLab repository is not limited to storing the previous release.
7. The method for rapid construction of low-code applications according to claim 1, characterized in that: In step 4, the application icon is generated synchronously after the application module is generated.
Citation Information
Patent Citations
Low-code development system and method
CN114721630A
Low-code rapid development method based on template language
CN115454411A