community/tutorials/BuildJ2EEWebApp/BuildJ2EEWebApp.html - www.eclipse.org/webtools - Git at Google

 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
 <html>
 <head>
 <title>Web Tools Platform</title>

 <link href="../../../../../default_style.css" rel="stylesheet">
 </head>


 <body>

 <div align="right"><font face="Times New Roman, Times, serif"
 	size="2">Copyright © 2004 Naci Dai.</font>
 <table border="0" cellpadding="2" cellspacing="0" width="100%">
 	<tbody>
 		<tr>
 			<td colspan="2" align="left" bgcolor="#0080c0" valign="top"><b><font
 				face="Arial,Helvetica"><font color="#ffffff">Eclipse
 			Article</font></font></b></td>
 		</tr>
 	</tbody>
 </table>
 </div>
 <div align="left">
 <h1 title="RCP Tutorial"><img src="../../../../../images/Idea.jpg"
 	align="middle" height="86" width="120"></h1>
 </div>
 <h1 align="center">WTP Tutorials  Building and Running a Web
 Application</h1>
 <p class="summary">This document is the first in a series of
 tutorials where we will demonstrate how you can use the rich set of
 tools and APIs that comes with the Web Tools Platform Project. This
 first tutorial will give you a step by step tour of using some the tools
 for web development. For this purpose we will build and run a J2EE web
 application using WTP tools and Apache Tomcat.</p>
 <p><b>By Naci Dai, Eteration A.S.</b><br>
 <font size="-1">December 7, 2004</font></p>
 <div align="right">
 <table border="0" cellpadding="2" cellspacing="0" width="100%">
 	<tbody>
 		<tr>
 			<td colspan="2" align="left" bgcolor="#0080c0" valign="top"><b><font
 				face="Arial,Helvetica"><font color="#ffffff">Introduction</font></font></b></td>
 		</tr>
 	</tbody>
 </table>
 </div>
 <p>This document is the first in a series of tutorials where we will
 demonstrate how you can use the rich set of tools and APIs that comes
 with the Web Tools Platform Project. This first tutorial will give you a
 step by step tour of using some the tools for web development. For this
 purpose we will build and run a J2EE web application using <a
 	href="../../../">WTP</a> tools and <a
 	href="http://jakarta.apache.org/tomcat" target="_top">Apache Tomcat</a>.
 </p>
 <div align="right">
 <table border="0" cellpadding="2" cellspacing="0" width="100%">
 	<tbody>
 		<tr>
 			<td colspan="2" align="left" bgcolor="#0080c0" valign="top"><b><font
 				face="Arial,Helvetica"><font color="#ffffff">Getting
 			Started</font></font></b></td>
 		</tr>
 	</tbody>
 </table>
 </div>

 <h3>Java Development Kit</h3>
 <p>You will need a Java Development Kit (JDK) version 1.4.2 and
 above as Eclipse 3.1 requires it. Java Runtime Environment (JRE) is
 sufficient for Eclipse but it will not be suitable for web application
 development. You can get latest JDK from <a href="http://java.sun.com"
 	target="_top">Sun</a>.<br>
 </p>
 <p><img src="images/note.gif" alt="Note: " height="13" width="62">
 Most server runtimes require tools, such as the java compiler (found in
 tools.jar), that are only found in the JDK but not the JRE.</p>

 <p>
 <h3>Server Runtime</h3>
 We are going to be build a web application that runs on a server. To do
 this tutorial you will need a server runtime that is supported by WTP.
 <a href="http://jakarta.apache.org/tomcat" target="_top">Apache
 Tomcat</a>
 ,
 <a href="http://jonas.objectweb.org" target="_top">ObjectWeb Jonas</a>
 , and
 <a href="http://www.jboss.org" target="_top">JBoss</a>
 are some of the OSS licensed server runtimes supported by WTP. You will
 need to download and install the server runtime before you can start
 working with WTP. It does not come with one. Later you will learn how to
 tell WTP to use your preferred server runtime.
 <br>
 <h3>Eclipse and other Eclipse Projects</h3>
 <p>Obviously, you will need an eclipse installation. The Eclipse
 driver used in this tutorial is eclipse-SDK-3.1M3-linux-gtk.zip. You can
 find a suitable driver for your platform at here. WTP uses components
 from other eclipse projects: The eclipse modeling framework, emf, java
 emf model, jem, are used to define models for artifacts defined in many
 java, w3c, xml and j2ee standards; The graphical editing framework, gef,
 is used to provide graphical editing capabilities for xml, xsd and wsdl
 editors, etc. You can obtain these components from their projects.</p>
 <ul>
 	<li><a href="http://www.eclipse.org/emf" target="_top">EMF</a></li>
 	<li><a href="http://www.eclipse.org/gef" target="_top">GEF</a></li>
 	<li><a href="http://www.eclipse.org/vep" target="_top">JEM</a></li>
 </ul>
 <h3>Web Tools Platform</h3>
 <p>You will need to download the full WTP package that is used in
 this tutorial from <a
 	href="http://download.eclipse.org/webtools/downloads">wtp downloads</a>.
 You will need a WTP runtime.</p>
 <p>Once you have everything downloaded, install JDK and your
 favorite server runtime, and unzip eclipse, emf, gef, jem and wtp zip
 files to a folder. You are ready to go!</p>
 <div align="right">
 <table border="0" cellpadding="2" cellspacing="0" width="100%">
 	<tbody>
 		<tr>
 			<td colspan="2" align="left" bgcolor="#0080c0" valign="top"><b><font
 				face="Arial,Helvetica"><font color="#ffffff">Setup</font></font></b></td>
 		</tr>
 	</tbody>
 </table>
 </div>

 <p>
 <h3>Preferences</h3>

 <p>After you launch eclipse for the first time, but before we can
 build our first web application, we need to do a little eclipse house
 keeping: If it is not already defined, you will need to set the Java
 preferences to point to your JDK installation (see figure). You should
 have obtained the latest JDK from <a href="http://java.sun.com"
 	target="_top">Sun</a>.</p>
 <p><img src="images/figure1.png" width="392" height="365"></p>
 <h3>Choose a Server Runtime Environment</h3>
 <p>This step involves changing or creating the settings for
 Installed Server Runtimes. During web application development, we will
 need a server runtime environment to test, debug and run our project. We
 begin by telling wtp what our server runtime is, and where it is
 located. A &#8220;server runtime environment&#8221; is not a server. It
 provides the environment, libraries and infrastructure that a
 &#8220;server&#8221; needs. A server is an instance of the server
 runtime that can host our web applications and other server-side
 components. To define a server runtime, we need to visit the appropriate
 Preferences page:</p>
 <p><img src="images/figure2.png" width="404" height="402"></p>
 <p>Here you will find a list of server runtimes that have been
 defined previously. You can choose a server runtime and change its
 properties. To add a new one click &#8220;Add&#8230;&#8221;. A wizard
 will popup and display a list of server runtimes that are supported by
 WTP. Choose your server runtime from the list. Jonas and JBoss are
 currently supported under the &#8220;Generic Server Runtime&#8221;.
 Basic &#8220;J2EE Runtime Library&#8221; is not a true server runtime,
 but can be used for coding support only. It does not provide a server
 instance that can be used to run web artifacts.</p>
 <p>After you click &#8220;Next&#8221;, you will have to choose the
 JDK and the folder where you have installed your server runtime. Of
 course, based on your choice of the server runtime, you will be asked to
 provide different properties. Click finish. Now we can do the fun part.<br>
 <img src="images/figure3.png" width="317" height="364"></p>
 <p><img src="images/note.gif" alt="Note: " height="13" width="62">
 We chose Apache Tomcat. You can also choose another server such as
 ObjectWeb Jonas. If you would like to use them as your runtime, select
 the &#8220;Generic Server&#8221;, and follow the wizard to define the
 properties for Jonas, JBoss or Weblogic. There are differences between
 for server runtimes; Apache Tomcat provides dynamic development support;
 i.e: the ability to run the web application from the eclipse project
 without the need to publish the artifacts to a server. Generic server
 does not support dynamic development, but it will automatically publish
 the artifacts (your web application) to the server when you run.</p>
 <div align="right">
 <table border="0" cellpadding="2" cellspacing="0" width="100%">
 	<tbody>
 		<tr>
 			<td colspan="2" align="left" bgcolor="#0080c0" valign="top"><b><font
 				color="#FFFFFF" face="Arial,Helvetica">Developing the
 			Application</font></b></td>
 		</tr>
 	</tbody>
 </table>
 </div>

 <p>In this section we will create a J2EE web application that
 contains typical components such as servlets and JSPs. We will:<br>
 &#8226; Create a project with a web module<br>
 &#8226; Create a servlet<br>
 &#8226; Edit deployment descriptor<br>
 &#8226; Create and edit a JSP
 <p>
 <h3>Create a J2EE Web Project with a web module</h3>
 <p>Go to New-&gt;Project. Choose Web category from the list of
 available wizards to create a new eclipse resource. You will find two
 project types available under this category. Simple Web Project is a
 basic Eclipse resource project that can be associated with a server. We
 are interested in creating a J2EE Web Application, so we will choose the
 J2EE Web Project here:<br>
 <img src="images/figure4.png" width="327" height="380"></p>
 <p>A J2EE Web Project is a type of Java project that has been
 initialized to host a server-side application. It needs to be associated
 with a Target Server. <br>
 A target server provides the container which will be used to execute our
 web application. Specifically, it will provide a set of libraries
 (jars), that are added to the project classpath, which are needed to
 compile our custom classes. E.g.: to create a new Servlet, we need
 javax.servlet.* packages. These are not a part of the JDK libraries.
 Server runtime provides them to the project. If yiu have skipped the
 previos step where we defined a server runtime, you will get a chance to
 define one here by clicking on the New&#8230;.<br>
 Make sure that &#8220;Add module to an EAR project&#8221; is not
 selected. We will create a standalone web application that can be
 deployed as a standard web module.<br>
 Finally, we will change the context root to &#8220;tutorial&#8221;. This
 is used when you access the web application with a URL, i.e.
 http://localhost:8080/tutorial <br>
 <img src="images/figure5.png" width="493" height="486"></p>
 <p>When the wizard completes its tasks, you will find that it has
 create a new Java Project and has initialized it so that you can start
 with your development right away: It has created a java source folder.
 You will add your custom java packages and classes here. It has defined
 the classpath (JRE and Tomcat) so that you will have J2EE libraries in
 your project classpath. It has created a resource folder named
 &#8220;Web Content&#8221;, which mimics the standard WAR structure from
 the J2EE specification. It will contain the web resources that will be
 packaged with your J2EE web module. All artifacts inside this folder are
 accessible from the Web Application context.</p>
 <p><img src="images/figure6.png" width="577" height="416"></p>
 <p>
 <h3>The Design</h3>
 <p>This is a simple Hello WTP application. We will call a simple
 &#8220;snoop servlet&#8221; that will display information about the
 client browser in a JSP file.<br>
 <img src="images/figure7.png" width="439" height="383"></p>
 <p>
 <h3>Create a Servlet</h3>
 <p>Go to New-&gt;Class. Create a new Java class that is a subclass
 of the standard javax.servlet.http.HttpServlet:</p>
 <p><br>
 <img src="images/figure8.png" width="490" height="555"></p>
 <p>Add the code provided in Listing 1 to the servlet:</p>
 <p><b>Listing 1. SnoopServlet.java</b></p>
 <pre>package org.eclipse.wtp.tutorial;

 import java.io.IOException;

 import javax.servlet.ServletException;
 import javax.servlet.http.HttpServlet;
 import javax.servlet.http.HttpServletRequest;
 import javax.servlet.http.HttpServletResponse;

 public class SnoopServlet extends HttpServlet {
 	public void doGet(HttpServletRequest req, HttpServletResponse resp)
 			throws ServletException, IOException {
 		String userAgent =  req.getHeader("user-agent");
 		String clientBrowser =  "Not known!";
 		if( userAgent != null)
 			clientBrowser = userAgent;
 		req.setAttribute("client.browser",clientBrowser );
 		req.getRequestDispatcher("/showBrowser.jsp").forward(req,resp);
 	}
 }</pre>


 <h3>Edit Web Module Deployment Descriptor</h3>
 <p>Web modules in J2EE has a deployment descriptor where you
 configure the web application and its components. This deployment
 descriptors is called the web.xml. According to the J2EE specification,
 it must be located in the WEB-INF folder. web.xml must have definitions
 for the Servlet and the Servlet URI mapping. Enter the following lines
 into web.xml:</p>

 <p><b>Listing 2. Deployment Descriptor web.xml </b></p>
 <pre>  &lt;servlet&gt;<br>   &lt;servlet-name&gt;Snoop Servlet&lt;/servlet-name&gt;<br>   &lt;servlet-class&gt;org.eclipse.wtp.tutorial.SnoopServlet&lt;/servlet-class&gt;<br>  &lt;/servlet&gt;<br>  &lt;servlet-mapping&gt;<br>    &lt;servlet-name&gt;Snoop Servlet&lt;/servlet-name&gt;<br>    &lt;url-pattern&gt;/snoop/*&lt;/url-pattern&gt;<br> &lt;/servlet-mapping&gt;<br>
 </pre>

 <p>You can obtain code assist from the WTP XML editor during this
 process by hitting [Ctrl]+[Space] as usual.</p>
 <p><img src="images/figure9.png" width="380" height="160"></p>


 <h3>Add JSP</h3>
 <p>Go to New-&gt;File. Select the WebContent folder and enter
 showBrowser.jsp as the file name.</p>
 <p><img src="images/figure10.png" width="381" height="580"></p>
 <p>Our JSP file will be opened with a &#8220;JSP Source Page
 Editor&#8221;. Hit [Ctrl]+[Space] and choose html template. You can get
 HTML, JavaScript, JSP and Java code assist in a JSP Editor.</p>
 <p><img src="images/figure11.png" width="312" height="206"></p>
 <p>JSP Source Page Editor also provides java code assist. Try the
 following inside a JSP expression:</p>
 <p><img src="images/figure12.png" width="385" height="80"></p>
 <p>At the end your JSP should have the following code</p>
 <p><img src="images/tip.gif" alt="Tip: " height="13" width="62">Use
 the table template</p>
 <p><b>Listing 3. showBrowser.jsp</b></p>
 <pre>&lt;html&gt;<br>&lt;head&gt;&lt;title&gt;Show Browser&lt;/title&gt;&lt;/head&gt;<br>&lt;body&gt;<br>&lt;table border=&quot;1&quot;&gt;<br>	&lt;tr&gt; &lt;th&gt;Header&lt;/th&gt;&lt;th&gt;Value&lt;/th&gt;<br>	&lt;/tr&gt;<br>	&lt;tr&gt;<br>		&lt;td&gt;user-agent&lt;/td&gt;<br>		&lt;td&gt;&lt;%= request.getAttribute(&quot;client.browser&quot;)%&gt;&lt;/td&gt;<br>	&lt;/tr&gt;<br>&lt;/table&gt;<br>&lt;/body&gt;<br>&lt;/html&gt;</pre>


 <h3>Exploring our work:</h3>
 <p>Go to the menu Window &gt;Show View and select the Project
 Explorer view from the J2EE category.</p>

 <p><img src="images/figure13.png" width="295" height="160"></p>
 <p>Project explorer is a smart navigator that knows about the web
 and J2EE artifacts. You will be able to browse your web module,
 deployment descriptors and the contents of these. For example, we can
 navigate to the deployment descriptor and observer our servlet and its
 mapping.</p>
 <p><img src="images/figure14.png" width="284" height="258"></p>
 <p>&nbsp;</p>
 <div align="right">
 <table border="0" cellpadding="2" cellspacing="0" width="100%">
 	<tbody>
 		<tr>
 			<td colspan="2" align="left" bgcolor="#0080c0" valign="top"><b><font
 				color="#FFFFFF" face="Arial,Helvetica">Running the
 			Application</font></b></td>
 		</tr>
 	</tbody>
 </table>
 </div>


 <p>In this section we will run our recently developed web
 application on a server. In order to do this, we will:<br>
 &#8226; Create a server<br>
 &#8226; Add our web module to a server<br>
 &#8226; Run the server<br>
 &#8226; Run the web application.<br>
 </p>
 <h3>Project has Server Properties</h3>
 <p>In the Java Package explorer or the J2EE Project Explorer,
 highlight your project name WTP-Tutorial-I and using the right-click
 menu (mouse menu) choose properties. Alternatively, you can hit
 [Alt]+[Enter]. This will display project properties window. Here we can
 set the target runtime and the default server for the project. Remember
 that we have chosen the target runtime when we created the project. This
 runtime has provided the classpath for the project. You can choose a
 different runtime here. This will change the libraries that are used to
 compile your application. Here we can also choose a default server. The
 default server is the server on which our application will be deployed
 and run. If you have not previously defined a server as set it as
 default, you will see a message in the properties view. To create a
 server you will have to cancel this window and come back to it after you
 have created the server.</p>
 <p><img src="images/figure15.png" width="429" height="255"></p>
 <p>&nbsp;</p>
 <h3>Create a Server</h3>
 <p>Servers can be created using the Server View. To open a server
 view go to Window-&gt;Show View-&gt;Other&#8230;, and choose the Servers
 under the Server category.</p>
 <p><img src="images/figure16.png" width="296" height="421"></p>
 <p>The server view allows you to create servers for the currently
 installed server runtime environments. Use the right click menu to
 create a new server. In the following wizard, choose the server address
 where you will deploy (publish) your web module. You will also have to
 choose the server type and, if you have defined more than one installed
 environment for this server (see preferences), choose the server
 runtime. When you click finish, you have a Server!</p>
 <table width="100%" border="0">
 	<tr>
 		<td><img src="images/figure17.png" width="350" height="63"></td>
 		<td><img src="images/figure18.png" width="363" height="413"></td>
 	</tr>
 </table>
 <p>Now you can go back to the project properties and set your
 default server.</p>
 <table width="100%" border="0">
 	<tr>
 		<td><img src="images/figure19.png" width="389" height="121"></td>
 		<td><img src="images/figure20.png" width="370" height="274"></td>
 	</tr>
 </table>
 <h3>Start the Server</h3>
 <p>In the server view, do a menu-click on your server and choose
 start, or you can simply click the start button. You will see the
 &#8220;Status&#8221; of the server from Stopped to
 &#8220;Starting&#8221;, and when the server is ready it will change its
 status to &quot;Started&quot;.</p>
 <p><img src="images/figure21.png" width="353" height="253"></p>
 <h3>&nbsp;</h3>
 <h3>Running the Application</h3>
 <p>Open your favorite browser and type
 http://localhost:8080/tutorial/snoop.</p>
 <p><img src="images/figure22.png" width="462" height="149"></p>
 <p>
 <h3>Can it be easier?</h3>
 <p>Well, now that you have been through all this trouble to run your
 application, did you know that you could have done all this with almost
 just one click? Try to select you WebContents on try &#8220;Run on
 server&#8230;&#8221;. The web application will popup inside the WTP web
 browser in almost an instant. You can then try to call your servlet as
 usual.<br>
 </p>
 <table width="100%" border="0">
 	<tr>
 		<td><img src="images/figure23.png" width="360" height="91"></td>
 		<td><img src="images/figure24.png" width="463" height="323"></td>
 	</tr>
 </table>
 <p>&nbsp;</p>
 <h3>Conclusion</h3>
 <p>In this tutorial, we looked at what is necessary to create a
 simple web application. The next part will show how we can debug our web
 application and monitor http traffic.</p>

 <h3><br>
 </h3>
 <p><small>Java and all Java-based trademarks and logos are
 trademarks or registered trademarks of Sun Microsystems, Inc. in the
 United States, other countries, or both.</small></p>
 <p><small>Other company, product, and service names may be
 trademarks or service marks of others.</small></p>

 </body>
 </html>
	<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
	<html>
	<head>
	<title>Web Tools Platform</title>

	<link href="../../../../../default_style.css" rel="stylesheet">
	</head>


	<body>

	<div align="right"><font face="Times New Roman, Times, serif"
	size="2">Copyright © 2004 Naci Dai.</font>
	<table border="0" cellpadding="2" cellspacing="0" width="100%">
	<tbody>
	<tr>
	<td colspan="2" align="left" bgcolor="#0080c0" valign="top"><b><font
	face="Arial,Helvetica"><font color="#ffffff">Eclipse
	Article</font></font></b></td>
	</tr>
	</tbody>
	</table>
	</div>
	<div align="left">
	<h1 title="RCP Tutorial"><img src="../../../../../images/Idea.jpg"
	align="middle" height="86" width="120"></h1>
	</div>
	<h1 align="center">WTP Tutorials Building and Running a Web
	Application</h1>
	<p class="summary">This document is the first in a series of
	tutorials where we will demonstrate how you can use the rich set of
	tools and APIs that comes with the Web Tools Platform Project. This
	first tutorial will give you a step by step tour of using some the tools
	for web development. For this purpose we will build and run a J2EE web
	application using WTP tools and Apache Tomcat.</p>
	<p><b>By Naci Dai, Eteration A.S.</b><br>
	<font size="-1">December 7, 2004</font></p>
	<div align="right">
	<table border="0" cellpadding="2" cellspacing="0" width="100%">
	<tbody>
	<tr>
	<td colspan="2" align="left" bgcolor="#0080c0" valign="top"><b><font
	face="Arial,Helvetica"><font color="#ffffff">Introduction</font></font></b></td>
	</tr>
	</tbody>
	</table>
	</div>
	<p>This document is the first in a series of tutorials where we will
	demonstrate how you can use the rich set of tools and APIs that comes
	with the Web Tools Platform Project. This first tutorial will give you a
	step by step tour of using some the tools for web development. For this
	purpose we will build and run a J2EE web application using <a
	href="../../../">WTP</a> tools and <a
	href="http://jakarta.apache.org/tomcat" target="_top">Apache Tomcat</a>.
	</p>
	<div align="right">
	<table border="0" cellpadding="2" cellspacing="0" width="100%">
	<tbody>
	<tr>
	<td colspan="2" align="left" bgcolor="#0080c0" valign="top"><b><font
	face="Arial,Helvetica"><font color="#ffffff">Getting
	Started</font></font></b></td>
	</tr>
	</tbody>
	</table>
	</div>

	<h3>Java Development Kit</h3>
	<p>You will need a Java Development Kit (JDK) version 1.4.2 and
	above as Eclipse 3.1 requires it. Java Runtime Environment (JRE) is
	sufficient for Eclipse but it will not be suitable for web application
	development. You can get latest JDK from <a href="http://java.sun.com"
	target="_top">Sun</a>.<br>
	</p>
	<p><img src="images/note.gif" alt="Note: " height="13" width="62">
	Most server runtimes require tools, such as the java compiler (found in
	tools.jar), that are only found in the JDK but not the JRE.</p>

	<p>
	<h3>Server Runtime</h3>
	We are going to be build a web application that runs on a server. To do
	this tutorial you will need a server runtime that is supported by WTP.
	<a href="http://jakarta.apache.org/tomcat" target="_top">Apache
	Tomcat</a>
	,
	<a href="http://jonas.objectweb.org" target="_top">ObjectWeb Jonas</a>
	, and
	<a href="http://www.jboss.org" target="_top">JBoss</a>
	are some of the OSS licensed server runtimes supported by WTP. You will
	need to download and install the server runtime before you can start
	working with WTP. It does not come with one. Later you will learn how to
	tell WTP to use your preferred server runtime.
	<br>
	<h3>Eclipse and other Eclipse Projects</h3>
	<p>Obviously, you will need an eclipse installation. The Eclipse
	driver used in this tutorial is eclipse-SDK-3.1M3-linux-gtk.zip. You can
	find a suitable driver for your platform at here. WTP uses components
	from other eclipse projects: The eclipse modeling framework, emf, java
	emf model, jem, are used to define models for artifacts defined in many
	java, w3c, xml and j2ee standards; The graphical editing framework, gef,
	is used to provide graphical editing capabilities for xml, xsd and wsdl
	editors, etc. You can obtain these components from their projects.</p>
	<ul>
	<li><a href="http://www.eclipse.org/emf" target="_top">EMF</a></li>
	<li><a href="http://www.eclipse.org/gef" target="_top">GEF</a></li>
	<li><a href="http://www.eclipse.org/vep" target="_top">JEM</a></li>
	</ul>
	<h3>Web Tools Platform</h3>
	<p>You will need to download the full WTP package that is used in
	this tutorial from <a
	href="http://download.eclipse.org/webtools/downloads">wtp downloads</a>.
	You will need a WTP runtime.</p>
	<p>Once you have everything downloaded, install JDK and your
	favorite server runtime, and unzip eclipse, emf, gef, jem and wtp zip
	files to a folder. You are ready to go!</p>
	<div align="right">
	<table border="0" cellpadding="2" cellspacing="0" width="100%">
	<tbody>
	<tr>
	<td colspan="2" align="left" bgcolor="#0080c0" valign="top"><b><font
	face="Arial,Helvetica"><font color="#ffffff">Setup</font></font></b></td>
	</tr>
	</tbody>
	</table>
	</div>

	<p>
	<h3>Preferences</h3>

	<p>After you launch eclipse for the first time, but before we can
	build our first web application, we need to do a little eclipse house
	keeping: If it is not already defined, you will need to set the Java
	preferences to point to your JDK installation (see figure). You should
	have obtained the latest JDK from <a href="http://java.sun.com"
	target="_top">Sun</a>.</p>
	<p><img src="images/figure1.png" width="392" height="365"></p>
	<h3>Choose a Server Runtime Environment</h3>
	<p>This step involves changing or creating the settings for
	Installed Server Runtimes. During web application development, we will
	need a server runtime environment to test, debug and run our project. We
	begin by telling wtp what our server runtime is, and where it is
	located. A “server runtime environment” is not a server. It
	provides the environment, libraries and infrastructure that a
	“server” needs. A server is an instance of the server
	runtime that can host our web applications and other server-side
	components. To define a server runtime, we need to visit the appropriate
	Preferences page:</p>
	<p><img src="images/figure2.png" width="404" height="402"></p>
	<p>Here you will find a list of server runtimes that have been
	defined previously. You can choose a server runtime and change its
	properties. To add a new one click “Add…”. A wizard
	will popup and display a list of server runtimes that are supported by
	WTP. Choose your server runtime from the list. Jonas and JBoss are
	currently supported under the “Generic Server Runtime”.
	Basic “J2EE Runtime Library” is not a true server runtime,
	but can be used for coding support only. It does not provide a server
	instance that can be used to run web artifacts.</p>
	<p>After you click “Next”, you will have to choose the
	JDK and the folder where you have installed your server runtime. Of
	course, based on your choice of the server runtime, you will be asked to
	provide different properties. Click finish. Now we can do the fun part.<br>
	<img src="images/figure3.png" width="317" height="364"></p>
	<p><img src="images/note.gif" alt="Note: " height="13" width="62">
	We chose Apache Tomcat. You can also choose another server such as
	ObjectWeb Jonas. If you would like to use them as your runtime, select
	the “Generic Server”, and follow the wizard to define the
	properties for Jonas, JBoss or Weblogic. There are differences between
	for server runtimes; Apache Tomcat provides dynamic development support;
	i.e: the ability to run the web application from the eclipse project
	without the need to publish the artifacts to a server. Generic server
	does not support dynamic development, but it will automatically publish
	the artifacts (your web application) to the server when you run.</p>
	<div align="right">
	<table border="0" cellpadding="2" cellspacing="0" width="100%">
	<tbody>
	<tr>
	<td colspan="2" align="left" bgcolor="#0080c0" valign="top"><b><font
	color="#FFFFFF" face="Arial,Helvetica">Developing the
	Application</font></b></td>
	</tr>
	</tbody>
	</table>
	</div>

	<p>In this section we will create a J2EE web application that
	contains typical components such as servlets and JSPs. We will:<br>
	• Create a project with a web module<br>
	• Create a servlet<br>
	• Edit deployment descriptor<br>
	• Create and edit a JSP
	<p>
	<h3>Create a J2EE Web Project with a web module</h3>
	<p>Go to New->Project. Choose Web category from the list of
	available wizards to create a new eclipse resource. You will find two
	project types available under this category. Simple Web Project is a
	basic Eclipse resource project that can be associated with a server. We
	are interested in creating a J2EE Web Application, so we will choose the
	J2EE Web Project here:<br>
	<img src="images/figure4.png" width="327" height="380"></p>
	<p>A J2EE Web Project is a type of Java project that has been
	initialized to host a server-side application. It needs to be associated
	with a Target Server. <br>
	A target server provides the container which will be used to execute our
	web application. Specifically, it will provide a set of libraries
	(jars), that are added to the project classpath, which are needed to
	compile our custom classes. E.g.: to create a new Servlet, we need
	javax.servlet.* packages. These are not a part of the JDK libraries.
	Server runtime provides them to the project. If yiu have skipped the
	previos step where we defined a server runtime, you will get a chance to
	define one here by clicking on the New….<br>
	Make sure that “Add module to an EAR project” is not
	selected. We will create a standalone web application that can be
	deployed as a standard web module.<br>
	Finally, we will change the context root to “tutorial”. This
	is used when you access the web application with a URL, i.e.
	http://localhost:8080/tutorial <br>
	<img src="images/figure5.png" width="493" height="486"></p>
	<p>When the wizard completes its tasks, you will find that it has
	create a new Java Project and has initialized it so that you can start
	with your development right away: It has created a java source folder.
	You will add your custom java packages and classes here. It has defined
	the classpath (JRE and Tomcat) so that you will have J2EE libraries in
	your project classpath. It has created a resource folder named
	“Web Content”, which mimics the standard WAR structure from
	the J2EE specification. It will contain the web resources that will be
	packaged with your J2EE web module. All artifacts inside this folder are
	accessible from the Web Application context.</p>
	<p><img src="images/figure6.png" width="577" height="416"></p>
	<p>
	<h3>The Design</h3>
	<p>This is a simple Hello WTP application. We will call a simple
	“snoop servlet” that will display information about the
	client browser in a JSP file.<br>
	<img src="images/figure7.png" width="439" height="383"></p>
	<p>
	<h3>Create a Servlet</h3>
	<p>Go to New->Class. Create a new Java class that is a subclass
	of the standard javax.servlet.http.HttpServlet:</p>
	<p><br>
	<img src="images/figure8.png" width="490" height="555"></p>
	<p>Add the code provided in Listing 1 to the servlet:</p>
	<p><b>Listing 1. SnoopServlet.java</b></p>
	<pre>package org.eclipse.wtp.tutorial;

	import java.io.IOException;

	import javax.servlet.ServletException;
	import javax.servlet.http.HttpServlet;
	import javax.servlet.http.HttpServletRequest;
	import javax.servlet.http.HttpServletResponse;

	public class SnoopServlet extends HttpServlet {
	public void doGet(HttpServletRequest req, HttpServletResponse resp)
	throws ServletException, IOException {
	String userAgent = req.getHeader("user-agent");
	String clientBrowser = "Not known!";
	if( userAgent != null)
	clientBrowser = userAgent;
	req.setAttribute("client.browser",clientBrowser );
	req.getRequestDispatcher("/showBrowser.jsp").forward(req,resp);
	}
	}</pre>


	<h3>Edit Web Module Deployment Descriptor</h3>
	<p>Web modules in J2EE has a deployment descriptor where you
	configure the web application and its components. This deployment
	descriptors is called the web.xml. According to the J2EE specification,
	it must be located in the WEB-INF folder. web.xml must have definitions
	for the Servlet and the Servlet URI mapping. Enter the following lines
	into web.xml:</p>

	<p><b>Listing 2. Deployment Descriptor web.xml </b></p>
	<pre> <servlet><br> <servlet-name>Snoop Servlet</servlet-name><br> <servlet-class>org.eclipse.wtp.tutorial.SnoopServlet</servlet-class><br> </servlet><br> <servlet-mapping><br> <servlet-name>Snoop Servlet</servlet-name><br> <url-pattern>/snoop/*</url-pattern><br> </servlet-mapping><br>
	</pre>

	<p>You can obtain code assist from the WTP XML editor during this
	process by hitting [Ctrl]+[Space] as usual.</p>
	<p><img src="images/figure9.png" width="380" height="160"></p>



	<h3>Add JSP</h3>
	<p>Go to New->File. Select the WebContent folder and enter
	showBrowser.jsp as the file name.</p>
	<p><img src="images/figure10.png" width="381" height="580"></p>
	<p>Our JSP file will be opened with a “JSP Source Page
	Editor”. Hit [Ctrl]+[Space] and choose html template. You can get
	HTML, JavaScript, JSP and Java code assist in a JSP Editor.</p>
	<p><img src="images/figure11.png" width="312" height="206"></p>
	<p>JSP Source Page Editor also provides java code assist. Try the
	following inside a JSP expression:</p>
	<p><img src="images/figure12.png" width="385" height="80"></p>
	<p>At the end your JSP should have the following code</p>
	<p><img src="images/tip.gif" alt="Tip: " height="13" width="62">Use
	the table template</p>
	<p><b>Listing 3. showBrowser.jsp</b></p>
	<pre><html><br><head><title>Show Browser</title></head><br><body><br><table border="1"><br> <tr> <th>Header</th><th>Value</th><br> </tr><br> <tr><br> <td>user-agent</td><br> <td><%= request.getAttribute("client.browser")%></td><br> </tr><br></table><br></body><br></html></pre>


	<h3>Exploring our work:</h3>
	<p>Go to the menu Window >Show View and select the Project
	Explorer view from the J2EE category.</p>

	<p><img src="images/figure13.png" width="295" height="160"></p>
	<p>Project explorer is a smart navigator that knows about the web
	and J2EE artifacts. You will be able to browse your web module,
	deployment descriptors and the contents of these. For example, we can
	navigate to the deployment descriptor and observer our servlet and its
	mapping.</p>
	<p><img src="images/figure14.png" width="284" height="258"></p>
	<p> </p>
	<div align="right">
	<table border="0" cellpadding="2" cellspacing="0" width="100%">
	<tbody>
	<tr>
	<td colspan="2" align="left" bgcolor="#0080c0" valign="top"><b><font
	color="#FFFFFF" face="Arial,Helvetica">Running the
	Application</font></b></td>
	</tr>
	</tbody>
	</table>
	</div>



	<p>In this section we will run our recently developed web
	application on a server. In order to do this, we will:<br>
	• Create a server<br>
	• Add our web module to a server<br>
	• Run the server<br>
	• Run the web application.<br>
	</p>
	<h3>Project has Server Properties</h3>
	<p>In the Java Package explorer or the J2EE Project Explorer,
	highlight your project name WTP-Tutorial-I and using the right-click
	menu (mouse menu) choose properties. Alternatively, you can hit
	[Alt]+[Enter]. This will display project properties window. Here we can
	set the target runtime and the default server for the project. Remember
	that we have chosen the target runtime when we created the project. This
	runtime has provided the classpath for the project. You can choose a
	different runtime here. This will change the libraries that are used to
	compile your application. Here we can also choose a default server. The
	default server is the server on which our application will be deployed
	and run. If you have not previously defined a server as set it as
	default, you will see a message in the properties view. To create a
	server you will have to cancel this window and come back to it after you
	have created the server.</p>
	<p><img src="images/figure15.png" width="429" height="255"></p>
	<p> </p>
	<h3>Create a Server</h3>
	<p>Servers can be created using the Server View. To open a server
	view go to Window->Show View->Other…, and choose the Servers
	under the Server category.</p>
	<p><img src="images/figure16.png" width="296" height="421"></p>
	<p>The server view allows you to create servers for the currently
	installed server runtime environments. Use the right click menu to
	create a new server. In the following wizard, choose the server address
	where you will deploy (publish) your web module. You will also have to
	choose the server type and, if you have defined more than one installed
	environment for this server (see preferences), choose the server
	runtime. When you click finish, you have a Server!</p>
	<table width="100%" border="0">
	<tr>
	<td><img src="images/figure17.png" width="350" height="63"></td>
	<td><img src="images/figure18.png" width="363" height="413"></td>
	</tr>
	</table>
	<p>Now you can go back to the project properties and set your
	default server.</p>
	<table width="100%" border="0">
	<tr>
	<td><img src="images/figure19.png" width="389" height="121"></td>
	<td><img src="images/figure20.png" width="370" height="274"></td>
	</tr>
	</table>
	<h3>Start the Server</h3>
	<p>In the server view, do a menu-click on your server and choose
	start, or you can simply click the start button. You will see the
	“Status” of the server from Stopped to
	“Starting”, and when the server is ready it will change its
	status to "Started".</p>
	<p><img src="images/figure21.png" width="353" height="253"></p>
	<h3> </h3>
	<h3>Running the Application</h3>
	<p>Open your favorite browser and type
	http://localhost:8080/tutorial/snoop.</p>
	<p><img src="images/figure22.png" width="462" height="149"></p>
	<p>
	<h3>Can it be easier?</h3>
	<p>Well, now that you have been through all this trouble to run your
	application, did you know that you could have done all this with almost
	just one click? Try to select you WebContents on try “Run on
	server…”. The web application will popup inside the WTP web
	browser in almost an instant. You can then try to call your servlet as
	usual.<br>
	</p>
	<table width="100%" border="0">
	<tr>
	<td><img src="images/figure23.png" width="360" height="91"></td>
	<td><img src="images/figure24.png" width="463" height="323"></td>
	</tr>
	</table>
	<p> </p>
	<h3>Conclusion</h3>
	<p>In this tutorial, we looked at what is necessary to create a
	simple web application. The next part will show how we can debug our web
	application and monitor http traffic.</p>

	<h3><br>
	</h3>
	<p><small>Java and all Java-based trademarks and logos are
	trademarks or registered trademarks of Sun Microsystems, Inc. in the
	United States, other countries, or both.</small></p>
	<p><small>Other company, product, and service names may be
	trademarks or service marks of others.</small></p>

	</body>
	</html>