Introduction

IBM's WebSphere® Studio Application Developer is an integrated development environment (IDE) for J2EE application developers. It provides all the tools necessary to create, develop, test, and manage all of the artifacts involved with building complete Web, EJB, and EAR applications. Different, customizable perspectives (which are views of the development artifacts and an organization of the desktop) allow Web developers, Java^TM programmers, EJB developers, and administrators to share the same development tool.

At the heart of Application Developer are creation tools, editors, and wizards that allow for rapid development of all of the J2EE artifacts (HTML files, JSP^TM pages, Java classes and servlets, EJB beans, XML deployment descriptors). These artifacts are organized into projects that correspond to modules defined in the J2EE specification. Once the artifacts have been created, they can easily be tested and debugged within the IDE, or exported and tested on a remote server.

This article will discuss the creation and testing of a simple Web application using the WebSphere Studio Application Developer beta version. We will build a Web application that converts temperatures from Fahrenheit to Celsius. After we create a small Java bean to handle the logic of the temperature conversion, I will show you how to use the JavaBean^TM Web Pages wizard to automatically generate the rest of the Web application. The Web application will consist of an HTML page, JSP page, and servlet.

Please note that the steps described here apply only to the beta version of Application Developer. For steps covering a later version of Application Developer, see Developing Java Programs Using WebSphere Studio Application Developer: A Comparison with VisualAge for Java. For information on EJB development using WebSphere Studio Application Developer or other topics not covered in this article, please read related articles in the IBM WebSphere Developer Technical Journal, or view the online help.

Back to top

Creating a Web project

The first thing we need to do is create a Web project. A Web project is a special type of project that knows how to handle Web resources like servlets, HTML, and JSP files. It also provides validation on these resources and an editor for the web.xml deployment descriptor.

1. Choose File => New => Other to bring up the list of Wizards.
2. Choose Web => Web Project. Click Next.
3. Enter MyWeb in the Name field.
4. Click Finish. A Web project is created in the workspace.

Take a moment to look at the directory structure of the newly created MyWeb project. The two root folders of the project are source and webApplication. The webApplication folder directly corresponds to an unzipped WAR module. In other words, this folder is the actual Web module that you are creating. Inside it, you will find the usual files and folders that exist in a Web module: WEB-INF, WEB-INF/web.xml, etc.

The source folder is used for creating the Java classes that will be contained in your module. Any Java source files that you create in this folder will be automatically compiled into the webApplication/WEB-INF/classes folder.

You will notice a second project in the workbench. By default, this project will be named DefaultEAR. In the J2EE specification, EAR modules are super-containers used to group Web and EJB modules for deployment to a server. This EAR project is automatically generated to make it easy to deploy this Web application to WebSphere Application Server at a later time.

Back to top

Creating a Java bean for temperature conversion

The heart of our Web application will be a Java bean that converts from Fahrenheit to Celsius. Follow the steps below to create the Java bean class.

1. Select the MyWeb project.
2. Choose File => New => Other to bring up the list of Wizards.
3. Choose Java => Java Class. Click Next.
4. In the Package field, type com.test.
5. In the Name field, type TemperatureBean. Click Finish.
6. When the TemperatureBean.java editor appears, add the following code within the enclosing brackets.

   // the temperature in Celsius protected float temp; public void setTemperature(float t) { temp = t; } public float getTemperature() { return temp; } public void convertToCelsius() { temp = (temp - 32.0f) * 5.0f / 9.0f; }

   
   
7. The code should now look as shown in Figure 2 below.
   Figure 2. Source of TemperatureBean.java
   
   
8. Save the file and close the editor. The next step will be to use a wizard to quickly generate an HTML page, servlet, and JSP page from this Java bean.

Back to top

Creating Web resources

Now that the Java bean has been created to handle the temperature conversion, we need a Web application UI to let the user enter a value, and display the result. Luckily, WebSphere Studio contains a JavaBean Web Pages wizard that can automatically generate the remaining code. The generated code will include an HTML file, a servlet, and a JSP page, all of which are structured to use the JavaServer Pages^TM Model 2 architecture (also known as Model-View-Controller).

1. Choose File => New => Other to bring up the list of Wizards.
2. Choose Web => Java Bean Web Pages. Click Next.
3. Use the Browse button to select /MyWeb/webApplication in the Destination folder field.
4. Enter Temperature in the Web page prefix field.
5. Under Java package, click Browse.
6. Select com.sample, and click OK.
   
   The wizard page should now look like Figure 3 below. Click Next.
   Figure 3. First Wizard page
   
   
7. Under the Bean field, click Browse .
8. Select TemperatureBean from the list, and click OK .
9. Check convertToCelsius() from the list.
   
   The wizard page should now look like Figure 4 below. Click Next .
   Figure 4. Second Wizard page
   
   
10. In the table at the bottom left of the wizard, select the Page tab.
11. Edit the Page Title field, and type Temperature Conversion .
12. Check the temperature field from the list at the top left of the page. In the table below it, change the Label field to Fahrenheit .
    
    The wizard page should now look like Figure 5 below. Click Next .
    Figure 5. Third Wizard page
    
    
13. Make sure that the temperature field is checked in the list at the top left. In the table below, change the Label field to Celsius .
14. In the table at the bottom left of the wizard, select the Page tab.
15. Edit the Page Title field, and type Converted Temperature .
    
    The wizard page should look like Figure 6 below. Click Finish .
    Figure 6. Fourth Wizard page
    
    

The workbench should now look as shown in Figure 7 below. Notice the newly generated TemperatureServletResults.java, TemperatureInputForm.html, and TemperatureResults.jsp. Although TemperatureBean.java and temperatureServletResults.java have been compiled into the webApplication/WEB-INF/classes folder, by default they are not visible because the navigator filters out .class files. (To turn this off, choose Filters from the drop-down menu in the Navigator's toolbar.)

Back to top

Testing the Web application

WebSphere Studio Application Developer contains support for multiple application servers, *. However, one of the best features is that as a novice user, you don't have to worry about any of these other features. To run your project, all you have to do is select a resource and ask to run it on a server.

1. Select the temperatureInputForm.html file in the MyWeb/webApplication folder. Right-click, and select Run on Server.
2. A new WebSphere unit test server will be created automatically. The server will be started, and when it is ready, the Web browser will open with the correct URL for the HTML file. The Web browser should appear as shown in Figure 8 below.
   Figure 8. Temperature Input page
   
   
3. Enter 77 in the Fahrenheit field. Click the Submit link.
   
   The JSP page will now be compiled and run. This may take a few seconds. When it is finished, the next page should appear with the temperature converted to Celsius, as shown in Figure 9 below.
   Figure 9. Converted temperature
   
   

You have now built and tested a Web module, complete with an HTML file, servlet, and JSP page.

Back to top

What else can I do?

Now that you have built a complete Web application, there are a number of options for what you can do next. These include:

• Export a WAR file - If you want to export your code, you can choose to export it as a WAR file, or within an enclosing EAR. Both options are available via File => Export, and will let you move to another workbench, deploy to WebSphere Application Server, or deploy to another J2EE server.
• Deploy to a remote WebSphere Application Server - When your code is working in the unit test environment, you can deploy and run on a remote copy of WebSphere Application Server. This support let you publish to a remote server, as well as start and stop the server remotely.
• Test on Jakarta Tomcat - To test your code in Tomcat, all you have to do is download and unzip a copy of Tomcat. The beta supports Tomcat Version 3.2 and Version 4.0 beta 5.

For more information on these features, please see the online help. For information on exporting a WAR file and deploying to a remote WebSphere Application Server, specifically check out the help files, "Exporting Web Archive (WAR) files" and "Support for remote WebSphere Application Server." For information on testing on Jakarta Tomcat, refer to the Server Tools help documentation. I will also be covering these various aspects in my future Application Developer articles.

Back to top

Conclusion

We have easily created from scratch a Web application consisting of an HTML page, servlet, and JSP page using the tools provided with WebSphere Studio Application Developer. You can see that by using the JavaBean Web Pages wizard, we were able to rapidly generate a servlet, HTML file, and JSP page that follow the JavaServer Pages Model 2 architecture.

Top of page

About the author

Tim deBoer is a software developer on the IBM WebSphere Studio Application Developer, Server Tools team at the IBM Toronto Lab. With his teammates, he is currently responsible for the entire Server Tools run time integration and unit test environment demonstrated throughout this article. He previously worked with the VisualAge© for Java Technical Support group, providing support to enterprise developers working with VisualAge for Java. He is also a VisualAge for Java Certified Solution Developer.

Comments (Undergoing maintenance)

Back to top

Trademarks  |  My developerWorks terms and conditions

Table of contents

• Introduction
• Creating a Web project
• Creating a Java bean for temperature conversion
• Creating Web resources
• Testing the Web application
• What else can I do?
• Conclusion
• About the author
• Comments

Next steps from IBM

Spring, JRuby, and Ajax development is easier with WebSphere Application Server - a smart Java 5 and J2EE Web services-based application server.

---

• Try: The no-charge WebSphere Application Server Community Edition is a pre-integrated, lightweight Java 5 application server built on Apache Tomcat and other best-of-breed open source software such as OpenEJB, Apache Axis, and Apache Derby.
• Article: The article leverage the Spring Framework and the WebSphere Application Server to improve your J2EE project productivity.
• Tutorial: See how the free WebSphere Application Server and XML can improve the efficiency of your JRuby on Rails and Ajax development.
• Buy: WebSphere Application Server - Express

My developerWorks community

Dig deeper into WebSphere on developerWorks

DB2 pureScale

See how true transparent scaling architecture can be achieved on distributed platforms

Special offers