Web Applications
From Initq
We will now write our first JAW motor application. Let's explain some basics of MVC (Model–view–controller) of web development. Then we will explore the building blocks of a web tier (JSP, JSTL, CSS and servlets). After that we make our war or ear with ant.
Contents |
Servlet Container
This is a container because it holds all the JSP and servlets. The request hits the container and the container then does the rest by going to JSP or servlet and getting the results. The container then sends the html result back to the client that requested. JSP and servlets can't run by them self, they need a container. JBoss uses Tomcat as the servlet container. In JBoss6 Tom cat is located at server/default/deploy/jbossweb.sar. Look for server.xml, that is the main Tomcat file and this is where the port 8080 is defined. Also, the web.xml is located at the same place in JBoss6. You can edit the web.xml to change the timeout from 30 minutes to anything else.
Three-Tier Applications
The parts of a J2EE application fall into three basic tiers:
- Presentation tier is the user interface UI that has the JSPs and servlets.
- Business tier has the EJBs and MDBs.
- Persistence tier is where your data is stored. Store it as xml, serialized javabeans, plain text or ascii.
Lets make our first application.
Building The View Cars Page
We will make a nice WAR file and then deploy the WAR on JBoss.
Iteration 1:HTML
JSPs are plain HTML files with some templating capabilities that enable us to plug in data dynamically at runtime.
<html> <body> <table border="1"> <tr> <th>make</th> <th>model</th> <th>model</th> </tr> <tr> <td>bmw</td> <td>z3mcopue</td> <td>1999</td> </tr> </table> </body> </html>
save this file as carList.html
Iteration 2: JSP and JSTL
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <% // DON'T FREAK OUT!!! This scriptlet code will go away once // we have a model and controller in place... String[][] carList = { {"Toyota", "Camry", "2005"}, {"Toyota", "Corolla", "1999"}, {"Ford", "Explorer", "2005"} }; pageContext.setAttribute("carList", carList); %> <html> <head> <link rel="stylesheet" type="text/css" href="default.css"> </head> <body> <table> <tr> <th>Make</th> <th>Model</th> <th class="model-year">Model Year</th> </tr> <c:forEach items='${carList}' var='car'> <tr> <td>${car[0]}</td> <td>${car[1]}</td> <td class="model-year">${car[2]}</td> </tr> </c:forEach> </table> </body> </html>
Iteration 3:CSS
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <% // DON'T FREAK OUT!!! This scriptlet code will go away once // we have a model and controller in place... String[][] carList = { {"Toyota", "Camry", "2005"}, {"Toyota", "Corolla", "1999"}, {"Ford", "Explorer", "2005"} }; pageContext.setAttribute("carList", carList); %> <html> <body> <table border="1"> <tr> <th bgcolor="cccccc" align="left">Make</th> <th bgcolor="cccccc" align="left">Model</th> <th bgcolor="cccccc" align="right">Model Year</th> </tr> <c:forEach items='${carList}' var='car'> <tr> <td align="left">${car[0]}</td> <td align="left">${car[1]}</td> <td align="right">${car[2]}</td> </tr> </c:forEach> </table> </body> </html>
table
{
border-style: solid;
border-color: #aaa;
border-width: 1px;
}
th
{
color: #000;
background-color: #ccc;
border-style: solid;
border-color: #aaa;
border-width: 1px;
font-weight: bold;
text-align: left;}
td
{
color: #000;
background-color: #fff;
border-style: solid;
border-color: #aaa;
border-width: 1px;
text-align: left;
}
.model-year
{
text-align: right;
}