LexBuild

Web Application Design


Introduction

This page describes the design architecture and logic flow for the generic web application, front end GUI component. The web applications utilize Tomcat web server and Java Servlet Page (JSP).

File Repository

- WebLexBuild/
|
+-- ReadMe: Projects overview description
|
+-- build/: generated by building program (ant) automatically.
|
+-- build.xml: building script used by ant.
|
+-- docs/: documents go here.
|
+-- src/: Java codes go here. It defines Java Enterprise Bean.
|
+-- web/: Web application related stuff.
     |
     +-- WEB-INF/: includes lib, classes, and web.xml for global usage on this project.
     |
     +-- html/: static html files.
     |
     +-- images/: image files.
     |
     +-- index.html: the default top page.
     |
     +-- jsp/: Java Servlet Page.

Naming Convention

  • directory name:
    • Starts with lower case character
    • Uses '_' to separate words.
  • JSP file name:
    • Uses Java naming convention.
    • Starts with lower case character
    • Uses uppercase on the first character of the next word to separate words.
    • Uses xxxPage.jsp for front end GUI (view, HTML) component.
    • Uses xxx.jsp for control component of xxxPage.jsp.

Logic Flow

General speaking, each web interface page should provide three buttons:

  • OK: Save the latest setup and go to the next page.
  • Cancel: Discard the latest setup and go back to the previous page.
  • Reset: Discard the latest setup, reset the setup to the original, and stay in the current page.
In terms of data, there are three types:
  • Persistent data: data stored in the data base.
  • Real data: a working copy of persistent data. These data are stored in global Java bean.
  • GUI data: data for GUI display. These data are stored in global Java bean.

An example is given below to illustrate the logical flow between JSP pages.