Eclipse & Tomcat - Create a Webapp

(Free Web Tutorial)

by Michael Thomas

Tomcat Home Page

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 3.1.1 (as of 05/14/08), Apache Tomcat 6.0.16 (as of 05/25/08)

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: 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.

• myeclipse-helloworld-war.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: myeclipse-helloworld.war
• Copy the .war file to the Tomcat Directory
  Ex: C:\Program Files\Apache Software Foundation\Tomcat 6.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
  • Contents: "Create project from existing source".
  • Click "Next"
  • Click "Browse" and locate the directory in the Tomcat WebApp directory.  Click "OK"
    Ex Directory:
    C:\Program Files\Apache Software Foundation\Tomcat 6.0\webapps\mytomcat-eclipse-helloworld
  • Click "Next"
  • On the "Java Settings" screen check the "Default output folder": mytomcat-eclipse-helloworld/WEB-INF/classes
  • If you see the prompt "The output folder has changed ...." click "Yes"
  • Click "Finish"
• Eclipse - Build Path - add the Struts/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:\Program Files\Apache Software Foundation\Tomcat 6.0\lib
  • Select all of the JAR files, then click "Open".
  • Click "OK" to leave the "Java Build Path" screen.
• 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:
    <p>Hello World</p>
    to:
    <p>Hello World - Hi</p>
  • filename: pages/myhelloworld_jstl.jsp
    from:
    <h1 align="center">Hello World (JSTL Example)</h1>
    to:
    <h1 align="center">Hello World - Hi (JSTL Example)</h1>
• 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:\Program Files\Apache Software Foundation\Tomcat 6.0\webapps
   

  Directory Structure under: mytomcat-eclipse-helloworld 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
  • Contents: "Create project from existing source".
  • Click "Browse" and locate the directory in the Tomcat webapps" directory.  Click on the directory named "webapps"
    Ex Directory:
    C:\Program Files\Apache Software Foundation\Tomcat 6.0\webapps\
  • You should see the following:  Folder: webapps
  • This is a little tricky so follow closely.  We want to create a new directory.
    • Click "Make New Folder"
    • In the browse window list, you should be able to type: 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 to make sure you have selected the correct folder.  Click "Browse".
      Check the following, folder: mytomcat-eclipse-helloworld-scratch
    • Click "OK"
  • Click "Next" to go to the "Java Settings" screen.
  • Click the link "Create a new source folder"
  • Folder name: WEB-INF/src
  • Click Next, then click Finish
  • Change the "Default output folder" to: mytomcat-eclipse-helloworld-scratch/WEB-INF/classes
  • If you see the prompt "The output folder has changed ...." click "Yes"
  • Click "Finish"
• Eclipse - Build Path - add the Struts/Tomcat lib jars files.
  • Right click on the project.
  • Click "Build Path", "Configure Build Path", then click the tab "Libraries"
  • 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:\Program Files\Apache Software Foundation\Tomcat 6.0\lib
  • Select all of the JAR files and 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:
    <p>Hello World</p>
    to:
    <p>Hello World - Hi</p>
  • filename: pages/myhelloworld_jstl.jsp
    from:
    <h1 align="center">Hello World (JSTL Example)</h1>
    to:
    <h1 align="center">Hello World - Hi (JSTL Example)</h1>
• 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 #2
  Have another cup of Java!