KR101228877B1 - Device and Method for Producing Dynamic Web Site Using Web Design - Google Patents

Abstract

To provide a dynamic web site development apparatus using web design. A dynamic web site development apparatus using web design loads a web design of a user corresponding to the request according to a request from a web client, parses the loaded web design, and processes HTML by a module which is a web program of a program processing layer. (Hypertext Markup Language) A smart controller that extracts an element, sends a module execution request that includes the extracted HTML element, and reconfigures the web design using the HTML element processed by the module's execution, and a module delivered from the smart controller. The module unit may be configured to execute a module according to an execution request, to perform processing in a program processing layer corresponding to a request from a web client, to an HTML element included in the module execution request, and to deliver the processed HTML element to the smart controller. Can be. Therefore, it is possible to shorten the web site construction period, to facilitate maintenance, and to easily build a web site even for a web designer or a general person, not a web developer.

Description

Device and method for developing dynamic web site using web design {Device and Method for Producing Dynamic Web Site Using Web Design}

The present invention relates to an apparatus and method for developing a dynamic web site using a web design, and more particularly, to a web design based on a world wide web using an internet standard HTTP (Hypertext Transfer Protocol) / HTTPS protocol. A technique for implementing or building a dynamic website or web application.

In general, Hypertext Transfer Protocol (HTTP) is a protocol that can exchange information on the World Wide Web, and is used as a request / response protocol performed between a client and a server. The web client requests information such as a web page to a web server through HTTP, and the web server transmits necessary information to the web browser in response to the request. Information delivered via HTTP can be viewed as a Uniform Resource Locator (URL) address starting with 'Http:'.

The web client can request a specific page to the server using the URL, receive a response from the web server, and output the information through the monitor. The user can then view the information output from the monitor. The web server interprets the URL request from the web client to process Hypertext Markup Language (HTML) / Extensible Markup Language (XML) (hereinafter referred to collectively as HTML) documents, and scripts such as Per1, Ruby, PHP, etc. It connects languages with database services, application services, etc. to invoke and process information and create dynamic content that composes web screens.

Such a web server may include a presentation layer and a program processing layer. The presentation layer is a layer that implements web design-related parts shown to a user, and may include elements constituting a web page by HTML, JavaScript, CSS image file, or HTML, JavaScript, CSS, and the like. For example, in the case of a web bulletin board, the presentation layer may include a bulletin board button image, HTML for implementing a web bulletin board design, javascript, and the like.

The program processing layer may be referred to as business logic as a layer including a web program executed by logic written by a developer. For example, when a user registers a post in a web bulletin board, a web program that implements a series of function processing, such as a function of storing a post by accessing a data storage or sending a notification mail, may be included in the program processing layer.

In the conventional web model, the presentation layer is implemented in the same file without separating the web design of the screen and the web program source, and in order to generate the dynamic content in implementing a web application or creating a dynamic website, the presentation layer And the program processing layer combine to create a single web application or dynamic web site.

For example, when a web client requests a web page corresponding to a web address to the web server according to the HTTP / HTTPS protocol, the presentation layer of the web server requests data related to the business service as needed and receives the data to receive HTML and Java. A web standard document composed of a script, CSS, etc. may be generated and responded to the web client, and the web browser of the web client may output the screen.

In such a conventional case, in order to produce a web application or a dynamic web site, web design related to the presentation layer and web program source development and business services related to the program processing layer are required. However, there is a problem that there is a considerable difficulty in acquiring expert knowledge about both web design and web program source development and business services. Therefore, in the process of developing a real web application or dynamic website, a web designer writes a design, and then a web programmer develops a web program source and a business service, and the web design is edited again by the program. many.

In addition, web programmers have difficulty in maintaining and managing programs in the context of understanding web design and writing code including web design in web program sources. In the case of web designers, Requires understanding and collaboration on Web program sources and business services.

In other words, web programmers and web designers need to collaborate and compete with each other and spend time learning and working with sources or web designs for creating web applications or dynamic websites. There is a problem to reduce the efficiency of the work. In addition, in the case of a general person who does not have or have difficulty in developing web design or web programs, the production of a web application or a dynamic website was practically impossible.

The present invention is to solve this problem, the problem to be solved by the present invention is to enable the construction of a dynamic web site and web application through a web design, to shorten the web site construction period and to facilitate maintenance and In addition, the present invention provides an apparatus and method for developing a dynamic web site using web design that enables a web designer or a general person to easily build a web site.

In order to solve this technical problem, an aspect of the present invention provides a dynamic website development apparatus using web design. The dynamic web site development apparatus using the web design loads a web design of a user corresponding to the request according to a request from a web client, parses the loaded web design by a module which is a web program of a program processing layer. A smart controller that extracts a Hypertext Markup Language (HTML) element to be processed, sends a module execution request including the extracted HTML element, and reconfigures the web design using the HTML element processed by the execution of the module. ; And executing the module according to a module execution request transmitted from the smart controller to perform processing in a program processing layer corresponding to a request from the web client with respect to an HTML element included in the module execution request, and processing the processed HTML. And a module unit for delivering an element to the smart controller.

The smart controller may include a smart design engine that detects a module interface identifier specified by an ID among attributes of the extracted HTML element and transmits the module interface identifier and the extracted HTML element; And receiving a module interface identifier and an HTML element transmitted from the smart design engine, and using the module interface identifier to detect information of a module to perform processing on the received HTML element and information of a functional part in the module, The module controller may include a module controller configured to transmit a module execution request including the received HTML element and information of the functional unit to the module included in the module unit.

The smart design engine may determine that an HTML element including an ID among HTML elements of the loaded web page is an HTML element to be processed in a program processing layer.

The module may execute the function unit based on the information of the function unit of the module execution request, and the function unit may acquire processing data in association with an entity required to perform the requested process. The module may generate the processed HTML element by analyzing the processing data obtained by the execution of the function unit and mapping the received data to the received HTML element.

The smart controller may replace the extracted HTML element with the processed HTML element in the web design. The smart controller can also send the reconstructed web design to the web client.

The request from the web client may include a web address. In this case, the smart controller can access the web design using the web address and load the web design.

The module may include a display unit in charge of display-related processing, an execution unit in charge of execution-related processing, an API unit in processing external communication, a management unit performing management-related processing, and a resource unit including resources of a web.

Meanwhile, in order to solve the above technical problem, the present invention provides a dynamic web site development method using web design in another aspect. A dynamic web site development method using the web design, comprising: loading a web design of a user corresponding to the request in response to a request from a web client; Parsing the loaded web design to extract a Hypertext Markup Language (HTML) element to be processed by a module which is a web program of a program processing layer; Executing the module to perform a processing in a program processing layer corresponding to a request from the web client to the extracted HTML element to generate a processed HTML element: and the HTML processed by execution of the module Reconstructing the web design using elements.

The dynamic web site development method using the web design comprises: detecting a module interface identifier specified by an ID among attributes of the extracted HTML element; Detecting information of a module to perform processing on the extracted HTML element and information of a functional part in the module by using the module interface identifier; And transmitting a module execution request including information of the extracted HTML element and the functional unit to the module.

The dynamic web site development method using the web design may further include determining that an HTML element including an ID among HTML elements of the loaded web page is an HTML element to be processed in a program processing layer.

The generating the processed HTML element may include: executing, by the module, the function unit based on information of the function unit of the module execution request; Acquiring processing data in association with an entity necessary for performing the requested processing by the function unit; And generating, by the module, the processed HTML element by analyzing the process data obtained by the execution of the function unit and mapping the processed data to the received HTML element.

Reconstructing the web design may include replacing the extracted HTML element with the processed HTML element in the web design. Meanwhile, the dynamic web site development method using the web design may further include transmitting the reconstructed web design to the web client.

The request from the web client may include a web address. In this case, loading the web design may include loading the web design by accessing the web design using the web address.

As described above, according to the present invention, it is possible to build a dynamic web site and a web application using a web design. Therefore, it is possible to shorten the web site construction period, to facilitate maintenance, and to easily build a web site even for a web designer or a general person, not a web developer.

1 is a block diagram illustrating the concept of a dynamic website development apparatus using a web design according to an embodiment of the present invention.
2 is a block diagram showing the configuration of a dynamic website development apparatus according to a preferred embodiment of the present invention.
3 is a block diagram showing the configuration of a module unit of a dynamic web site development apparatus.
FIG. 4 is a block diagram showing an interlocking relationship between the configurations of the dynamic website development apparatus shown in FIG. 2.
5 is a flowchart illustrating an operation flow of a dynamic web site development apparatus.
FIG. 6 is an exemplary view showing code of a web page in which a web design and a web program source are conventionally mixed.
7 is an exemplary diagram illustrating code of a web design of a user loaded by a smart design engine.
8 is an exemplary diagram illustrating an example of identification of a module interface by the dynamic web design development apparatus.
9A and 9B are exemplary views illustrating mapping of data by a design data mapper.
10 is a block diagram showing an application example of the dynamic website development apparatus applied to such a user PC.
11A and 11B are exemplary views showing an example of HTML source code to which a dynamic web site development apparatus is applied.
12 is a flowchart illustrating an operation procedure of a dynamic web site development apparatus configured as described above.

DETAILED DESCRIPTION OF THE PREFERRED EMBODIMENTS Hereinafter, preferred embodiments of the present invention will be described in detail with reference to the accompanying drawings so that those skilled in the art will readily understand the technical aspects of the present invention. In the following preferred embodiments of the present invention, specific technical terms are used for the sake of clarity. It is to be expressly understood, however, that the invention is not limited to the specific terms thereof, and that each specific term includes all technical synonyms that operate in a similar manner to achieve a similar purpose.

1 is a block diagram illustrating the concept of a dynamic website development apparatus (hereinafter, abbreviated to a dynamic website development apparatus) using a web design according to a preferred embodiment of the present invention.

As shown in FIG. 1, the dynamic web site development apparatus 100 may be provided in the web server 10. The web server 10 may be implemented as one or a plurality of terminals as a WWW-based web server. The dynamic web site development apparatus 100 may interoperate with the web client 20 to create or implement a dynamic web site, a web application, and the like by using a web design that is an expression layer. In other words, the apparatus for developing a dynamic web site according to an exemplary embodiment of the present invention enables a user of the web client 20 to execute a dynamic web site, a web application, or the like without knowledge of a script language or a database service through a web design. To build.

The dynamic web site development apparatus 100 loads a user's web design according to an HTTP / HTTPS (hereinafter referred to as HTTP) request from the web client 20, and the HTML to be processed at the program processing layer in the web design. / XML (hereinafter referred to as HTML) elements may be extracted, processed through a web program of a program processing layer, and reconstructed a web design using the processed HTML elements and then provided to the web client 20.

In this case, the web program of the program processing layer may be implemented in a module structure to provide a single interface. Therefore, the web program of the program processing layer will be referred to as a module hereinafter. The module performs processing in the program processing layer for the HTML element while interworking with the service unit 30 which provides data (eg, data values, JavaScript code, program code, etc.) necessary for processing in the program processing layer. can do.

Meanwhile, the loaded web design of the user may be created by a user through a web editor such as Namo, a web design tool, a text editor, or the like. Therefore, it consists of elements of the presentation layer and does not contain the application source of the program processing layer. That is, it can mean information of pure presentation layer. Such a web design may be stored in a file system, a database system, a network terminal, or the like accessible by the web server 10 via the web address.

2 is a block diagram showing the configuration of a dynamic web site development apparatus 100 according to a preferred embodiment of the present invention.

As shown in FIG. 2, the dynamic web site development apparatus 100 may include a smart controller 110 and a module unit 120.

The smart controller 110 loads a web design of a user corresponding to the request according to the HTTP request from the web client 20, parses the loaded web design, and then is a module 122 which is a web program of a program processing layer. The HTML element to be processed by the user may be extracted, and a module execution request including the extracted HTML element may be transmitted to the module unit 120. In addition, the smart controller 110 may reconfigure the web design using the HTML element processed by the execution of the module 122 and transmit it to the web client 20.

The smart controller 110 may include a smart design engine 112 and a module controller 114.

The smart design engine 112 may load the user's web design according to the HTTP request from the web client 20, parse the web design, extract HTML-related information, and module-related information for extracting the HTML element, request for module execution, module It can perform functions such as reconstruction of web design using HTML elements processed by.

In more detail, the smart design engine 112 may receive an HTTP request received from the web client 20 and load a user's web design corresponding to the received HTTP request. For example, the HTTP request may include a web address that can be accessed by a web design. The smart design engine 112 may access the web design by using the web address included in the HTTP request received from the web client 20 and load the web design by loading the web design into the memory of the web server 10. have.

The smart design engine 112 may analyze the loaded web design and determine that the HTML element having a specific attribute, such as an ID, among the HTML elements in the web design is the HTML element to be processed in the program processing layer. The smart design engine 112 extracts HTML elements having an ID as an attribute from the web design in units of HTML elements, detects a module interface identifier designated by the ID, and includes an HTML element and a corresponding module interface identifier. Module request information may be transferred to the module controller 114.

Meanwhile, the smart design engine 112 may perform a function of generating a web page by reconfiguring the web design using the HTML element processed by the module 122. For example, the smart design engine 112 may replace the HTML elements extracted from the web design with the HTML elements processed by the module 122. The smart design engine 112 may also send the reconstructed web design to the web client 20.

The module controller 114 may generate a module execution request based on the module request information transmitted from the smart design engine 112 and transmit the generated module request to the module unit 120. That is, the module controller 114 may detect a module to be processed and its related information according to the module request information transmitted from the smart design engine 112 and perform a function of instructing execution of the module.

For example, the module controller 114 may detect information of a module to process a corresponding HTML element and a functional unit of the module (eg, a unit in a module executed for processing) through a module interface identifier included in the module request information. In addition, the module controller 114 may transmit a module execution request including information on HTML elements and functional units to the detected module 122.

The module unit 120 may include a plurality of modules for processing in the program processing layer for HTML elements. Each module 122 may process the HTML elements according to the module execution request transmitted from the module controller 110 and transmit the processed HTML elements to the smart controller 110.

3 is a block diagram showing the configuration of the module unit 120 of the dynamic website development apparatus 100.

As shown in FIG. 3, each module 122 of the module unit 120 may include a plurality of functional units 124 and a design data mapper 127. Each functional unit 124 may represent a unit having a unique function for processing HTML elements in a program layer. The function unit 124 may request data required by the service unit 30 from the service unit 30 for the HTML element, for example, data values, JavaScript code, program code, and the like, to obtain data in response. have.

The module 122 includes a display unit 124a in charge of display-related processing, an execution unit 124b in charge of execution-related processing, an API unit 124c in processing external communication, and a management unit 124d in performing management-related processing. And functional units such as a resource unit 124e including resources of the web.

The design data mapper 127 may analyze the data acquired by the function unit 124 and the requested HTML elements to perform mapping. That is, the acquired data is reflected in the HTML element. For example, the data obtained by the display unit 124a of the module 122 and the data display portion of the HTML element may be analyzed and mapped to the data display portion to which the data should be reflected. The design data mapper 127 may transmit the processed HTML element to the smart controller 110.

FIG. 4 is a block diagram showing an interlocking relationship between the configurations of the dynamic website development apparatus 100 shown in FIG. 2.

As shown in FIG. 4, the web design is loaded into the web server 10 by the smart design engine 112 and extracted in units of HTML elements corresponding to each module 122. Such a smart design engine 112 may implement a presentation layer 60 such as web design 40.

Meanwhile, the module controller 114 receives module request information from the smart design engine 112 and transmits a module execution request to the module of the module unit 120 based on the module request information. The module controller 114 and the module unit 120 may implement a program processing layer 70, that is, a layer that performs processing according to business logic.

5 is a flowchart illustrating an operation flow of the dynamic web site development apparatus 100, and illustrates a dynamic web site development method according to a preferred embodiment of the present invention.

As shown in FIG. 5, the web client 20 may send an HTTP request to the smart design engine 112 (step: S1). At this time, the HTTP request includes a web address accessible to the user's web design. The smart design engine 112 may receive an HTTP request and load a web design using the web address (step S2). The loaded web design may be information of a presentation layer that does not include a web program source of a program processing layer.

FIG. 6 is an exemplary view showing code of a web page in which a web design and a web program source are conventionally mixed.

Area from "? PHP " to "? &Quot;

<? php

  $ data = Board :: GetList (0, 10);

?> "

And

"<? php foreach ($ data as $ item)?>

  <a href="board_view.jsp?idx=<?=$item("NO")?> ">

  <tr>

    <td> <? = $ item ("NO")?> </ td>

    <td> <? = $ item ("Title")?> </ td>

    <td> <? = $ item ("author")?> </ td>

    <td> <? = $ item ("Creation Date")?> </ td>

    <td> <? = $ item ("reads")?> </ td>

  </ tr>

  </a>

  <? php}?>

Up to the program source area, that is, the code of the program processing layer. As described above, a web page of this type has a mixture of a presentation layer and a program processing layer, and thus it is very difficult to produce and implement, modify and manage a web program without having both web design knowledge and web programming knowledge.

7 is an exemplary diagram illustrating code of a web design of a user loaded by the smart design engine 112. 8 is an exemplary view showing an example of identification of a module interface by the dynamic web design development apparatus 100.

As shown in FIG. 7, the web design loaded by the smart design engine 112 may be written in a standard HTML document. The smart design engine 112 parses the loaded web design to extract HTML elements to be processed by the module 122 which is a web program of a program processing layer (step S3), and extracts the extracted HTML elements and a module interface. Module request information including an identifier or the like may be transmitted to the module controller 114 (step: S4).

For example, the smart design engine 112 analyzes the loaded web design and determines that the HTML element having a specific attribute, such as an ID, among the HTML elements in the web design is an HTML element to be processed in the program processing layer, and the ID is assigned to the attribute. After extracting the HTML elements having the element in units of HTML elements from the web design, the module interface identifier designated by the corresponding ID is detected, and the module request information including the HTML element and the corresponding module interface identifier can be transmitted to the module controller 114. have.

In the web design shown in FIG. 7, the following HTML element includes an ID in the id = "M_Board_List" part.

<table id = "M_Board_List" cellpadding = "1" cellspacing = "1" width = "98%">

<!-

Number of posts: 10

Post title Max characters: 20

Number of bulletin board paging lists: 5

  ->

  <tr>

    <td> NO </ td>

    <td> Title </ td>

    <td> Author </ td>

    <td> Created </ td>

    <td> reads </ td>

  </ tr>

  <a href="board_view.jsp?idx=$NO">

  <tr>

    <td> $ NO | NUMBER [,]?> </ td>

<td> $ title | LENGTH [32]?> </ td>

    <td> $ author | LENGTH [10]?> </ td>

    <td> $ created | DATE [mm month dd day in YYYY]?> </ td>

    <td> $ reads | NUMBER [,]?> </ td>

  </ tr>

  </a>

</ table>

</ form>

 Thus, the smart design engine 112 extracts the HTML element. At this time, the module interface identifier corresponding to the HTML element is a "M_Board_List" part designated by the ID. As shown in FIG. 8, since "M_Board_List" calls a post list, it may be processed by the display unit 124a of the module 122.

To this end, the user can designate a module interface identifier consisting of an ID and a method of a module to display on ID among attributes of the corresponding HTML element. The module interface identifier may be divided into a repetitive form and a fixed form as described in other items of the table shown in FIG. 8. The module interface identifier may be assigned to all HTML elements having an ID attribute among HTML elements of the web design, and these HTML elements may include child HTML elements.

The module controller 114 may generate a module execution request based on the module request information transmitted from the smart design engine 112 and transmit the generated module request to the module unit 120 (step: S5). That is, the module controller 114 detects the module 122 to be processed and its related information according to the module request information transmitted from the smart design engine 112 and commands the module 122 to execute.

For example, the module controller 114 detects information of the module 122 and the functional units of the module 122 that will process the corresponding HTML element through the module interface identifier included in the module request information, and detects the detected module 122. ) Can send a module execution request including information on HTML elements and functions.

The module 122 receiving the module execution request transmitted from the module controller 114 may execute the function unit 124 based on the information of the function unit included in the module execution request (step S6). The function unit 124 may request data such as a data value, a JavaScript code, a program code, etc. necessary for processing the HTML element to the service unit 30 (step S7), and may acquire data in response. (Step S8).

Subsequently, the design data mapper 127 of the module 122 may analyze the data acquired by the function unit 124 and the HTML element transmitted through the module execution request (step S9). That is, the acquired data is reflected in the delivered HTML element. For example, the data obtained by the display unit 124a of the module 122 and the data display portion of the HTML element may be analyzed and mapped to the data display portion to which the data should be reflected.

9A and 9B are exemplary views illustrating mapping of data by the design data mapper 127.

As illustrated in FIGS. 9A and 9B, the design data mapper 127 generates an HTML element to which the data obtained from the service unit 30 is applied to the HTML element by the execution of the module 122. For example, the bulletin board may be generated by applying individual data values provided from the service unit 30 to the bulletin board design of the presentation layer. The design data mapper 127 may transmit the processed HTML element to the smart controller 110 as a result of executing the module (steps S10 and 11).

The smart design engine 112 of the smart controller 110 may generate an integrated web page by reconstructing the web design using the processed HTML elements delivered from the module 122 (step S12). For example, the smart design engine 112 may replace the HTML elements extracted from the web design with the HTML elements processed by the module 122. Subsequently, the smart design engine 112 may transmit the reconstructed web design to the web client 20 (step S13).

On the other hand, if the user's PC is not able to interwork with the web server through the network, the dynamic web site development device may be applied in a unique environment that does not interoperate with the web server.

10 is a block diagram showing an application example of the dynamic website development apparatus applied to such a user PC.

As shown in FIG. 10, a user configures a web browser 602 and a dynamic web site development device 603 on a user PC 601, and dynamically configures a web server in an environment in which no web server is configured or no internet connection is made. A web design that can use a web site development device can be virtually implemented, and a web environment can be provided where users can design a web anywhere without a web server configuration.

The dynamic web site development device 603 may be written in the Javascript language, which is a client side script language. The dynamic web site development device 603 analyzes and parses the HTML 604-1 of the original web design source source 604 of the user. You can reconfigure your web design just like a screen.

11A and 11B are exemplary views showing an example of HTML source code to which the dynamic web site development apparatus 603 is applied.

11A and 11B, it can be seen that the engine of the dynamic web site development apparatus 603 is included in the form of a script, and a specific web page can be called through an import function. These different functions are provided through function identifiers.

The code below shows the result of the HTML source code of FIG. 11 being processed through the dynamic website development device 603.

<html xmlns = "http://www.w3.org/1999/xhtml">

<head>

  <title> The title of the mall. </ title>

  <meta content = "text / html; charset = UTF-8" http-equiv = "Content-Type" />

  <meta content = "editplus" name = "generator" />

  <meta content = "" name = "author" />

  <meta content = "" name = "keywords" />

  <meta content = "" name = "description" />

  <style>

    .head {clear: both; height: 70px; border-bottom: 2px solid gray; margin-bottom: 10px;}

    .head h1 {padding: 0; margin: 0; font-size: 1.6em; }

    .head ul {list-style: none; padding: 0; margin: 0; }

    .head ul li {float: left; padding: 5 px; margin: 0 5px;}

    .left {width: 200px; padding: 5 px; float: left; margin-right: 15 px; border-right: 1px solid gray;}

    .left .module {border-bottom: 2px solid # f2f2f2; padding: 5px;}

    .left .module h3 {padding: 0; margin: 0; font-size: 0.92em; font-weight: bold;}

    .left .module ul {padding: 0; margin: 0; list-style: none; }

    .left .module ul li {padding: 0 0 0 5px}

    .left .module ul li a {font-size: 0.8em; }

    .wrap_content {width: 640px; float: left; }

    .content {padding: 5px; }

    .content h3 {padding: 0; margin: 0; font-size: 0.92em; font-weight: bold;}

    .content ul {padding: 0; margin: 0; list-style: none; }

    .content ul li {padding: 0 0 0 5px; float: left; border: 1px solid # f2f2f2; width: 190px; margin: 5px; text-align: center; }

    .content ul li a {font-size: 0.8em; }

  </ style>

</ head>

<body>

  <div id = "import_sde_0">

    <div class = "head">

      <h1> Home page title </ h1>

      <ul class = "gnb_menu">

        <li> <a href="index.html"> Home </a> </ li>

        <li> <a href="guest.html"> Guestbook </a> </ li>

        <li> <a href="company.html"> About Us </a> </ li>

        <li> <a href="board.html"> Bulletin </a> </ li>

      </ ul>

    </ div>

  </ div>

  <div id = "import_sde_1">

    <div class = "left">

      <div class = "module">

        <h3> Categories </ h3>

        <ul id = "M_board_1_list">

          <li> <a href="{$link}"> Title </a> </ li>

          <li> <a href="{$link}"> Title </a> </ li>

<li> <a href="{$link}"> Title </a> </ li>

          <li> <a href="{$link}"> Title </a> </ li>

        </ ul>

      </ div>

    <div id = "M_poll_1_form" class = "module">

      <h3> This is a question. </ h3>

      <ul>

        <li> <input type = "radio" value = "{$ value}" /> Answer. </ li>

        <li> <input type = "radio" value = "{$ value}" /> Answer. </ li>

        <li> <input type = "radio" value = "{$ value}" /> Answer. </ li>

        <li> <input type = "radio" value = "{$ value}" /> Answer. </ li>

        </ ul>

      </ div>

    </ div>

  </ div>

  <div class = "wrap_content">

    <div class = "content" id = "M_mall_1_list">

      <h3> Item 1 </ h3>

      <ul>

        <li>

          <img src = "http://www.cafe24.com/admin/common/noimg_100x100.gif" />

          <br/>

          <a href="#"> Title </a>

        </ li>

        <li>

          <img src = "http://www.cafe24.com/admin/common/noimg_100x100.gif" />

          <br/>

          <a href="#"> Title </a>

        </ li>

        <li>

          <img src = "http://www.cafe24.com/admin/common/noimg_100x100.gif" />

          <br/>

          <a href="#"> Title </a>

        </ li>

        <li>

          <img src = "http://www.cafe24.com/admin/common/noimg_100x100.gif" />

          <br/>

          <a href="#"> Title </a>

        </ li>

        <li>

          <img src = "http://www.cafe24.com/admin/common/noimg_100x100.gif" />

          <br/>

          <a href="#"> Title </a>

        </ li>

        <li>

          <img src = "http://www.cafe24.com/admin/common/noimg_100x100.gif" />

          <br/>

          <a href="#"> Title </a>

        </ li>

      </ ul>

    </ div>

  </ div>

  <div style = "clear: both;">

    <div id = "import_sde_2">

<div style = "border-top: 2px solid gray; padding: 10px; clear: both;

       Our company ...

      </ div>

    </ div>

  </ div>

  <script src = "emulation.js" type = "text / javascript" />

</ body>

</ html>

Like the above code, the HTML source code created as in the example shown in FIGS. 11A and 11B may be rewritten into HTML source code capable of outputting a web page.

12 is a flowchart showing an operation procedure of the dynamic web site development apparatus 603 configured as described above.

As shown in FIG. 12, when the web browser 602 is started, the web browser 602 may generate HTML 604-1 and JavaScript 604-1 from the web design source original 604 of the user of the user's PC 601. 2), web design elements such as CSS 604-3, Image 604-4, etc. are loaded and configured on the web (steps S701 to S703).

Subsequently, the dynamic web site development apparatus 603 included in the web design element is executed and initialized, and the web page is regenerated and parsed by the web design element and analyzed (steps S704 to S706). Next, the dynamic web site development apparatus 603 reconstructs the parsed web page and outputs it to the web browser (steps S707 to S708).

As described above, according to the apparatus for developing a dynamic website according to the present invention, the user's web design replaces the role of source code for producing a web application and a dynamic web site, and is easily designed by a user who is not a web program developer. You can build web applications and dynamic web sites by yourself.

That is, the present invention can compose dynamic web pages of various forms by web design, so that anyone who is not a web program developer can access and produce and use the domain of web. In addition, it enables users to efficiently design webs using a web browser, various text editors and web editors on their personal PCs without the need for a web server.

While the present invention has been described above by way of example thereof, those skilled in the art will variously modify and change the present invention without departing from the technical matters and scope of the present invention as set forth in the claims below. It will be understood that it can be done. Accordingly, modifications to future embodiments of the present invention will not depart from the technology of the present invention.

10: Web server
20: web client
30: Service Department
40: web design
60: presentation layer
70: program processing layer
100: dynamic web site development device using web design
110: smart controller
112: smart design engine
114: module controller
120: module
122: module

Claims (15)

In response to a request from a web client, a user loads a web design corresponding to the request, parses the loaded web design, and extracts an HTML (Hypertext Markup Language) element to be processed by a module which is a web program of a program processing layer. A smart controller configured to transmit a module execution request including the extracted HTML element and to reconfigure the web design using the HTML element processed by the execution of the module; And
Execute the module according to the module execution request transmitted from the smart controller to perform processing in the program processing layer corresponding to the request from the web client with respect to the HTML element included in the module execution request and the processed HTML Dynamic website development apparatus using a web design, characterized in that it comprises a module unit for transmitting the element to the smart controller.
The smart controller of claim 1, further comprising: a smart design engine that detects a module interface identifier specified by an ID among attributes of the extracted HTML element, and transmits the module interface identifier and the extracted HTML element; And
Receive a module interface identifier and an HTML element transmitted from the smart design engine, detect information of a module to perform processing on the received HTML element and information of a functional part in the module using the module interface identifier, And a module controller for transmitting a module execution request including the received HTML element and information of the functional unit to a module included in the module unit.
The dynamic web using the web design of claim 2, wherein the smart design engine determines that an HTML element including an ID among HTML elements of the loaded web page is an HTML element to be processed in a program processing layer. Site development device.
The method of claim 2, wherein the module executes the function unit based on the information of the function unit of the module execution request, and the function unit acquires the processing data in association with an entity required to perform the requested process. Dynamic web site development device using web design.
The dynamic web site according to claim 2, wherein the module generates the processed HTML element by analyzing the processing data obtained by the execution of the functional unit and mapping the received data to the received HTML element. Development device.
The method of claim 1, wherein the smart controller replaces the extracted HTML element with the processed HTML element in the web design and transmits the reconstructed web design to the web client. Website development device.
2. The dynamic method of claim 1, wherein the request from the web client includes a web address, and the smart controller accesses the web design using the web address to load the web design. Website development device.
The resource of claim 1, wherein the module comprises a display unit in charge of display-related processing, an execution unit in charge of execution-related processing, an API unit in processing external communication, a management unit performing management-related processing, and resources of a web. Dynamic website development apparatus using a web design, characterized in that it comprises a wealth.
In the method performed by the dynamic web site development device,
Loading a web design of a user corresponding to the request according to a request from a web client;
Parsing the loaded web design to extract a Hypertext Markup Language (HTML) element to be processed by a module which is a web program of a program processing layer;
Executing the module to perform processing in a program processing layer corresponding to a request from the web client to the extracted HTML element to generate a processed HTML element; and
And reconstructing the web design using the HTML element processed by the execution of the module.
10. The method of claim 9, further comprising: detecting a module interface identifier specified by an ID among attributes of the extracted HTML element;
Detecting information of a module to perform processing on the extracted HTML element and information of a functional part in the module by using the module interface identifier; And
And transmitting a module execution request including the extracted HTML element and the functional unit to the module to the module. 2.
11. The method of claim 10, further comprising the step of determining that the HTML element including the ID among the HTML elements of the loaded web page is an HTML element to be processed in the program processing layer, the dynamic web using a web design How to develop a site.
The method of claim 10, wherein generating the processed HTML element comprises:
Executing, by the module, the functional unit based on the information of the functional unit of the module execution request;
Acquiring processing data in association with an entity necessary for performing the requested processing by the function unit; And
And generating, by the module, the processed HTML element by analyzing the process data obtained by the execution of the function unit and mapping the received data to the received HTML element. .
The method of claim 10, wherein reconfiguring the web design comprises:
And replacing the extracted HTML element with the processed HTML element in the web design.
10. The method of claim 9, further comprising transmitting the reconstructed web design to the web client.
10. The method of claim 9, wherein the request from the web client includes a web address,
Loading the web design,
And loading the web design by accessing the web design using the web address.

Images