CN115543317A - Front-end page development method and device - Google Patents

Front-end page development method and device Download PDF

Info

Publication number
CN115543317A
CN115543317A CN202211332460.5A CN202211332460A CN115543317A CN 115543317 A CN115543317 A CN 115543317A CN 202211332460 A CN202211332460 A CN 202211332460A CN 115543317 A CN115543317 A CN 115543317A
Authority
CN
China
Prior art keywords
component
user
style
end page
document
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.)
Pending
Application number
CN202211332460.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.)
Bank of China Ltd
Original Assignee
Bank of China 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 Bank of China Ltd filed Critical Bank of China Ltd
Priority to CN202211332460.5A priority Critical patent/CN115543317A/en
Publication of CN115543317A publication Critical patent/CN115543317A/en
Pending 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/38Creation or generation of source code for implementing user interfaces
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/36Software reuse

Abstract

The embodiment of the invention discloses a front-end page development method and a device, which can be used in the financial field or other technical fields, and the method comprises the following steps: visually displaying the UI style of the component queried by the user to the user; and when the user selects the target component according to the UI style, sending the component document and the component use description document of the target component to the user. The invention improves the development efficiency of the front-end page.

Description

Front-end page development method and device
Technical Field
The invention relates to the technical field of front-end development, in particular to a front-end page development method and device.
Background
The existing method for developing the front-end page of the mobile phone bank realizes the development of a code level according to the page UI provided by a UI designer, part of contents are the existing components of the mobile phone bank, and development colleagues only need to adopt the existing components for development. However, because a relatively uniform mobile phone bank component management and maintenance platform is not available, developers often find existing components in the codes to use for reference writing, and because a formal component use description document is not available, the developers often need to be familiar with the implementation method of the existing components in order to be able to call the existing components, so that the development work efficiency is reduced.
This section is intended to provide a background or context to the embodiments of the invention that are recited in the claims. The description herein is not admitted to be prior art by inclusion in this section.
Disclosure of Invention
The invention provides a front-end page development method and device for improving the development efficiency of a front-end page.
In order to achieve the above object, according to one aspect of the present invention, there is provided a front end page developing method including:
visually displaying the UI style of the component queried by the user to the user;
and when the user selects the target component according to the UI style, sending the component document and the component use description document of the target component to the user.
Optionally, the visually displaying the UI style of the component queried by the user to the user specifically includes:
if the number of the components inquired by the user is larger than 1, combining the UI styles corresponding to the inquired components to generate a combined UI style;
and visually displaying the combined UI style to the user.
Optionally, the front page development method further includes:
and determining the components queried by the user by receiving the component unique identification information input by the user.
Optionally, the front page development method further includes:
generating unique identification information of the component to be added;
associating the component document, the UI style file and the component use description document of the component to be added with the unique identification information of the component to be added;
and storing the component document, the UI style file and the component use description document of the component to be added.
Optionally, the component usage instruction document specifically includes: a component use method and a component use case.
In order to achieve the above object, according to another aspect of the present invention, there is provided a front-end page developing apparatus including:
the UI style display unit is used for visually displaying the UI style of the component inquired by the user to the user;
and the data sending unit is used for sending the component document and the component use description document of the target component to the user when the user selects the target component according to the UI style.
Optionally, the UI style presenting unit specifically includes:
the UI style combination module is used for combining the UI styles corresponding to the inquired components to generate a combined UI style if the number of the components inquired by the user is greater than 1;
and the display module is used for visually displaying the combined UI style to the user.
Optionally, the front-end page developing apparatus further includes:
and the component unique identification information receiving unit is used for determining the components inquired by the user by receiving the component unique identification information input by the user.
Optionally, the front-end page developing apparatus further includes:
the unique component identification information generating unit is used for generating unique component identification information of the component to be added;
the association unit is used for associating the component document, the UI style file and the component use description document of the component to be added with the unique identification information of the component to be added;
and the storage unit is used for storing the component document, the UI style file and the component use description document of the component to be added.
To achieve the above object, according to another aspect of the present invention, there is also provided a computer device including a memory, a processor, and a computer program stored on the memory and executable on the processor, the processor implementing the steps of the front-end page developing method when executing the computer program.
To achieve the above object, according to another aspect of the present invention, there is also provided a computer-readable storage medium having stored thereon a computer program/instructions which, when executed by a processor, implement the steps of the front-end page developing method described above.
To achieve the above object, according to another aspect of the present invention, there is also provided a computer program product comprising computer programs/instructions which, when executed by a processor, implement the steps of the front-end page development method described above.
The invention has the beneficial effects that:
according to the method and the device, when the user queries the component, the UI style of the component is visually displayed to the user, and then when the user selects the target component according to the UI style, the component document and the component use description document of the target component are sent to the user, so that the development efficiency of a front-end page is improved.
Drawings
In order to more clearly illustrate the embodiments or technical solutions of the present invention, the drawings used in the embodiments or technical solutions in the prior art are briefly introduced below, and it is obvious that the drawings in the following description are some embodiments of the present invention, and it is obvious for those skilled in the art that other drawings can be obtained according to these drawings without creative efforts. In the drawings:
FIG. 1 is a first flowchart of a front-end page development method according to an embodiment of the invention;
FIG. 2 is a second flowchart of a front end page development method according to an embodiment of the present invention;
FIG. 3 is a third flowchart of a front-end page development method according to an embodiment of the invention;
FIG. 4 is a first block diagram of a front-end page developing apparatus according to an embodiment of the present invention;
FIG. 5 is a second block diagram of the front-end page developing apparatus according to the embodiment of the present invention;
FIG. 6 is a third block diagram of a front-end page developing apparatus according to the embodiment of the present invention;
FIG. 7 is a schematic diagram of a computer apparatus according to an embodiment of the present invention.
Detailed Description
In order to make the technical solutions of the present invention better understood, the technical solutions in the embodiments of the present invention will be clearly and completely described below with reference to the drawings in the embodiments of the present invention, and it is obvious that the described embodiments are only a part of the embodiments of the present invention, and not all of the embodiments. All other embodiments, which can be obtained by a person skilled in the art without making any creative effort based on the embodiments in the present invention, shall fall within the protection scope of the present invention.
As will be appreciated by one skilled in the art, embodiments of the present invention may be provided as a method, system, or computer program product. Accordingly, the present invention may take the form of an entirely hardware embodiment, an entirely software embodiment or an embodiment combining software and hardware aspects. Furthermore, the present invention may take the form of a computer program product embodied on one or more computer-usable storage media (including, but not limited to, disk storage, CD-ROM, optical storage, and the like) having computer-usable program code embodied therein.
It should be noted that the terms "comprises" and "comprising," and any variations thereof, in the description and claims of this invention and the above-described drawings are intended to cover a non-exclusive inclusion, such that a process, method, system, article, or apparatus that comprises a list of steps or elements is not necessarily limited to those steps or elements explicitly listed, but may include other steps or elements not expressly listed or inherent to such process, method, article, or apparatus.
It should be noted that the embodiments and features of the embodiments may be combined with each other without conflict. The present invention will be described in detail below with reference to the embodiments with reference to the attached drawings.
It should be noted that, in the technical solution of the present application, the acquisition, storage, use, processing, etc. of data all conform to the relevant regulations of the national laws and regulations.
It should be noted that the front page development method and apparatus of the present invention can be used in the financial field, and can also be used in any field other than the financial field.
The invention provides a unified mobile phone bank front-end component maintenance platform, based on the requirement of mobile phone bank APP development, components involved in the development are uniformly maintained on the platform, a use description and a use case are provided, a simple effect viewing platform is provided, developers can input the number (unique component identification information) of the required components on the platform, the platform can display the effect realized by the components, namely UI (user interface) style, and the page effect of combination of a plurality of components can be viewed. Therefore, the visual effect of the page can be improved, and developers can conveniently and quickly master the component using method.
Fig. 1 is a first flowchart of a front-end page development method according to an embodiment of the present invention, and as shown in fig. 1, the front-end page development method according to the present invention includes step S101 and step S103.
And S101, visually displaying the UI style of the component inquired by the user to the user.
In the invention, when the front-end component maintenance platform receives the component query instruction of a user, the UI style of the queried component is visually displayed to the user, so that the user can conveniently select a proper component for use.
And step S102, when the user selects the target component according to the UI style, sending the component document and the component use description document of the target component to the user.
In the invention, the front-end component maintenance platform is used for storing the components, storing the component documents, the component use description documents and the UI styles (namely UI effect diagrams) of the components, and through the platform, UI designers can design the UI according to the existing components, and if the components are not available, developers realize the corresponding components and maintain the components on the platform, thereby greatly improving the efficiency of front-end page development.
In an embodiment of the present invention, the component usage specification document specifically includes: a component use method and a component use case.
As shown in fig. 2, in an embodiment of the present invention, the step S101 of visually displaying the UI style of the component queried by the user to the user specifically includes step S201 and step S202.
Step S201, if the number of the components queried by the user is greater than 1, combining the UI styles corresponding to each queried component to generate a combined UI style.
And S202, visually displaying the combined UI style to the user.
In an embodiment of the present invention, the front end page development method of the present invention further includes:
and determining the components queried by the user by receiving the component unique identification information input by the user.
In one embodiment of the invention, a user can perform component query through the unique identification information of the human component at the front-end component maintenance platform.
As shown in fig. 3, in an embodiment of the present invention, the front-end page developing method of the present invention further includes steps S301 to S303.
Step S301, generating unique component identification information of the component to be added.
Step S302, associating the component document, the UI style file and the component use description document of the component to be added with the component unique identification information of the component to be added.
Step S303, storing the component document, the UI style file and the component use description document of the component to be added.
In one embodiment of the invention, a developer completes the writing of the component and uploads the relevant information of the component to the platform. The developer uploads the UI styles implemented by the components. And the UI designer designs the UI interface according to the existing component styles on the platform, and if the component UI styles cannot be found, the developer is informed to develop and write. And the user searches the corresponding component on the platform according to the UI style and uses the component. Therefore, the development efficiency of the front-end page is improved.
The embodiment shows that the invention develops and maintains a mobile phone bank front-end component maintenance platform, which can improve the development uniformity of the mobile phone bank and avoid the development and use of repeated components, thereby reducing the APP performance and the code maintenance. The invention aims to realize the streamline implementation of development work, provide daily development work efficiency and ensure the readability and maintainability of the whole project of the mobile banking.
It should be noted that the steps illustrated in the flowcharts of the figures may be performed in a computer system such as a set of computer-executable instructions and that, although a logical order is illustrated in the flowcharts, in some cases, the steps illustrated or described may be performed in an order different than presented herein.
Based on the same inventive concept, the embodiment of the present invention further provides a front end page development apparatus, which can be used to implement the front end page development method described in the above embodiment, as described in the following embodiments. Because the principle of solving the problem of the front-end page development device is similar to that of the front-end page development method, the embodiment of the front-end page development device can be referred to the embodiment of the front-end page development method, and repeated parts are not described again. As used hereinafter, the term "unit" or "module" may be a combination of software and/or hardware that implements a predetermined function. Although the means described in the embodiments below are preferably implemented in software, an implementation in hardware, or a combination of software and hardware is also possible and contemplated.
Fig. 4 is a first structural block diagram of a front-end page development apparatus according to an embodiment of the present invention, and as shown in fig. 4, in an embodiment of the present invention, the front-end page development apparatus according to the present invention includes:
the UI style display unit 1 is used for visually displaying the UI style of the component inquired by the user to the user;
and the data sending unit 2 is used for sending the component document and the component use description document of the target component to the user when the user selects the target component according to the UI style.
As shown in fig. 5, in an embodiment of the present invention, the UI style presenting unit 1 specifically includes:
a UI style combination module 101, configured to, if the number of the components queried by the user is greater than 1, combine UI styles corresponding to the queried components, and generate a combined UI style;
and the display module 102 is configured to visually display the combined UI style to the user.
In an embodiment of the present invention, the front-end page developing apparatus of the present invention further includes:
and the component unique identification information receiving unit is used for determining the components inquired by the user by receiving the component unique identification information input by the user.
As shown in fig. 6, in an embodiment of the present invention, the front-end page developing apparatus of the present invention further includes:
the unique component identification information generating unit 3 is used for generating unique component identification information of the component to be added;
the association unit 4 is configured to associate the component document, the UI style file, and the component usage description document of the component to be added with the component unique identification information of the component to be added;
and the storage unit 5 is used for storing the component document, the UI style file and the component use description document of the component to be added.
To achieve the above object, according to another aspect of the present application, there is also provided a computer apparatus. As shown in fig. 7, the computer device comprises a memory, a processor, a communication interface and a communication bus, wherein a computer program that can be run on the processor is stored in the memory, and the steps of the method of the above embodiment are realized when the processor executes the computer program.
The processor may be a Central Processing Unit (CPU). The Processor may also be other general purpose processors, digital Signal Processors (DSPs), application Specific Integrated Circuits (ASICs), field Programmable Gate Arrays (FPGAs) or other Programmable logic devices, discrete Gate or transistor logic devices, discrete hardware components, or a combination thereof.
The memory, which is a non-transitory computer readable storage medium, may be used to store non-transitory software programs, non-transitory computer executable programs, and units, such as the corresponding program units in the above-described method embodiments of the present invention. The processor executes various functional applications of the processor and the processing of the work data by executing the non-transitory software programs, instructions and modules stored in the memory, that is, the method in the above method embodiment is realized.
The memory may include a storage program area and a storage data area, wherein the storage program area may store an operating system, an application program required for at least one function; the storage data area may store data created by the processor, and the like. Further, the memory may include high speed random access memory, and may also include non-transitory memory, such as at least one disk storage device, flash memory device, or other non-transitory solid state storage device. In some embodiments, the memory optionally includes memory located remotely from the processor, and such remote memory may be coupled to the processor via a network. Examples of such networks include, but are not limited to, the internet, intranets, local area networks, mobile communication networks, and combinations thereof.
The one or more units are stored in the memory and, when executed by the processor, perform the method of the above embodiment.
The specific details of the computer device may be understood by referring to the corresponding related descriptions and effects in the above embodiments, and are not described herein again.
In order to achieve the above object, according to another aspect of the present application, there is also provided a computer-readable storage medium storing a computer program which, when executed in a computer processor, implements the steps in the front-end page developing method described above. It will be understood by those skilled in the art that all or part of the processes of the methods of the embodiments described above can be implemented by a computer program, which can be stored in a computer-readable storage medium, and when executed, can include the processes of the embodiments of the methods described above. The storage medium may be a magnetic Disk, an optical Disk, a Read-Only Memory (ROM), a Random Access Memory (RAM), a Flash Memory (Flash Memory), a Hard Disk (Hard Disk Drive, abbreviated as HDD), a Solid State Drive (SSD), or the like; the storage medium may also comprise a combination of memories of the kind described above.
To achieve the above object, according to another aspect of the present application, there is also provided a computer program product comprising computer programs/instructions which, when executed by a processor, implement the steps of the front-end page development method described above.
It will be apparent to those skilled in the art that the modules or steps of the present invention described above may be implemented by a general purpose computing device, they may be centralized on a single computing device or distributed across a network of multiple computing devices, and they may alternatively be implemented by program code executable by a computing device, such that they may be stored in a storage device and executed by a computing device, or fabricated separately as individual integrated circuit modules, or fabricated as a single integrated circuit module from multiple modules or steps. Thus, the present invention is not limited to any specific combination of hardware and software.
The above description is only a preferred embodiment of the present invention and is not intended to limit the present invention, and various modifications and changes may be made by those skilled in the art. Any modification, equivalent replacement, or improvement made within the spirit and principle of the present invention should be included in the protection scope of the present invention.

Claims (13)

1. A front end page developing method, comprising:
visually displaying the UI style of the component queried by the user to the user;
and when the user selects the target component according to the UI style, sending the component document and the component use instruction document of the target component to the user.
2. The front-end page development method according to claim 1, wherein the visually presenting the UI style of the component queried by the user to the user specifically includes:
if the number of the components inquired by the user is larger than 1, combining the UI styles corresponding to the inquired components to generate a combined UI style;
and visually displaying the combined UI style to the user.
3. The front end page developing method according to claim 1, further comprising:
and determining the components queried by the user by receiving the unique component identification information input by the user.
4. The front end page developing method according to claim 1, further comprising:
generating unique identification information of the component to be added;
associating the component document, the UI style file and the component use description document of the component to be added with the unique identification information of the component to be added;
and storing the component document, the UI style file and the component use description document of the component to be added.
5. The front-end page developing method according to claim 1, wherein the component usage specification document specifically includes: a component use method and a component use case.
6. A front-end page development apparatus, comprising:
the UI style display unit is used for visually displaying the UI style of the component inquired by the user to the user;
and the data sending unit is used for sending the component document and the component use description document of the target component to the user when the user selects the target component according to the UI style.
7. The front-end page development device according to claim 6, wherein the UI style presentation unit specifically includes:
the UI style combination module is used for combining the UI styles corresponding to the inquired components to generate a combined UI style if the number of the inquired components of the user is greater than 1;
and the display module is used for visually displaying the combined UI style to the user.
8. The front-end page developing apparatus according to claim 6, further comprising:
and the component unique identification information receiving unit is used for determining the components inquired by the user by receiving the component unique identification information input by the user.
9. The front-end page developing apparatus according to claim 6, further comprising:
the component unique identification information generating unit is used for generating component unique identification information of the component to be added;
the association unit is used for associating the component document, the UI style file and the component use description document of the component to be added with the unique identification information of the component to be added;
and the storage unit is used for storing the component document, the UI style file and the component use description document of the component to be added.
10. The front-end page development device of claim 6, wherein the component usage specification document specifically comprises: a component use method and a component use case.
11. A computer device comprising a memory, a processor and a computer program stored on the memory and executable on the processor, characterized in that the steps of the method according to any of claims 1 to 5 are implemented when the computer program is executed by the processor.
12. A computer-readable storage medium on which a computer program/instructions are stored, characterized in that the computer program/instructions, when executed by a processor, implement the steps of the method of any one of claims 1 to 5.
13. A computer program product comprising computer program/instructions, characterized in that the computer program/instructions, when executed by a processor, implement the steps of the method of any one of claims 1 to 5.
CN202211332460.5A 2022-10-28 2022-10-28 Front-end page development method and device Pending CN115543317A (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202211332460.5A CN115543317A (en) 2022-10-28 2022-10-28 Front-end page development method and device

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202211332460.5A CN115543317A (en) 2022-10-28 2022-10-28 Front-end page development method and device

Publications (1)

Publication Number Publication Date
CN115543317A true CN115543317A (en) 2022-12-30

Family

ID=84719393

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202211332460.5A Pending CN115543317A (en) 2022-10-28 2022-10-28 Front-end page development method and device

Country Status (1)

Country Link
CN (1) CN115543317A (en)

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN116431153A (en) * 2023-06-15 2023-07-14 北京尽微致广信息技术有限公司 UI component screening method, device, equipment and storage medium

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN116431153A (en) * 2023-06-15 2023-07-14 北京尽微致广信息技术有限公司 UI component screening method, device, equipment and storage medium

Similar Documents

Publication Publication Date Title
CN108536761B (en) Report data query method and server
US10534635B2 (en) Personal digital assistant
CN108171528B (en) Attribution method and attribution system
CN111177113B (en) Data migration method, device, computer equipment and storage medium
US20120151188A1 (en) Type and length abstraction for data types
CN115543317A (en) Front-end page development method and device
WO2021169267A1 (en) Text processing method and apparatus, device, and computer-readable storage medium
RU2616164C9 (en) Methods and device for browser engine work
CN109542398B (en) Business system generation method and device and computer readable storage medium
CN116721007B (en) Task control method, system and device, electronic equipment and storage medium
CN111402058B (en) Data processing method, device, equipment and medium
CN111198685B (en) Method for generating front-end interaction page based on user state, device, system, server and storage medium thereof
CN115576843A (en) Software quality management related data visual display method and device
CN113467823B (en) Configuration information acquisition method, device, system and storage medium
CN112905931B (en) Page information display method and device, electronic equipment and storage medium
CN113885996A (en) User interface generation method and device
CN110347471B (en) Hierarchical display component system, display component calling method and device
CN113468258A (en) Heterogeneous data conversion method and device and storage medium
CN109614386B (en) Data processing method, device, server and computer readable storage medium
CN109561146A (en) Document down loading method, device, terminal device
CN111090633A (en) Small file aggregation method, device and equipment of distributed file system
US9946749B2 (en) Rewriting inequality queries
US20210055971A1 (en) Method and node for managing a request for hardware acceleration by means of an accelerator device
CN116804915B (en) Data interaction method, processor, device and medium based on memory
CN114328558B (en) List updating method, apparatus, device and storage medium

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