Eclipse Web Tools Platform Uncovered

The breadth and width of applications on the Internet have reached a level that was never seen before. Every few months we hear about a new application, a technology or a new startup company that opens fantastic new opportunities for exploration in new Internet territory. Mobile devices, iPods, computers and laptops are converging to offer platforms that can access the Internet and run these new applications everywhere. And, to fuel their creation and deployment, the Open Source movement has created an unprecedented array of high quality, freely available middleware and tools. The Eclipse project, and the Web Tools Platform (WTP) as the name implies was started a mere 5 years ago to extend Eclipse into the domain of Web applications. Since then it became arguably the most popular Eclipse project providing a very rich set of tools for Web application developers and a set of platform application programming interfaces (API) for tool vendors.

This article is the first in a series of articles introducing WTP. In this first article we will introduce WTP and cover the underlying concepts and Java Web Application Development tools. The series is organized into the following topics:

Part II – WTP Uncovered: JavaServer Faces (JSF)

Part III – WTP Uncovered: EJBsand Java Persistence Architecture (JPA)

Part IV – WTP Uncovered: XMLand XSL Tools

Part V – WTP Uncovered: WebServices

Part VI – WTP Uncovered:Building your own tools

The History

Eclipse users were building Web applications long before the WTP project. Of course eclipse did not support them very well, launching web servers, source editors for Web pages were among the top feature requests [1]. There were other eclipse based solutions such asthe open source Lomboz project, and the Eclipse-based WebSphere StudioApplication Developer product from IBM. WTP project in many ways served as afirst experience for Eclipse to launch new platforms, and starting from agenuine need create a new communities and common platform. WTP is an example ofhow open source process can lead to a wonderful outcome. Compared to VisualStudio, Java Web development was very fragmented, and these initial beginnings ledto a few informal meetings at very first EclipseCON in 2004. We (the committersof the very popular open source Lomboz project) met with the IBM team that werebuilding WSAD, and other groups who had various interest in making this projecta reality. WTP which formally began in spring 2003 as a proposal to Eclipse.orggathered a community. There were contributions of a core set of plug-ins fromWebSphere Studio Application Developer and Lomboz projects. WTP has irreversibly changed the fragmentedWeb application development and tools space. Especially with WTP support forJava Web application development, eclipse achieved a good level of maturity andsuccess for Web development. Today WTPis the reason that many major Java EE application server vendors adopt Eclipseas its primary IDE platform.

ProjectScope

As the name implies, the scope of WTP is Web application development. However, Web application development is too broadsince there are many competing development technologies, including major platforms;Java EE, .NET, and Linux-Apache-MySQL-Perl/PHP/Python (LAMP). The scope of WTPis is inclusive but the tools limited to fundamental Web standards and JavaEE-based Web application development. This scope includes the common underlyingstandard Web technologies such as HTML, XML, and Web services. WTP has a richset of tools and APIs, and not suprisingly it is very large. The projectcharter is inclusive of a wide array of standard and de-jure Web technologies (see Figure 1).

                                                          Figure 1

WTP initially started with two subprojects: Web and Java Standard Tools. These were later refactored into architecturally significant, smaller and more focused components (see Table 1).We also needed a place for new technologies to grow; the WTP incubator was created to provide room for experimentation and to make it easier to start working on new tools and technologies with the least amount of buerocracy.

Table 1: WTP Projects

Developing Web Applications with WTP

To develop Java Web applications you will need to extend Eclipse in at least two dimensions: Be able to create and edit development artifacts such as xml, html, servlets and jsps, and run or debug these artifacts using server runtime environments. The simplest server runtime environment is a Web servers, and on the Java EE side, the application servers with Web containers, such as Jetty and Apache Tomcat. More advanced servers have containers that support Enterprise JavaBeans (EJB), Web Services and more.

WTP seamlessly extends eclipse to provide the capabilities needed by Web developers. Source editing functions such as code completion, syntax coloring, refactoring, error highlighting, and quick fixes all have direct analogs for Web artifacts. In the following section we will show how to create and execute a basic Java Web application that produces WTP news using an RSS feed. RSS is a standardized [3] XML format used to publish things such as blog entries, news headlines, audio, and video. Later we will enhance this application with JSF, persistence and service components. Let us start with the following:

1. Prepare the development environment
2. Add a Server Runtime.
3. Create a Dynamic (Java) Web Application Project.
4. Create and Edit a simple XSD for rss news feeds.
5. Map the XSD to Java using JAXB.
6. Use a JSP to provide the news using rss feed.
7. Run the JSP

Development Environment

To follow this article you will need to setup a development environment that contains an eclipse with WTP, an application such as Apache Tomcat, and full Java version 6+ JDK. We need a recent JDK because we will use some features such as Java XML Binding (JAXB), that is included with this version. The easiest way to obtain WTP is to get a “EclipseIDE for Java EE Developers” from the eclipse downloads area [2]. You can obtain Apache Tomcat from http://tomcat.apache.org or WTP can assist you with the download and installation when you add the server runtime environment. We have used the eclipse ganymede SR1 release, Apache Tomcat v6.0.18, and Sun JDK v1.6.0.07. You should be able to complete your installation very easily by unzipping the archives to a suitable location on your disk.

Adding a server runtime environment:

After launching Eclipse, you can invoke the command Window Preference from the menu bar to open the Preference dialog. Expand the Server preferences category and select the Installed Runtimes page (see Figure 2). Initially there are will be no server runtime environment definitions. You can click the Add.. button to add a new server runtime. There are server runtime definitions provided with WTP as well as others that can be downloaded from the server vendors.

Figure 2: Server Runtime Environment

Creating a Dynamic Web Project

An Eclipse workspace contains a set of projects, typically projects that are related to each other in the sameworkspace. Each project has a set of builders that give the project its intelligence and know how to process the artifacts in a project. WTP adds Dynamic Web Projects which provides builders for Java Web applications. For example, it knows how to package the artifacts in Java EE Web modules so that they can be deployed to application servers. You can create a new Dynamic Webproject by invoking the File New Project menu command to open the New Project wizard and selecting the Dynamic Web Project as the project type (see Figure 3). This wizard presents the parameters you can change to create a project. Obviosly a project name is needed, as well as the server runtime to use for the project. In this case Apache Tomcat must be selected as the Target Runtime. The Configurations field lets you select a predefined configuration of project facets. Once the project is created you will have a workspace that looks like the project in Figure 3. We are ready to build and run our application.

                                        Figure 3: Creating a Dynamic Web Project

Creating a simple XSD for RSS

XML Schema Description (XSD) is the W3CRecommendation for describing the format or schema of XML documents, and is the preferred schema description language for use with Web services. WTP has a powerful XSD editor that includes both a source and a graphical view as well as an outline view and property sheets that greatly simplify the editing task. We will design a simple XSD for RSS to create and publish new items. Our simplified news feed will look like the following XML:

xml version="1.0"encoding="UTF-8"?>


Eclipse Web Tools Platform Project: Newstitle>
http://www.eclipse.org/webtools/
link>
This RSS feed contains the latest news from the
Eclipse Web Tools Platform(WTP) project. The Eclipse WTP project
contains Web tools andframeworks for the Eclipse platform.
description>

WTP 3.1 M4 Declared!title>
http://www.eclipse.org/webtools/development/news/3.1M4/link>
The fourth development milestone for WTP 3.1 has been
declared. Check out what's New andNoteworthy and download it now!
description>
item>

WTP 3.0.3 Released!title>
http://www.eclipse.org/webtools/releases/3.0.3/link>
WTP 3.0.3 is now available. Release 3.0.3 is a
scheduled maintenance release to fixserious defects present in the
prior 3.0 releases, as well as to improveon their stability and
performance. Roughly 170 fixes have beenadded since the 3.0.2
release. The next scheduled maintenancerelease, 3.0.4, will be
available in February as part of GanymedeSR2.description>
item>
channel>
rss>

Now, you can create a new XML Schema file named rss.xsd. In general, there are many equivalent ways to describe a given format using XSD. It’s a good practice to describe formats in a way that works well with XML data binding toolkits such as JAXB. After you open the file withthe XSD editor you can define complex types for the RSS content model of each element. The XSD editor lets you edit in the source tab, the graphical tab, the outline view, and the property view (see figure 4).

xml version="1.0" encoding="UTF-8"?>

elementFormDefault="unqualified" version="2.0.2.16">


maxOccurs="unbounded"/>
xs:sequence>

xs:complexType>


maxOccurs="unbounded"/>
xs:sequence>
xs:complexType>



xs:sequence>
xs:complexType>

xs:schema>

                                                  Fig. 4: XSD Editor

JAXB Mapping

The Java Architecture for XML Binding (JAXB) [4] allows us to map XML to Java classes. The binding compiler, xjc, is used to generate Java classes from an XML Schema. To run xjc with our schema, we will use the following ant script:

basedir="." default="build">
name="build">
executable="${java.home}/../bin/xjc">
value="simple-rss.xsd" />
value="-p" />
value="org.eclipse.wtp.news.rss" />
value="-d" />
value="${basedir}/src" />


The Java classes generated with JAXB can be used to marshall and unmarshall the XML document. JAXB creates these classes and annotates them for XML mappings.

@XmlAccessorType(XmlAccessType.FIELD)
@XmlType(name = "RssItem", propOrder = {
"title",
"link",
"description"
})
public class RssItem {
@XmlElement(required = true)
protected String title;
@XmlElement(required = true)
@XmlSchemaType(name = "anyURI")
protected String link;
@XmlElement(required = true)
protected String description;


Create and Edit a JSP

The WebContent folder in our project is the root of the Web application and is where the normal Web content, such as HTML, pages, JSPs, and images, go . Now, we will add a JSP file named rss.jsp to the project to produce the news feed. Use the File New JSP command to open the New JavaServer Page wizard. Give the new file the name rss.jsp. The wizard lets you pick a template for the new JSP. Select any template for JSP with HTML markup, and click the Finish button. The wizard creates the JSP file with the content filled in from the template and opens it in the JSP editor. The JSP editor provides full content assist on HTML tags, JSP tags, and Java code scriptlets. Replace this content with the following:

<%@ pagelanguage="java" contentType="text/xml; charset=UTF-8"pageEncoding="UTF-8"%><%@pageimport="org.eclipse.wtp.news.rss.Rss"%><%@pageimport="org.eclipse.wtp.news.NewsService"%><%
Rss rss = NewsService.getRssNewsFeed();
NewsService.printRss(out, rss);
%>

The NewsService is a Java utility class that is used to create the Rss object and marshallit to the output stream. The getRssNewsFeed method reads the Rss from a sample XML file. The printRss method writes the Rss object to the output stream as an XML document. At this point, this may look like a redundant operation: Why not just access the XML document directly? This is just a quick way to test our JSP. Later we will build a Web interface to enter news items and read the Rss feed from a database.

public class NewsService {
public static Rss getRssNewsFeed() throws JAXBException {
JAXBContext context = JAXBContext.newInstance("org.eclipse.wtp.news.rss");
Unmarshaller unmarshaller =context.createUnmarshaller();
JAXBElement rssElement = (JAXBElement)unmarshaller
.unmarshal(Rss.class.getResourceAsStream("/simple-rss.xml"));
return rssElement.getValue();
}
public static void printRss(Writer out, Rss rss) throws JAXBException {
JAXBContext context = JAXBContext.newInstance("org.eclipse.wtp.news.rss");
ObjectFactory factory = new ObjectFactory();
Marshaller marshaller =context.createMarshaller();
marshaller.setProperty(Marshaller.JAXB_FORMATTED_OUTPUT, true);
marshaller.marshal(factory.createRss(rss),out);
}
}

Run the JSP on the Server

WTP extends the Run As command to Webartifacts such as HTML and JSP files. Simply select the file and invoke the RunAs > Run on Server command from the context menu. The user interface of a Web application is hosted in a Web browser. To run our JSP file select rss.jspand invoke the Run As > Run on Server command from the context menu. Since this is the first time you have tried to run any artifact from the Dynamic Web Project, WTP will prompt you to define a new server and default to the server runtime environment for Apache Tomcat, which was previously associated with the project. It will also ask us to add the project to the server’s configuration (see Figure 5). In WTP a server consists of both a server runtime environment and configuration information such as the port numbers to use and the set of projects to deploy or publish on it. A project may be deployed on several servers, which is handy when you are testing a Web application for portabilityto different vendors.

                                                       Fig. 5: Run on Server

When you click the Finish button to confirm that you want WTP to add the module to the server configuration. WTP then starts the server and opens a Web browser with the Uniform Resource Locator (URL) of the JSP file (see figure 6).

                                             Fig. 6: WTP News Feed

Conclusion

This completes the first section of WTP Uncovered series. In the upcoming  articles we will discover more of WTP. We will show how you can use JSF tools to build Web user interfaces, use the Dali JPA tooling to add persistence to applications and use Web Services to build universally accesible services.