CN113821201A - Code development method and device, electronic equipment and storage medium - Google Patents

Code development method and device, electronic equipment and storage medium Download PDF

Info

Publication number
CN113821201A
CN113821201A CN202111130024.5A CN202111130024A CN113821201A CN 113821201 A CN113821201 A CN 113821201A CN 202111130024 A CN202111130024 A CN 202111130024A CN 113821201 A CN113821201 A CN 113821201A
Authority
CN
China
Prior art keywords
target
component
code
end code
data item
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Withdrawn
Application number
CN202111130024.5A
Other languages
Chinese (zh)
Inventor
贾少龙
符佳凤
颜秉珩
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Jinan Inspur Data Technology Co Ltd
Original Assignee
Jinan Inspur Data Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Jinan Inspur Data Technology Co Ltd filed Critical Jinan Inspur Data Technology Co Ltd
Priority to CN202111130024.5A priority Critical patent/CN113821201A/en
Publication of CN113821201A publication Critical patent/CN113821201A/en
Withdrawn legal-status Critical Current

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/34Graphical or visual programming
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/04845Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range for image manipulation, e.g. dragging, rotation, expansion or change of colour
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/33Intelligent editors

Landscapes

  • Engineering & Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Software Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

The application discloses a code development method, a device, an electronic device and a computer readable storage medium, wherein the method comprises the following steps: receiving a dragging command of a target component, and generating a front-end code based on the target component and a target position corresponding to the dragging command; configuring a data source address and a target data item for the target component, and generating a back-end code based on the data source address and the target data item; acquiring the target data item according to the data source address, and rendering a page based on the parameter information of the target component and the acquired target data item; and deploying the front-end code and the back-end code in a cloud. The code development method provided by the application realizes data intercommunication among systems and improves code development efficiency.

Description

Code development method and device, electronic equipment and storage medium
Technical Field
The present application relates to the field of computer technologies, and in particular, to a code development method and apparatus, an electronic device, and a computer-readable storage medium.
Background
In the current big data era, each enterprise faces the digital intelligent transformation, how to analyze and visually display the big data stored in the cloud, how to solve the visual big screen customization demand that the enterprise is difficult to satisfy, and the method becomes the key of whether the digital intelligent transformation of the enterprise succeeds or not.
A Low-Code Development tool (Low-Code Development) refers to a software Development mode that can quickly generate an application without coding or with only a small amount of Code. In the related technology, a low-code development tool is mostly used for constructing a single system, data among the systems cannot be communicated, integrated data analysis and real-time presentation are difficult to realize, and the code development efficiency is low.
Therefore, how to implement data intercommunication between systems and improve code development efficiency is a technical problem to be solved by those skilled in the art.
Disclosure of Invention
The application aims to provide a code development method, a code development device, an electronic device and a computer readable storage medium, so that data intercommunication among systems is realized, and the code development efficiency is improved.
In order to achieve the above object, the present application provides a code development method, including:
receiving a dragging command of a target component, and generating a front-end code based on the target component and a target position corresponding to the dragging command;
configuring a data source address and a target data item for the target component, and generating a back-end code based on the data source address and the target data item;
acquiring the target data item according to the data source address, and rendering a page based on the parameter information of the target component and the acquired target data item;
and deploying the front-end code and the back-end code in a cloud.
After receiving the drag command of the target component, the method further includes:
displaying default parameter information of the target component;
correspondingly, the method further comprises the following steps:
if a click command of a component in a rendered page is received, displaying the current parameter information of the component;
and receiving a configuration instruction through an input component, and updating the current parameter information according to the configuration instruction.
The obtaining the target data item according to the data source address specifically includes:
and acquiring the target data item from the target database or the target server through a Restful interface.
Wherein, after the target data item is obtained from the target database or the target server through the Restful interface, the method further comprises:
and formatting the acquired target data item, and converting the formatted data into a JSON format to render a page.
The target data item is monitoring data of a target data index, and the target component is a target visualization component;
correspondingly, the rendering a page based on the parameter information of the target component and the acquired target data item includes:
rendering the target visualization component in a page based on the parameter information of the target visualization component, and displaying the monitoring data of the target data index by using the target visualization component.
Wherein deploying the front-end code and the back-end code in front of a cloud further comprises:
outputting codes corresponding to all Restful interfaces;
and receiving a first modification instruction through an input component, and modifying the code corresponding to the Restful interface according to the first modification instruction.
Wherein deploying the front-end code and the back-end code in front of a cloud further comprises:
outputting the front-end code and the back-end code;
and receiving a second modification instruction through an input component, and modifying the front-end code and/or the back-end code according to the second modification instruction.
To achieve the above object, the present application provides a code development apparatus, comprising:
the system comprises a first generation module, a second generation module and a third generation module, wherein the first generation module is used for receiving a dragging command of a target component and generating a front end code based on the target component and a target position corresponding to the dragging command;
a second generation module configured to configure a data source address and a target data item for the target component, and generate a back-end code based on the data source address and the target data item;
the rendering module is used for acquiring the target data item according to the data source address and rendering a page based on the parameter information of the target component and the acquired target data item;
and the deployment module is used for deploying the front-end code and the back-end code in a cloud.
To achieve the above object, the present application provides an electronic device including:
a memory for storing a computer program;
a processor for implementing the steps of the code development method when executing the computer program.
To achieve the above object, the present application provides a computer-readable storage medium having stored thereon a computer program which, when executed by a processor, implements the steps of the code development method as described above.
According to the scheme, the code development method provided by the application comprises the following steps: receiving a dragging command of a target component, and generating a front-end code based on the target component and a target position corresponding to the dragging command; configuring a data source address and a target data item for the target component, and generating a back-end code based on the data source address and the target data item; acquiring the target data item according to the data source address, and rendering a page based on the parameter information of the target component and the acquired target data item; and deploying the front-end code and the back-end code in a cloud.
According to the code development method, the target user can perform page layout in the operation interface through the dragging command, and data are dragged from the database or servers of other systems through the configuration of the data source address and the target data item, so that data intercommunication among the systems is realized. Furthermore, the method and the device automatically generate the front-end code and the back-end code based on the parameter information of the target component, the configured data source address and the target data item, and therefore code development efficiency is improved. The application also discloses a code development device, an electronic device and a computer readable storage medium, which can also realize the technical effects.
It is to be understood that both the foregoing general description and the following detailed description are exemplary and explanatory only and are not restrictive of the application.
Drawings
In order to more clearly illustrate the embodiments of the present application or the technical solutions in the prior art, the drawings used in the description of the embodiments or the prior art will be briefly described below, it is obvious that the drawings in the following description are only some embodiments of the present application, and for those skilled in the art, other drawings can be obtained according to the drawings without creative efforts. The accompanying drawings, which are included to provide a further understanding of the disclosure and are incorporated in and constitute a part of this specification, illustrate embodiments of the disclosure and together with the description serve to explain the disclosure without limiting the disclosure. In the drawings:
FIG. 1 is a flow diagram illustrating a method of code development in accordance with an illustrative embodiment;
FIG. 2 is an architecture diagram illustrating a code development system in accordance with an exemplary embodiment;
FIG. 3 is a schematic illustration of an operator interface for a large screen editor, in accordance with an illustrative embodiment;
FIG. 4 is a block diagram illustrating a code development device in accordance with an exemplary embodiment;
FIG. 5 is a block diagram illustrating an electronic device in accordance with an exemplary embodiment.
Detailed Description
The technical solutions in the embodiments of the present application will be clearly and completely described below with reference to the drawings in the embodiments of the present application. It is to be understood that the embodiments described are only a few embodiments of the present application and not all embodiments. All other embodiments, which can be derived by a person skilled in the art from the embodiments given herein without making any creative effort, shall fall within the protection scope of the present application. In addition, in the embodiments of the present application, "first", "second", and the like are used for distinguishing similar objects, and are not necessarily used for describing a specific order or a sequential order.
The embodiment of the application discloses a code development method, which realizes data intercommunication among systems and improves code development efficiency.
Referring to FIG. 1, a flowchart of a method for code development is shown, according to an exemplary embodiment, as shown in FIG. 1, including:
s101: receiving a dragging command of a target component, and generating a front-end code based on the target component and a target position corresponding to the dragging command;
the purpose of this embodiment is to provide a visualized large-screen editor for a user, and automatically generate a corresponding front-end code according to the user's operation behavior and the canvas page layout. In the step, the user drags the target component to the target position in the operation interface, and the front-end code is automatically generated based on the target component.
As a possible implementation manner, before this step, the method further includes: selecting a target template from a layout template library, and displaying all components contained in the target template. In specific implementation, a target user can select a required template from a layout template library according to requirements, can also select a custom layout, and after operation, a corresponding layout is displayed in a canvas, a position occupying area prompt is given, and a reference line ruler is provided to assist user layout. After the template is selected, the layout template library mainly extends into different application scenes according to the type of data information required to be displayed, corresponding layout solutions are provided for users, and basic components and visual components are selected from the layout component library. The basic component library can be developed by packaging components by using an existing UI (User Interface) component library such as ElementUI or directly using JavaScript, visual components can comprise chart types such as column diagrams, bar diagrams, broken line diagrams, area diagrams, pie charts, biaxial diagrams, Gantt diagrams and maps, a User can Drag a target component into a canvas container, a large screen editor can monitor a Drag ending event, rendering related information such as positioning coordinates (x, y) of the component is acquired, and the rendering related information is output to a canvas renderer to be used for rendering the component.
As a preferred embodiment, after receiving the drag command of the target component, the method further includes: displaying default parameter information of the target component; correspondingly, the method further comprises the following steps: if a click command of a component in a rendered page is received, displaying the current parameter information of the component; and receiving a configuration instruction through an input component, and updating the current parameter information according to the configuration instruction. In a specific implementation, when a target user drags or selects a template or a component, current parameter information of the template or the component, such as a background map, a color, a size, a position and the like, is loaded and displayed in a parameter configuration area, and the target user can modify the current parameter information of the template or the component through an input component.
Furthermore, a view memory can be arranged for storing the front-end code of the visualized large-screen page generated by user operation, and the front-end code is subsequently used for outputting source codes and drawing pages, so that the function expansion of the codes is facilitated for users.
S102: configuring a data source address and a target data item for the target component, and generating a back-end code based on the data source address and the target data item;
in this embodiment, the data linker serves as a switching module to connect the large screen editor and the data source, the data source in this embodiment may be a database, or a server of another system, that is, the data source address is specifically an address of a target database or an address of a target server. As a possible implementation manner, the data linker may interface with a server of another system through a Restful (repeatable State Transfer, a design style and development manner of a network application), that is, the obtaining the target data item according to the data source address includes: and acquiring the target data item from the target database or the target server through a Restful interface.
Preferably, the obtained target data item is formatted, and the formatted data is converted into a JSON format to render a page. In a specific implementation, the target user configures information such as a data source address, a request prefix, a target data item needing to be requested, and the like. The data source address is used for the data linker to connect with the data source, and the request prefix is used for the front-end code to acquire data from the data linker. And the data linker acquires all data source addresses according to the configuration of the target user and is connected to the database or the server of each system. On the basis, data are respectively obtained from a database or a server of each system according to the node data which needs to be displayed specifically by each system. And the data linker formats the acquired data, converts the data into a JSON format and generates a data request interface inside the platform. The data is output to the large-screen displayer for data backfilling, and the data interface outputs the data to the code expander and feeds the data back to the user. When a page is loaded on the visual large screen, initializing data according to interfaces provided by the data linker, and when the data linker is initialized, requesting corresponding data according to a data source address and each data interface; when data in a subsequent server or database is updated, the page rendering is updated through a data subscription push technology (such as webSocket).
Furthermore, a data storage can be set for local temporary storage of user data, and information such as the use state of a user, the large-screen display state and the like is recorded, for example, a monitoring graph of a certain data index is added in a user-defined mode. The data storage stores the configuration information of the large visual screen and the interface conversion mapping information in the platform server.
As a specific implementation manner, the target data item is specifically monitoring data of a target data index, and the target component is specifically a target visualization component; correspondingly, the rendering a page based on the parameter information of the target component and the acquired target data item includes: rendering the target visualization component in a page based on the parameter information of the target visualization component, and displaying the monitoring data of the target data index by using the target visualization component. In a specific implementation, a user can acquire data from only one target system and perform necessary index visualization monitoring on the data, namely, target data indexes are monitored by using a target visualization component. It should be noted that, a user may add a plurality of systems according to a demand, obtain background data of each system through the data linker, and perform visual presentation and integrated data analysis on data indexes of the background data.
S103: acquiring the target data item according to the data source address, and rendering a page based on the parameter information of the target component and the acquired target data item;
in this step, the canvas renderer acquires parameter information of the target component from the large screen editor, acquires the target data item from the data linker, and renders and draws a corresponding visual large screen page on the canvas in real time. The target user can select to export the large screen rendering page into pictures according to requirements, and the pictures are used as propaganda posters or display materials.
S104: and deploying the front-end code and the back-end code in a cloud.
In this step, a packaging and uploading command is executed in an IDE (Integrated Development Environment) according to the front-end code and the back-end code, the code is automatically transmitted and synchronized to a code hosting cloud, and a CI/CD (Continuous Integration and Continuous Delivery) is automatically executed, and the code is deployed to the cloud.
It should be noted that, this embodiment may also provide a code expansion function, that is, before this step, the method further includes: outputting codes corresponding to all Restful interfaces; and receiving a first modification instruction through an input component, and modifying the code corresponding to the Restful interface according to the first modification instruction. Outputting the front-end code and the back-end code; and receiving a second modification instruction through an input component, and modifying the front-end code and/or the back-end code according to the second modification instruction. In specific implementation, the front-end code, the back-end code and all Restful interfaces connected with a database or a server can be output, and a full-source code delivery mode is adopted, so that a target user can perform secondary development on the output code. The target user inquires a corresponding API (Application Programming Interface) Interface file according to the requirement, and uses the Interface request data to carry out customized development.
According to the code development method provided by the embodiment of the application, the target user can perform page layout in the operation interface through the dragging command, and data are dragged from the database or the server of other systems through configuring the data source address and the target data item, so that data intercommunication among the systems is realized. Furthermore, the front-end code and the back-end code are automatically generated based on the parameter information of the target component, the configured data source address and the target data item, and the code development efficiency is improved.
Referring to a specific application scenario provided by the present application, a code development system is shown in fig. 2 and includes a code extender, a large screen editor, a canvas renderer, a view memory, a data linker, a data memory, and a code builder.
The code expander is used for secondary development of the source code of the output program of the invention by a target user. The module collects all APIs in the summary program source code and exposes the APIs to the user, and the user can acquire data according to the requirement and develop customized requirements.
The schematic diagram of the operation interface of the large-screen editor is shown in fig. 3, and mainly comprises sub-modules of a layout template library, a basic component library, a visual component library, a canvas, a template, parameter configuration of components and the like, and has a function of generating front-end codes according to interface visual operation. Firstly, a user selects a required template in a layout template library, and the layout can be customized; after the template is selected, the required basic components and visual components can be selected from the component library according to the type of data information required to be displayed, and the basic components and the visual components are dragged and dropped on the target position on the canvas in a dragging and pulling mode; meanwhile, the parameter information of the selected template or component and the data structure of the node are displayed in a parameter configuration area on the right side of the interface; the canvas will provide a reference line ruler to assist the user in layout; particularly, the large-screen editor module comprises a system integration function, and can acquire monitoring data of different systems through the data linker, and perform visual presentation and integrated data analysis on data indexes of the monitoring data.
The canvas renderer renders a corresponding visualization large-screen demonstration effect on the canvas in real time according to information such as the dragging position coordinates and parameter configuration of the components, and large-screen rendering pages at a certain moment can be exported to be pictures in real time.
The view memory is used for generating and storing UI codes of the visual interface, and is subsequently used for outputting source codes, so that a user can conveniently perform function expansion on the codes.
The data linker is connected with the large visual screen and the data source, and is used as a transfer module for a large visual screen UI interface and cross-system background services to convert data and interfaces. In the invention, the data linker can be directly connected with the database, can also be connected with a server of a target system through a Restful interface to acquire data, and outputs Restful data in a JSON format for unified calling of front-end codes; meanwhile, by means of a micro-service architecture and a containerization idea, the data linker can be simultaneously connected to databases or servers of a plurality of systems according to user requirements, and a large-screen editor is assisted to perform unified data analysis and presentation on different system data.
The data storage is used for the local temporary storage of user data and recording the information such as the use state of a user, for example, a monitoring graph of a certain data index is added by self-definition; when the data changes, the data of the database or the server is synchronized through the data linker;
the code builder executes a command in the IDE according to a front-end code generated by the large-screen editor and a back-end code generated by the data linker, automatically transmits and synchronizes the code to the code hosting cloud, automatically realizes CI/CD, and deploys the code to the cloud.
In the following, a code development apparatus provided by an embodiment of the present application is introduced, and a code development apparatus described below and a code development method described above may be referred to each other.
Referring to fig. 4, a block diagram of a code development apparatus according to an exemplary embodiment is shown, as shown in fig. 4, including:
a first generating module 401, configured to receive a drag command of a target component, and generate a front-end code based on the target component and a target position corresponding to the drag command;
a second generating module 402, configured to configure a data source address and a target data item for the target component, and generate a back-end code based on the data source address and the target data item;
a rendering module 403, configured to obtain the target data item according to the data source address, and render a page based on the parameter information of the target component and the obtained target data item;
a deployment module 404, configured to deploy the front-end code and the back-end code in a cloud.
According to the code development device provided by the embodiment of the application, a target user can perform page layout in an operation interface through a dragging command, and data is dragged from a database or a server of other systems through configuring a data source address and a target data item, so that data intercommunication among the systems is realized. Furthermore, the front-end code and the back-end code are automatically generated based on the parameter information of the target component, the configured data source address and the target data item, and the code development efficiency is improved.
On the basis of the above embodiment, as a preferred implementation, the method further includes:
the first display module is used for displaying the default parameter information of the target assembly;
the second display module is used for displaying the current parameter information of the component if a click command of the component in the rendered page is received;
and the updating module is used for receiving a configuration instruction through an input assembly and updating the current parameter information according to the configuration instruction.
On the basis of the foregoing embodiment, as a preferred implementation manner, the data source address is specifically an address of a target database or an address of a target server, and the rendering module 403 includes:
an obtaining unit, configured to obtain the target data item from the target database or the target server through a Restful interface;
and the rendering unit is used for rendering a page based on the parameter information of the target assembly and the acquired target data item.
On the basis of the foregoing embodiment, as a preferred implementation, the rendering module 403 further includes:
and the conversion unit is used for carrying out formatting processing on the acquired target data item and converting the data after the formatting processing into a JSON format so as to render a page.
On the basis of the above embodiment, as a preferred implementation, the target data item is specifically monitoring data of a target data index, and the target component is specifically a target visualization component;
correspondingly, the rendering unit is specifically a unit that renders the target visualization component in a page based on the parameter information of the target visualization component, and displays the monitoring data of the target data index by using the target visualization component.
On the basis of the above embodiment, as a preferred implementation, the method further includes:
the first output module is used for outputting codes corresponding to all Restful interfaces;
and the first modification module is used for receiving a first modification instruction through an input assembly and modifying the code corresponding to the Restful interface according to the first modification instruction.
On the basis of the above embodiment, as a preferred implementation, the method further includes:
a second output module for outputting the front-end code and the back-end code;
and the second modification module is used for receiving a second modification instruction through an input assembly and modifying the front-end code and/or the back-end code according to the second modification instruction.
With regard to the apparatus in the above-described embodiment, the specific manner in which each module performs the operation has been described in detail in the embodiment related to the method, and will not be elaborated here.
Based on the hardware implementation of the program module, and in order to implement the method according to the embodiment of the present application, an embodiment of the present application further provides an electronic device, and fig. 5 is a structural diagram of an electronic device according to an exemplary embodiment, as shown in fig. 5, the electronic device includes:
a communication interface 1 capable of information interaction with other devices such as network devices and the like;
and the processor 2 is connected with the communication interface 1 to realize information interaction with other equipment, and is used for executing the code development method provided by one or more technical schemes when running a computer program. And the computer program is stored on the memory 3.
In practice, of course, the various components in the electronic device are coupled together by the bus system 4. It will be appreciated that the bus system 4 is used to enable connection communication between these components. The bus system 4 comprises, in addition to a data bus, a power bus, a control bus and a status signal bus. For the sake of clarity, however, the various buses are labeled as bus system 4 in fig. 5.
The memory 3 in the embodiment of the present application is used to store various types of data to support the operation of the electronic device. Examples of such data include: any computer program for operating on an electronic device.
It will be appreciated that the memory 3 may be either volatile memory or nonvolatile memory, and may include both volatile and nonvolatile memory. Among them, the nonvolatile Memory may be a Read Only Memory (ROM), a Programmable Read Only Memory (PROM), an Erasable Programmable Read-Only Memory (EPROM), an Electrically Erasable Programmable Read-Only Memory (EEPROM), a magnetic random access Memory (FRAM), a Flash Memory (Flash Memory), a magnetic surface Memory, an optical disk, or a Compact Disc Read-Only Memory (CD-ROM); the magnetic surface storage may be disk storage or tape storage. Volatile Memory can be Random Access Memory (RAM), which acts as external cache Memory. By way of illustration and not limitation, many forms of RAM are available, such as Static Random Access Memory (SRAM), Synchronous Static Random Access Memory (SSRAM), Dynamic Random Access Memory (DRAM), Synchronous Dynamic Random Access Memory (SDRAM), Double Data Rate Synchronous Dynamic Random Access Memory (DDRSDRAM), Enhanced Synchronous Dynamic Random Access Memory (ESDRAM), Enhanced Synchronous Dynamic Random Access Memory (Enhanced DRAM), Synchronous Dynamic Random Access Memory (SLDRAM), Direct Memory (DRmb Access), and Random Access Memory (DRAM). The memory 2 described in the embodiments of the present application is intended to comprise, without being limited to, these and any other suitable types of memory.
The method disclosed in the above embodiment of the present application may be applied to the processor 2, or implemented by the processor 2. The processor 2 may be an integrated circuit chip having signal processing capabilities. In implementation, the steps of the above method may be performed by integrated logic circuits of hardware or instructions in the form of software in the processor 2. The processor 2 described above may be a general purpose processor, a DSP, or other programmable logic device, discrete gate or transistor logic device, discrete hardware components, or the like. The processor 2 may implement or perform the methods, steps and logic blocks disclosed in the embodiments of the present application. A general purpose processor may be a microprocessor or any conventional processor or the like. The steps of the method disclosed in the embodiments of the present application may be directly implemented by a hardware decoding processor, or implemented by a combination of hardware and software modules in the decoding processor. The software modules may be located in a storage medium located in the memory 3, and the processor 2 reads the program in the memory 3 and in combination with its hardware performs the steps of the aforementioned method.
When the processor 2 executes the program, the corresponding processes in the methods according to the embodiments of the present application are realized, and for brevity, are not described herein again.
In an exemplary embodiment, the present application further provides a storage medium, i.e. a computer storage medium, specifically a computer readable storage medium, for example, including a memory 3 storing a computer program, which can be executed by a processor 2 to implement the steps of the foregoing method. The computer readable storage medium may be Memory such as FRAM, ROM, PROM, EPROM, EEPROM, Flash Memory, magnetic surface Memory, optical disk, or CD-ROM.
Those of ordinary skill in the art will understand that: all or part of the steps for implementing the method embodiments may be implemented by hardware related to program instructions, and the program may be stored in a computer readable storage medium, and when executed, the program performs the steps including the method embodiments; and the aforementioned storage medium includes: a removable storage device, a ROM, a RAM, a magnetic or optical disk, or various other media that can store program code.
Alternatively, the integrated units described above in the present application may be stored in a computer-readable storage medium if they are implemented in the form of software functional modules and sold or used as independent products. Based on such understanding, the technical solutions of the embodiments of the present application may be essentially implemented or portions thereof that contribute to the prior art may be embodied in the form of a software product, which is stored in a storage medium and includes several instructions for enabling an electronic device (which may be a personal computer, a server, or a network device) to execute all or part of the methods described in the embodiments of the present application. And the aforementioned storage medium includes: a removable storage device, a ROM, a RAM, a magnetic or optical disk, or various other media that can store program code.
The above description is only for the specific embodiments of the present application, but the scope of the present application is not limited thereto, and any person skilled in the art can easily conceive of the changes or substitutions within the technical scope of the present application, and shall be covered by the scope of the present application. Therefore, the protection scope of the present application shall be subject to the protection scope of the claims.

Claims (10)

1. A code development method, comprising:
receiving a dragging command of a target component, and generating a front-end code based on the target component and a target position corresponding to the dragging command;
configuring a data source address and a target data item for the target component, and generating a back-end code based on the data source address and the target data item;
acquiring the target data item according to the data source address, and rendering a page based on the parameter information of the target component and the acquired target data item;
and deploying the front-end code and the back-end code in a cloud.
2. The code development method of claim 1, wherein after receiving a drag command for the target component, the method further comprises:
displaying default parameter information of the target component;
correspondingly, the method further comprises the following steps:
if a click command of a component in a rendered page is received, displaying the current parameter information of the component;
and receiving a configuration instruction through an input component, and updating the current parameter information according to the configuration instruction.
3. The code development method according to claim 1, wherein the data source address is specifically an address of a target database or an address of a target server, and the obtaining the target data item according to the data source address includes:
and acquiring the target data item from the target database or the target server through a Restful interface.
4. The code development method according to claim 3, wherein after the obtaining the target data item from the target database or the target server through the Restful interface, the method further comprises:
and formatting the acquired target data item, and converting the formatted data into a JSON format to render a page.
5. The code development method according to claim 3, wherein the target data item is specifically monitoring data of a target data index, and the target component is specifically a target visualization component;
correspondingly, the rendering a page based on the parameter information of the target component and the acquired target data item includes:
rendering the target visualization component in a page based on the parameter information of the target visualization component, and displaying the monitoring data of the target data index by using the target visualization component.
6. The code development method of claim 3, wherein deploying the front-end code and the back-end code in front of a cloud further comprises:
outputting codes corresponding to all Restful interfaces;
and receiving a first modification instruction through an input component, and modifying the code corresponding to the Restful interface according to the first modification instruction.
7. The code development method of claim 1, wherein deploying the front-end code and the back-end code in front of a cloud further comprises:
outputting the front-end code and the back-end code;
and receiving a second modification instruction through an input component, and modifying the front-end code and/or the back-end code according to the second modification instruction.
8. A code development apparatus, comprising:
the system comprises a first generation module, a second generation module and a third generation module, wherein the first generation module is used for receiving a dragging command of a target component and generating a front end code based on the target component and a target position corresponding to the dragging command;
a second generation module configured to configure a data source address and a target data item for the target component, and generate a back-end code based on the data source address and the target data item;
the rendering module is used for acquiring the target data item according to the data source address and rendering a page based on the parameter information of the target component and the acquired target data item;
and the deployment module is used for deploying the front-end code and the back-end code in a cloud.
9. An electronic device, comprising:
a memory for storing a computer program;
a processor for implementing the steps of the code development method of any one of claims 1 to 7 when executing the computer program.
10. A computer-readable storage medium, on which a computer program is stored which, when being executed by a processor, carries out the steps of a code development method according to any one of claims 1 to 7.
CN202111130024.5A 2021-09-26 2021-09-26 Code development method and device, electronic equipment and storage medium Withdrawn CN113821201A (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202111130024.5A CN113821201A (en) 2021-09-26 2021-09-26 Code development method and device, electronic equipment and storage medium

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202111130024.5A CN113821201A (en) 2021-09-26 2021-09-26 Code development method and device, electronic equipment and storage medium

Publications (1)

Publication Number Publication Date
CN113821201A true CN113821201A (en) 2021-12-21

Family

ID=78921234

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202111130024.5A Withdrawn CN113821201A (en) 2021-09-26 2021-09-26 Code development method and device, electronic equipment and storage medium

Country Status (1)

Country Link
CN (1) CN113821201A (en)

Cited By (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN115080042A (en) * 2022-06-30 2022-09-20 中孚安全技术有限公司 User-defined page layout method and system based on embedded data template
CN116048490A (en) * 2023-01-28 2023-05-02 广州钛动科技股份有限公司 Business event processing method, device, computer equipment and storage medium
CN116821195A (en) * 2023-05-31 2023-09-29 郑州富铭科技股份有限公司 Method for automatically generating application based on database
CN117331551A (en) * 2022-06-27 2024-01-02 国家电投集团数字科技有限公司 Large-screen data visualization system and method

Cited By (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN117331551A (en) * 2022-06-27 2024-01-02 国家电投集团数字科技有限公司 Large-screen data visualization system and method
CN115080042A (en) * 2022-06-30 2022-09-20 中孚安全技术有限公司 User-defined page layout method and system based on embedded data template
CN116048490A (en) * 2023-01-28 2023-05-02 广州钛动科技股份有限公司 Business event processing method, device, computer equipment and storage medium
CN116048490B (en) * 2023-01-28 2023-07-14 广州钛动科技股份有限公司 Business event processing method, device, computer equipment and storage medium
CN116821195A (en) * 2023-05-31 2023-09-29 郑州富铭科技股份有限公司 Method for automatically generating application based on database
CN116821195B (en) * 2023-05-31 2024-06-07 郑州富铭科技股份有限公司 Method for automatically generating application based on database

Similar Documents

Publication Publication Date Title
CN113821201A (en) Code development method and device, electronic equipment and storage medium
CN110795095B (en) Method and system for establishing business logic component and business component and generating page
US7661076B2 (en) Two dimensional trees to edit graph-like diagrams
KR101494844B1 (en) System for Transforming Chart Using Metadata and Method thereof
CN111079047B (en) Web-oriented page construction system
CN104216691A (en) Application creating method and device
CN110795148A (en) Method and device for generating layout file and electronic equipment
CN103092612A (en) Method and electronic device for achieving three dimensional (3D) desktop mapping of Android operating system
KR20180082845A (en) Method for Providing E-Book Service and Computer Program Therefore
CN110633436A (en) Visualization and user-defined panorama editing method, system, storage medium and equipment
KR20130047071A (en) Apparatus and method for developing mixed reality application for mobile terminal
CN115495069A (en) Model-driven coal industry software flow implementation method, device and equipment
US10289388B2 (en) Process visualization toolkit
CN114647409A (en) Large-screen visualization application creation platform, method, computing device and storage medium
CN112214622A (en) Data processing method and device for rapidly displaying AutoCAD drawing
US20200013034A1 (en) Remote document generation
CN110764864A (en) Terraform-based visual resource arrangement method
CN116962807A (en) Video rendering method, device, equipment and storage medium
CN103810312B (en) Method and device for the computer-aided design of man-machine interface animated graphics element
CN112083911A (en) Method, device, equipment and medium for generating service arrangement model
GB2431848A (en) Formatting image data for display on a device management tool
CN116610319B (en) Method and system for constructing map application based on low-code platform
CN112015324B (en) Guide board control method and related equipment
CN114900734A (en) Vehicle type comparison video generation method and device, storage medium and computer equipment
CN117348856A (en) Method, device, equipment and computer medium for generating special effect material packet

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
WW01 Invention patent application withdrawn after publication

Application publication date: 20211221

WW01 Invention patent application withdrawn after publication