This document provides an overview of web application development. It discusses the evolution of application frameworks from single-tier to multi-tier architectures. It also describes the components of a web application like servlets, JSPs, and the web container. The steps for building a simple web application using Eclipse and Tomcat are outlined, including creating the project structure, deployment descriptor, and deploying the WAR file.

1. Module 1: Introduction to
Web Application
Thanisa Krauwaisayawan
Thanachart Numnonda
www.imcinstitute.com

2. Objectives
 Evolution of Enterprise Application Frameworks
 Overview: Java EE
 Web application, components and Web container
 Web application development and deployment steps
 Building Simple Web Applications using Eclipse and Tomcat
 Web Application Archive (*.WAR file)
 *.WAR directory structure
 WEB-INF subdirectory
 Deploying WAR file to Server
2

3. Evolution of Enterprise Application
Framework
 Single tier
 Two tier
 Three tier
– RPC based
– Remote object based
 Three tier (HTML browser and Web server)
 Proprietary and standard application server
3

4. Single Tier (Mainframe-based)
 Dumb terminals are directly connected to
mainframe
 Centralized model (as opposed distributed model)
 Presentation, business logic, and data access are
intertwined in one monolithic mainframe
application
4

5. Two-Tier
SQL
request
Database
SQL
response
 Fat clients talking to back end database
 SQL queries sent, raw data returned
 Presentation,Business logic and Data Model
processing logic in client application
5

6. Three-Tier (RPC based)
SQL
RPC request request
Database
RPC response SQL
response
 Thinner client: business & data model separated from
presentation
 Business logic and data access logic reside in middle tier
server while client handles presentation
 Middle tier server is now required to handle system services
 Concurrency control, threading, transaction, security,
persistence, multiplexing, performance, etc.
6

7. Three-Tier (Remote Object based)
SQL
Object request request
Database
Object SQL
response response
 Business logic and data model captured in objects
– Business logic and data model are now described in
“abstraction” (interface language)
 Object models used: CORBA, RMI, DCOM
 Interface language in CORBA is IDL
 Interface language in RMI is Java interface
7

8. Three-Tier (Web Server)
WEB SQL
HTML request request
Server
Database
HTML response SQL
response
 Browser handles presentation logic
 Browser talks Web server via HTTP protocol
 Business logic and data model are handled by
“dynamic contents generation” technologies (CGI,
Servlet/JSP, ASP)
8

9. Proprietary and Standard Solution
 Comlexity at the middle tier server still remains
 Duplicate system services still need to be provided for
the majority of enterprise applications
– Concurrency control, Transactions
– Load-balancing, Security
– Resource management, Connection pooling
 How to solve this problem?
– Commonly shared container that handles the
above system services
– Proprietary versus standard based

10. JavaTM 2 Platform
Java Platform Micro Edition
(Java ME)
Optional
Packages
Optional
Packages
Personal Personal
Java Java Basis Profile Profile
Enterprise Standard
Edition Edition Foundation Profile MIDP
(Java EE) (Java SE)
CDC Java
CLDC Card
JVM KVM Card VM
10

11. Overview: Java EE
 Java EE is Java SE plus a large number of
serverside APIs, containers and tools.
 Web Tier to Go With Java EE 6
– Servlet 3.0 (JSR 315)
– JavaServer Pages 2.2 (JSR 245)
 Many other subsystems standardized under a
single platform
 EJB, JPA, JMS, JavaMail API, …
11

12. Java EE is End-to-End Solution
Firewall
Java EE
Application
Client Server
Enterprise
Enterprise Information
JavaBeans™
Client Systems (EIS):
Client Relational
Database,
Web Enterprise Legacy
Client Server JavaBeans Applications,
JSP,
Servlets ERP Systems
Client
HTML/XML
Other Services:
JNDI, JMS, Enterprise
Client Middle JavaMail™ Information
Tier Tier Tier
12

13. Web Server
13

14. Web Components & Container
Applet Container Web Container EJB Container
Applet HTTP/ JSP Servlet
HTTPS RMI EJB
J2SE
RMI/IIOP
JavaMail
RMI/IIOP
JavaMail
JDBC
JDBC
JMS
JNDI
JTA
JNDI
JMS
JTA
App Client
Container JAF JAF
App HTTP/
Client HTTPS
J2SE
RMI
RMI/IIOP
JDBC
JNDI
JMS
J2SE J2SE
Database
14

15. Web Components & Container
 Web components are in the form of either Servlet or
JSP (along with JavaBean's and custom tags)
 Web components run in a Web container
 Tomcat is a popular web containers
 All Java EE compliant app servers (GlassFish App Server)
provide web containers
 Web container provides system services to Web
components
 Request dispatching, security, and life cycle management

16. Components/Containers Handle
Components Containers
Handle Handle
 Presentation  Concurrency
 Business Logic  Security
 Availability
 Scalability
 Persistence
 Transaction
 Life-cycle
management
 Management
16

17. Some definitions of the Web
Development Process
 Web Page:
 simple text file consisting of text and HTML tags
 Web Browser:
 connects to a Web Server, sends a request for a page and
receives and displays the result
 interprets HTML tags to display the page exactly the way
the designer wanted it to be
 Web Server:
 software which can respond to a Web browser’s request for
a page and then send that page to the browser
17

18. Web Application & Components
 Web Application is a deployable package
 Web components (Servlets and JSP's)
 Static resource files such as images
 Helper classes
 Libraries
 Deployment descriptor (web.xml file)
 Web Application can be represented as
 A hierarchy of directories and files (unpacked form) or
 *.WAR file reflecting the same hierarchy (packed form)
18

19. 1. Create Development Tree Structure
 KeepWeb application source separate from
compiled files
– facilitate iterative development
 Root directory
– src: Java source of servlets and JavaBeans
components
– WebContent: JSP pages and HTML pages,
images
19

20. 2. Create any static resources
 HTML pages
 welcomePage.html
 Imagefiles that are used by HTML pages or
JSP pages
 Example: dukeWaving.png
20

21. 3. Create deployment descriptor
(web.xml)
 Deployment descriptor contains
deployment time runtime instructions to the
Web container
 URL that the client uses to access the web
component
 Every web application has to have it
 For Servlet 3.0, web.xml is optional.
21

22. 4. Build the Web application
 Build process is made of
 create build directory (if it is not present) and its
subdirectories
 compile Java code into build/classes directory
22

23. Example: Hello Tree Structure
 Hello
– build/classes
• ResultServlet.class
– src
• ResultServlet.java
– WebContent
• WEB-INF
• META-INF
• welcomePage.html
• dukeWaving.png
23

24. 5. Deploy Web application
 Deploy the application over deployment platform
such as Sun Java System App Server or Tomcat
24

25. 6. Perform Client Access to Web
Application
 From a browser, go to URN of the Web
application
25

26. Tool: Eclipse 3.7.2
26

27. New > Server > Apache Tomcat 7.0
27

28. New Dynamic Web Project
28

29. Choose Project Name: Hello and Specify Location
29

30. Drag image into Hello
30

31. New HTML File
31

32. welcomePage.html
32

33. welcomePage.html
<html>
<head>
<title>Hello</title>
</head>
<body>
<form action="result">
<img src="dukeWaving.png" width="79" height="62"
/><br>
<h3> Hello, my name is Duke. What's yours?
<br><br></h3>
<input type="text" name="username" /><br><br>
<input type="submit" value="Submit" />
<input type="reset" value="Reset" />
</form>
</body>
</html>
33

34. http://localhost:8080/Hello/welcomePage.html
34

35. New Servlet…
35

36. ResultServlet.java
36

37. ResultServlet.java
protected void doGet(HttpServletRequest request,
HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=UTF-8");
PrintWriter out = response.getWriter();
String username = request.getParameter("username");
out.print("<h3> Hello " + username + "</h3>");
out.close();
}
37

38. Test & Result
38

39. Web Application
 Web application can be deployed in two
different forms
 a *.war file or
 an unpacked directory laid out in the same format
as a *.war file (build directory)
 Use*.war file when you have to deploy on
a remote machine
39

40. What is *.WAR file?
 Ready to deploy'able package over web container
 Similar to *.jar file
 Contains things to be deployed
 Web components (servlets or JSP's)
 Server-side utility classes
 Static Web presentation content (HTML, image, etc)
 Client-side classes (applets and utility classes)
 Reflects contents in build directory
40

41. Document Root & Context
 Document Root of the Web application
 Top-level directory of WAR
 Contains JSP pages, client-side classes and archives, and
static Web resources are stored
 Also contains WEB-INF directory
 A context is a name that gets mapped to the
document root of a Web application
 /Hello is context for Hello example
 Distinguishes a Web application in a single Web container
 Has to be specified as part of client URN
41

42. Export to Hello.WAR file
42

43. Directory Structure of *.WAR file
43

44. WEB-INF Directory
 Subdirectory of Document root
 Contains
 web.xml : Web application deployment descriptor
 JSP tag library descriptor files
 classes : A directory that contains server-side classes:
servlets, utility classes, and JavaBeans components
 lib : A directory that contains JAR archives of libraries
(tag libraries and any utility libraries called by server-side
classes)
44

45. HTTP request URL & Web component
URN (alias) & Context
 Request URL: User specified access point of a web
resource
 http://[host]:[port]/[request path]?[query string]
 [request path] is made of context and web component's URN
 http://localhost:8080/Hello/result?username=Thanisa
 Context: Name of the root document of a web
application – Identifies a particular application on that
server
 /Hello is context
45

46. Configuring Web Application
 Configuration
information is specified in
web.xml (Web Applications Deployment
Descriptor)
46

47. Alias Paths (of web.xml)
 When a request is received by Servlet container, it must
determine which Web component in a which web
application should handle the request. It does so by
mapping the URL path contained in the request to a Web
component
 A URL path contains the context root and alias path
 http://<host>:8080/context_root/alias_path
 Alias Path can be in the form of either
 /alias-string (for servlet) or
 /*.jsp (for JSP)
47

48. <?xml version="1.0" encoding="UTF-8"?>
:
<servlet>
<servlet-name>ResultServlet</servlet-name>
<servlet-class>servlets.ResultServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>ResultServlet</servlet-name>
<url-pattern>/result</url-pattern>
</servlet-mapping>
<session-config>
<session-timeout>
30
</session-timeout>
</session-config>
<welcome-file-list>
<welcome-file>
welcomePage.html
</welcome-file>
</welcome-file-list>
</web-app>
48

49. Try to deploy in external Tomcat
49

50. Control Panel -> Administrative Tools ->
Services
50

51. http://localhost:8080/Hello/welcomePage.html
51

52. Acknowledgement
Some contents are borrowed from the
presentation slides of Sang Shin, Java™
Technology Evangelist, Sun Microsystems,
Inc.
52

53. Thank you
thananum@gmail.com
www.facebook.com/imcinstitute
www.imcinstitute.com
53