IBM WebSphere Developer Technical Journal: Application modeling with WebSphere Studio V5.1

An application model is analogous to a construction project blueprint, and is an important ingredient in application development. This article shows the steps for developing a Java application based on a Rational Rose class diagram using the Eclipse Modeling Framework, and also shows how to develop the same Java application using the Universal Modeling Language visualization tool.

Helen Wong (helenhyw@ca.ibm.com), Software Developer, IBM

Helen Wong is a software developer on the C, C++ and FORTRAN Compiler Service and Support team at the IBM Toronto Lab.



Jeffrey Liu (jeffliu@ca.ibm.com), Software Developer, IBM

Jeffrey Liu is a software developer on the Rational Studio Web Services Tools Team at the IBM Toronto Lab. You can reach Jeffrey at: jeffliu@ca.ibm.com.



13 February 2004

Introduction

An application model is analogous to a construction project blueprint. For those who appreciate the idea of modeling, a model helps manage complexity and promotes efficient application development. For those who do not, modeling is mostly for the sake of documentation and does not substantially contribute to the development of an application. In fact, modeling can be an extremely important ingredient in application development.

In addition to managing complexity, a model can also encourage correctness and completeness, ensure requirements are met, improve quality, and even help in reducing potential maintenance costs of the developed application. Given the right tools, modeling can be easy, inspiring, and can serve as an excellent starting point to application implementation.

The Eclipse open source project includes a component called the Eclipse Modeling Framework (EMF) that allows users to define models and generate a Java-based skeleton implementation. Moreover, IBM® Rational® software initiatives also support open standards in the area of model driven development. The introduction of the Universal Modeling Language (UML) visualization tool in WebSphere® Studio V5.1 follows this initiative. This acticle will show the steps for developing a Java™ application based on a Rational Rose® class diagram using EMF, and will also show you how to develop the same Java application using the UML visualization tool.

The instructions in the tutorial use WebSphere Studio Application Developer Version 5.1 (hereafter called Application Developer).


Using the Eclipse modeling framework

The Eclipse Modeling Framework is a tool for building Java applications from a structured model, and uses XML Metadata Interchange (XMI) as its model definition. The XMI model can be fed into the EMF code generator to easily generate customizable Java code. Moreover, subsequent regenerations will preserve code that has been customized since the last run. The following steps show how to import a Rational Rose class diagram into an EMF project, producing an XMI model that can be used to generate the corresponding Java implementation.

  1. From the Download section, download the Rational Rose class diagram (Figure 1), included in the bank.zip file, to your file system.
    Figure 1. bank.mdl
    Figure 1. bank.mdl
  2. From Application Developer, select File => New => Other... => Eclipse Modeling Framework from the left pane, and EMF Project from the right. Click Next.
  3. The New Project wizard will display (Figure 2). For Project name, enter BankEMFProject , then select Next.
    Figure 2. New Project wizard
    Figure 2. EMF project wizard
  4. On the next dialog, select the Load from a Rose class model radio button, then Next.
  5. Click on the Browse... button and navigate to the location where you downloaded bank.mdl. Click Next.
  6. Select the bank package and click Finish. The corresponding XMI model for the Rose class diagram is generated in the EMF project.
  7. We will now generate the Java implementation from the XMI model. In the workbench window labeled "bank.genmodel", right-click on the Bank node, then select Generate Model Code (Figure 3).
    Figure 3. Generate model code from the XMI model
    Figure 3. Generate model code from the XMI model
    You have now successfully generated a Java implementation for the bank model. You will find the corresponding Java source files and their compiled classes in the BankEMFProject. Next, we will test this code using a set of JSPs.
  8. Create a Web project by selecting File => New => Other... => Web from the left pane, then Dynamic Web Project from the right. Click Next.
  9. On the New Web Project dialog (Figure 4), enter BankWebProject for Project name, select the Configure advanced options checkbox, then click Next.
    Figure 4. New Web Project dialog
    Figure 4. New Web Project wizard
  10. On the next dialog, enter BankEARProject for EAR project name, then click Finish.
  11. Next, we will export the Bank implementation as a JAR file (Figure 5). Right-click on BankEMFProject, then select Export... => JAR file and click Next.
  12. Browse to the directory where you want to save this JAR file, and name it bank.jar . Click Finish.
    Figure 5. JAR Export wizard
    Figure 5. JAR Export wizard
  13. We will now import bank.jar into the BankEARProject as a utility JAR. Right click on BankEARProject, select Import... => File system, and click Next.
  14. Browse to the directory where you saved bank.jar , select bank.jar and click Finish (Figure 6).
    Figure 6. Import file wizard
    Figure 6. Import file wizard
  15. Add bank.jar as a dependency of BankWebProject. In the WebSphere Studio workbench, navigate to the /BankWebProject/WebContent/META-INF folder and double click on MANIFEST.MF. This opens the JAR dependency editor.
  16. In the dependencies section of the JAR Dependencies editor (Figure 7), select bank.jar. Save and close the editor.
    Figure 7. JAR Dependencies editor
    Figure 7. JAR Dependencies editor
  17. Next, add the EMF JARs to your project's build path. Right click on BankWebProject and select Properties.
  18. In the Properties dialog, select Java Build Path, click on the Libraries tab and select the Add Variable... button.
  19. Select the EMF_COMMON and EMF_ECORE variables and select OK.
  20. Select OK again to close the Properties dialog.
  21. From the Download section, download and unzip jsp.zip to your file system.
  22. Import the JSP files into the BankWebProject. Right click on the /BankWebProject/WebContent folder and select Import... => File system, then Next.
  23. Browse to the directory where you unzipped jsp.zip and select the following files:
    • index.jsp
    • nav.jsp
    • content.jsp
    • result.jsp
    and click Finish.
  24. Right click on index.jsp, then select Run on Server....
  25. In the Server Selection dialog (Figure 8), select WebSphere version 5.0 => Test Environment and click Finish. This starts the WebSphere Test Environment and loads index.jsp in a Web browser.
    Figure 8. Run on server dialog
    Figure 8. Run on server dialog
  26. In the browser running the application, enter the data as shown in Figure 9, then select Go.
    Figure 9. Creating a new account
    Figure 9. Creating a new account
  27. Figure 10 shows the result of creating a new account with this application.
    Figure 10. Result of creating a new account
    Figure 10. Result of creating a new account

The power of EMF extends far beyond what is illustrated in the steps above, which show only fundamental capabilities of EMF. To learn more about EMF, visit the Eclipse Web site.


Using the UML visualization tool

The UML visualization tool is a new feature in WebSphere Studio V5.1 that moves the modeling concept into the Java domain, allowing for seamless integration between modeling and programming. The next sections outline the steps for using the UML visualization tool to develop the same Bank application as we did in the previous section using EMF.

Setup

  1. From Application Developer, select File => New => Other... .
  2. Select Java from the left pane and Java Project from the right. Click Next.
  3. For Project name, enter Bank , then select Finish.
  4. Once more, select File => New => Other....
  5. Select UML Visualization from the left and Class Diagram from the right. Click Next.
  6. Select the Bank Java project and enter Bank for the File name. Click Finish.

Creating a class

  1. In the drawing panel, click first on the Class button, then click elsewhere in panel to display the New Java Class dialog (Figure 11).
  2. In the dialog, enter example for Package, and enter Customer for the Name of the class. Click Finish.
    Figure 11. New Java Class dialog
    Figure 11. New Java Class dialog
  3. Create five others classes in the same manner:
    • Account
    • SavingAccount
    • InvestmentAccount
    • Stock
    • StockOrder.
    Figure 12 shows the resulting model after creating all the classes.
    Figure 12. Creating class entities
    Figure 12. Creating class entities

Generalization

  1. To create a generalization relationship between the InvestmentAccount and Account classes, click on the Extends button in the drawing panel, then drag and drop from the InvestmentAccount class to the Account class.
  2. Create another generalization relationship from SavingAccount to Account in the same manner.
    Figure 13. Generalization relationship
    Figure 13. Generalization relationship

Association

  1. To create a field association relationship from the Customer class to the Account class, right click on the Customer class, then select Add Java => Field.
  2. In the Create Java Field dialog (Figure 14), enter or select the following values:
    • Name of the field: accounts.
    • Type: Account
    • Dimension: 1.
    • Generate: getter and setter.
    Click Finish.
    Figure 14. Create Java Field dialog
    Figure 14. Create Java Field dialog
  3. On the next dialog, right click Customer and select Show Field As....
  4. On the Show Fields As dialog (Figure 15), select the accounts field and click on the right arrow button. Click OK.
    Figure 15. Show Fields As dialog
    Figure 15. Show Fields As dialog
  5. Repeat the above steps to create another association from Account to Customer, using these values:
    • Name of the field: customer
    • Type: Customer
    • Dimension: 0
    • Generate: getter and setter.
    Click Finish.
  6. Create another association from InvestmentAccount to Stock, using these values:
    • Name of the field: stocks
    • Type: Stock
    • Dimension: 1
    • Generate: getter and setter.
    Click Finish.
  7. Create another association from StockOrder to Stock, using these values:
    • Name of the field: stock
    • Type: Stock
    • Dimension: 0
    • Generate: getter and setter.
    Click Finish. Figure 16 shows the model we have so far.
    Figure 16. Association relationships
    Figure 16. Association relationships
  8. Apart from generating an association relationship, the Create Java Field dialog (Figure 14) can also be used to create an attribute. Right click on the Customer class, then select Add Java => Field. In the Create Java Field dialog, enter or select the following values:
    • Name of the field: name
    • Type: java.lang.String
    • Generate: getter and setter .
    Click Finish. We do not need to use the Show Field As dialog since the name field is an attribute, not an association relationship to another class entity.
  9. In the same manner, create the following attributes:

    Class Attribute name Type Generate getter and setter
    Customeraddressjava.lang.Stringyes
    AccountcashBalancedoubleyes
    SavingAccountinterestRatedoubleyes
    Stocktickerjava.lang.Stringyes
    Stockquantityintyes
    StockOrdercommissiondoubleyes
  10. Optionally, we can make the diagram more readable by suppressing the method section of each class. Click on the class, then select the twist icon. Figure 17 shows the resulting model after suppressing the method section of each class.
    Figure 17. Creating attribute
    Figure 17. Creating attribute

Dependency

  1. To create a dependency relationship, right click on the InvestmentAccount class, then select Add Java => Method.
  2. In the Create Java Method dialog (Figure 18), enter or select the following values:
    • Name: placeOrder
    • Type: StockOrder
    • Name of parameter: stockOrder.
    Select the Add button then Finish.
    Figure 18. Create Java Method dialog
    Figure 18. Create Java Method dialog
  3. By default, the dependency relationship is not shown in the model. To make the dependency relationship visible, right click on InvestmentAccount, then select Show/Hide Relationships. Click OK. Figure 19 shows the completed model for the Bank application.
    Figure 19. The completed Bank model
    Figure 19. The completed Bank model

The UML visualization tool raises the level of abstraction for developing Java applications, and allows users to view and edit entities and their relationships. The tool is easy to use and requires very little Java knowledge. Other useful features of the UML visualization tool include the ability to graphically create EJBs. The UML visualization tool supports the UML/EJB Mapping Specification (JSR-000026), and greatly reduces the complexity of managing EJBs. After creating your class diagram in an EJB project, just drag and drop various types of EJBs, such as session beans and their relationships, in the drawing panel as you did with other elements. The results are simple and effective.


Conclusion

Modeling plays a significant role in application development. A good model paves the way for a successful project. The importance of having a rigorous model increases with the complexity of an application. This article provided a basic outline for using EMF to create a Java implementation from a model (specifically, from a Rational Rose class diagram), and for testing the Java implementation using JSPs. We also saw how to use the UML visualization tool in WebSphere Studio V5.1 to develop the same Java application. With this new tool, WebSphere Studio now provides an integrated environment for building Java applications from modeling to programming.


Downloads

DescriptionNameSize
Code samplebank.zip  ( HTTP | FTP )7 KB
Code samplejsp.zip  ( HTTP | FTP )3 KB

Resources

Comments

developerWorks: Sign in

Required fields are indicated with an asterisk (*).


Need an IBM ID?
Forgot your IBM ID?


Forgot your password?
Change your password

By clicking Submit, you agree to the developerWorks terms of use.

 


The first time you sign into developerWorks, a profile is created for you. Information in your profile (your name, country/region, and company name) is displayed to the public and will accompany any content you post, unless you opt to hide your company name. You may update your IBM account at any time.

All information submitted is secure.

Choose your display name



The first time you sign in to developerWorks, a profile is created for you, so you need to choose a display name. Your display name accompanies the content you post on developerWorks.

Please choose a display name between 3-31 characters. Your display name must be unique in the developerWorks community and should not be your email address for privacy reasons.

Required fields are indicated with an asterisk (*).

(Must be between 3 – 31 characters.)

By clicking Submit, you agree to the developerWorks terms of use.

 


All information submitted is secure.

Dig deeper into WebSphere on developerWorks


static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=1
Zone=WebSphere
ArticleID=99509
ArticleTitle=IBM WebSphere Developer Technical Journal: Application modeling with WebSphere Studio V5.1
publish-date=02132004