Eclipse & Tomcat - Create a Webapp

(Free Web Tutorial)

by Michael Thomas

Use Eclipse to create a new webapp that will run on Tomcat from a .war file or from scratch.
On the Eclipse Home page, you can download the whole Eclipse site (all content, tutorials & examples) !!!

This tutorial covers: Eclipse Helios (IDE for Java EE Developers) (1.3.0) , Apache Tomcat 6.0.29 (as of 08/12/2010)

Prerequisites

Have Eclipse installed.
Have Tomcat installed.
Know how to Start/Stop Tomcat and/or Reload a WebApp (we have a Tomcat Tutorial on that).
This tutorials has been tested in the following environment:
Date: 08/12/2010
OS: Win 7
JDK: jdk1.6.0_21
Eclipse Helios: 1.3.0

(Older Tutorial - Date: 05/14/08, OS: Win XPro, JDK: jdk1.6.0_03)

Objectives

Create a new Eclipse project tied to an existing Web App running on Tomcat.
Use Eclipse to create & edit a webapp running on Tomcat.

General Info**

Reload Web App or Stop/Start Tomcat Service
- FYI - Remember if you make changes to the web.xml or .java source files you will need to "Reload" the Webapp or Start/Stop the "Apache Tomcat" service.
  (Note: There is a free Tomcat Tutorial which covers those steps.)
  - To Stop/Start the Tomcat service:
    Control Panel, Administrative Tools, Services, then right click on "Apache Tomcat" and choose Stop, then Start.
  - To reload the webapp:
    http://localhost:8080 , click "Tomcat Manager", find the webapp and choose "Reload"

Create an Eclipse Project for a Tomcat Webapp

myeclipse-helloworld - Custom Example for Servlet, JSP, Java Bean

You have 2 options: (Of course, you can do both!)
Option #1 - create an Eclipse project from a .war file.
Option #2 - create an Eclipse project from scratch.

Option #1 - Create an Eclipse Project from a .war file in a Tomcat web container.

mytomcat-eclipse-helloworld.zip- download this zip file (if you've downloaded the Tutorial files you'll find it in the directory:
Filepath: eclipse\tutorial_tomcat_eclipse\webapps.
Extract the one file from the .zip file.
Filename: mytomcat-eclipse-helloworld.war
Copy the .war file to the Tomcat Directory
Ex: C:\Tomcat\Tomcat6.0\webapps
Start Tomcat if it is not running.
Tomcat should extract the .war file and create all the necessary directories and files from the .war file.
Test the web app:
http://localhost:8080/mytomcat-eclipse-helloworld
- Test the 3 links on the page and notice the words: Hello World
Eclipse - Create a Java Project
- Launch Eclipse
- File, New, Project, Java Project, Next
- Project Name: mytomcat-eclipse-helloworld
- UnCheck - Use default location.
- Click "Browse" and locate the directory in the Tomcat WebApp directory. Click "OK"
  Ex Directory:
  C:\Tomcat\Tomcat6.0\webapps\mytomcat-eclipse-helloworld
- Click "Next"
- On the "Java Settings" screen check the "Default output folder": mytomcat-eclipse-helloworld/WEB-INF/classes
- Click "Finish"
Eclipse - Build Path - add the Tomcat lib jars files.
- Right click on the project.
- Click "Build Path", "Configure Build Path", then click the tab "Libraries"
- Check to make sure that the "JRE System Library" is listed.
  If not, click "Add Library", "JRE System Library", "Next", "Finish".
  Notes:
  Under the tab "Order and Export" this lib file should be directly under the WEB-INF/src directory.
  You can't compile .java files without this library!!!
- Click "Add External JARs"
- Browse to the Tomcat common library directory.
  Ex: C:\Tomcat\Tomcat6.0\lib
- Select all of the JAR files (Ctrl-A), then click "Open".
- Remove any of the .JAR files that are listed with an X (missing). While you do that make sure that those files were imported in with the step you just completed.
  The default was to look for them in the "C:\Program Files\ ...." directory.
- Click "OK" to leave the "Java Build Path" screen.
- There should be no errors with the App at this point.
Using Eclipse, modify the following files then Reload the web app or Stop/Start Tomcat.
- filename: WEB-INF\src\myeclipse\MyHelloWorldBean.java
 from:
 setStrMyMessage("Hello World");
 to:
 setStrMyMessage("Hello World - Hi");
- filename: WEB-INF/src/myeclipse/MyHelloWorldServlet.java
 from:
 Hello World
 to:
 Hello World - Hi
- filename: pages/myhelloworld_jstl.jsp
 from:
 <c:out value="Hello World"/>
 to:
 <c:out value="Hello World - Hi"/>
Reload Web App or Stop/Start Tomcat Service (because you changed a .java file!) - see steps above!
Test the web app:
http://localhost:8080/mytomcat-eclipse-helloworld
- Test the 3 links on the page and notice the words: Hello World - Hi
Your finished with Option #1.

Option #2 - Create an Eclipse Project from scratch in a Tomcat web container.

To give you the big picture, in the steps below, you will use Eclipse to create the following directory structure and files.
This examples Tomcat "webapps" directory is located at:
C:\Tomcat\Tomcat6.0\webapps

Directory Structure under: mytomcat-eclipse-helloworld-scratch

List of Directories:

\WEB-INF
\WEB-INF\lib
\WEB-INF\src
\WEB-INF\src\java
\WEB-INF\src\myeclipse
\WEB-INF\classes
\pages

List of files:

\index.jsp
\pages
\pages\myhelloworld_bean.jsp
\pages\myhelloworld_jstl.jsp
\WEB-INF\web.xml
\WEB-INF\lib\jstl.jar - copy this file.
\WEB-INF\lib\standard.jar - copy this file.
\WEB-INF\src\myeclipse\MyHelloWorldBean.java
\WEB-INF\src\myeclipse\MyHelloWorldServlet.java

Eclipse - Create a Java Project
- Launch Eclipse
- File, New, Project, Java Project, Next
- Project Name: mytomcat-eclipse-helloworld-scratch
- UnCheck - Use default location.
- Click "Browse" and navigate to the Tomcat webapps" directory (ex: C:\Tomcat\Tomcat6.0\webapps).
- This is a little tricky so follow closely. We want to create a new directory.
  - Note: The "webapps" directory should be selected.
  - Click "Make New Folder"
  - In the browse window list, you should be able replace the words "New Folder" with: mytomcat-eclipse-helloworld-scratch
    Note: If you can't, in the browse window scroll to the "New Folder" and right click, choose "Rename" and change the folder name to mytomcat-eclipse-helloworld-scratch
  - Click "OK".
  - Check the value of "Location:" to make sure you have selected the correct folder.
    Location should now show: C:\Tomcat\Tomcat6.0\webapps\mytomcat-eclipse-helloworld-scratch
  - Click "Next" to go to the "Java Settings" screen.
- Source Folder
  - Click "Create new source folder".
    Folder name: WEB-INF/src
    Click "Finish"
  - Right click on "src" and choose "Remove from Build Path". Later you will delete the folder.
    (Note: We just created the src file in a directory that web users can't directly get to: WEB-INF/src)
- Output Folder
  - Change the "Default output folder" to: mytomcat-eclipse-helloworld-scratch/WEB-INF/classes
    (Note: Currently the default will be: mytomcat-eclipse-helloworld-scratch/bin)
- Click "Finish"
- In the "Package Explorer" right click on "src" and choose delete.
Eclipse - Build Path - add the Tomcat lib jars files.
- Right click on the project.
- Click "Build Path", "Configure Build Path", then click the tab "Libraries"
- Check to see if "JRE System Library" is listed. If not complete the next steps in this bullet.
  Click "Add Library", "JRE System Library", "Next", "Finish".
  Note: Under the tab "Order and Export" this lib file should be directly under the WEB-INF/src directory.
  You can't compile .java files without this library!!!
- Click "Add External JARs"
- Browse to the Tomcat common library directory.
  Ex: C:\Tomcat\Tomcat6.0\lib
- Select all of the JAR files (Ctrl-A), then click "Open".
- Click "OK" to leave the "Java Build Path" screen.
Create the "WEB-INF\lib" Folder
- Right click on "WEB-INF", "New", "Folder".
- Folder name: lib
- Click "Finish"
- Library files - for this project we will be using 2 .jar files: standard.jar & jstl.jar.
  These 2 jar files need to reside in: webapps\mytomcat-eclipse-helloworld\WEB-INF\lib
  - mytomcat-eclipse-helloworld-scratch-lib.zip - download and extract this zip file into the new "lib" directory you just created.
    Note: If you downloaded the files in this tutorial you will have this file in the directory:
    Pathname: tomcat\tutorial_tomcat_eclipse\webapps\mytomcat-eclipse-helloworld-scratch-lib.zip
    (Note: These lib files came from the Apache JSTL project called "standard".)
  - If you don't place the files properly in the lib directory you will get compile errors etc...
Create the "WEB-INF\src\myeclipse" Package
- Right click on "WEB-INF/src" (not "WEB-INF"), "New", "Package". Folder name: myeclipse
- Click "Finish"
Create the "pages" Folder
- Right click on "mytomcat-eclipse-helloworld-scratch", "New", "Folder". Folder name: pages
- Click "Finish"
Create the "WEB-INF\web.xml" file.
- Right click on "WEB-INF" (not "WEB-INF/src"), "New", "File". File name: web.xml
- web.xml - copy this content into the file. Right click on the filename, open with, Text Editor. If you open with the XML editor you can't copy and paste. After you copy-n-paste, then open with "XML Editor".
- Notice the 2 tags: <servlet> & <servlet-mapping>. This is planning for the .java servlet file we will create.
Create the "index.jsp" file
- Right click on "mytomcat-eclipse-helloworld-scratch", "New", "File". File name: index.jsp
- index.jsp - copy this content into the file. (Warning: If the server & browser doesn't show this file as a Text file then do a view source so you can copy-n-paste.)
- Note:
  - This JSP has just HTML tags.
  - From this page you will launch the 3 examples.
- Optional: Test what you have so far.
  - Start Tomcat and/or Reload this WebApp
  - Go to: http://localhost:8080/mytomcat-eclipse-helloworld-scratch
    You should see a title and 3 web links.
Create the "MyHelloWorldBean.java" Java source file.
- Right click on "myeclipse" under the directory "WEB-INF/src", "New", "Class".
  Name: MyHelloWorldBean
  Click "Finish"
- MyHelloWorldBean.java - copy this content into the file. (Warning: If the server & browser doesn't show this file as a Text file then do a view source so you can copy-n-paste.)
Create the "MyHelloWorldServlet.java" Java source file.
- Right click on "myeclipse" under the directory "WEB-INF/src", "New", "Class".
  Name: MyHelloWorldServlet
  Click "Finish"
- MyHelloWorldServlet.java - copy this content into the file. (Warning: If the server & browser doesn't show this file as a Text file then do a view source so you can copy-n-paste.)
Create the "myhelloworld_jstl.jsp" JSP file.
- Right click on "pages", "New", "File".
  File Name: myhelloworld_jstl.jsp
  Click "Finish"
- myhelloworld_jstl.jsp - copy this content into the file. (Warning: If the server & browser doesn't show this file as a Text file then do a view source so you can copy-n-paste.)
Create the "myhelloworld_bean.jsp" JSP file.
- Right click on "pages", "New", "File".
  File Name: myhelloworld_bean.jsp
  Click "Finish"
- myhelloworld_bean.jsp - copy this content into the file. (Warning: If the server & browser doesn't show this file as a Text file then do a view source so you can copy-n-paste.)
Reload the webapp or Stop/Start Tomcat.
Test your Web App
- Start Tomcat and/or Reload this WebApp
- Go to: http://localhost:8080/mytomcat-eclipse-helloworld-scratch
  You should see a title and 3 web links.
- Click on each link!
Using Eclipse, modify the following files then Reload the web app or Stop/Start Tomcat.
- filename: index.jsp
 For the title & h1 tags change the following:
 from:
 mytomcat-eclipse-helloworld
 to:
 mytomcat-eclipse-helloworld-scratch
- filename: WEB-INF\src\myeclipse\MyHelloWorldBean.java
 from:
 setStrMyMessage("Hello World");
 to:
 setStrMyMessage("Hello World - Hi");
- filename: WEB-INF/src/myeclipse/MyHelloWorldServlet.java
 from:
 Hello World
 to:
 Hello World - Hi
- filename: pages/myhelloworld_jstl.jsp
 from:
 <c:out value="Hello World"/>
 to:
 <c:out value="Hello World - Hi"/>
Reload Web App or Stop/Start Tomcat Service (because you changed a .java file!) - see steps above!
Test the web app:
http://localhost:8080/mytomcat-eclipse-helloworld-scratch
- Test the 3 links on the page and notice the words: Hello World - Hi
Your finished with Option #2
Have another cup of Java!