Hello World: WebSphere Portal V6

Exercise 1. Develop and test a portlet

In this exercise, you take the role of a developer to create a new basic JSR 168 portlet, MyFirstPortlet, and test the portlet in Rational Application Developer's WebSphere Portal Test Environment.

JSR 168 is a portlet specification standard for portlet development. In Rational Application Developer, full support is provided for developing portlets using this standard, including automatically generating JSR 168 portlet projects simply by executing a wizard.

Step 1. Start Rational Application Developer

Launch Rational Application Developer if it is not up and running.

1. From Windows, click Start > Programs > IBM Software Development Platform > IBM Rational Application Developer > Rational Application Developer.
2. A window opens asking for the workspace directory. Click OK to accept the default.

Back to top

Step 2. Create a new portlet project

1. From the workbench, select File > New > Project.
2. Select Portlet Project, as shown in Figure 5, and click Next.
   
   Figure 5. Select a wizard
   
   
   
3. In the Portlet Project wizard, enter MyFirstPortlet for the Project name. The EAR Project Name and Portlet name are auto-filled by the wizard upon your entry of Project name. For Target Runtime, choose WebSphere Portal v6.0. For Portlet API, choose JSR 168 Portlet. For the Portlet type, choose Basic Portlet. Click Next.
   
   Figure 6. New Portlet Project features
   
   
   
4. Accept the default values in the Portlet Settings panel, as shown in Figure 7, and click Next.
   
   Figure 7. Portlet Settings
   
   
   
5. As shown in Figure 8, select the check boxes for Add action listener and Add JSP form sample in the Action and Preferences panel. Click Next.
   
   Figure 8. Action and Preferences
   
   
   
6. In this exercise, you will not be using single sign-on. Accept the default values in the Single Sign On section, as shown in Figure 9, and click Next.
   
   Figure 9. Advanced Settings
   
   
   
7. Click Finish.
8. Observe that the MyFirstPortlet Project you just created was generated in the Project Explorer pane.
   
   Figure 10. Project Explorer
   
   
   

Explore the files in your MyFirstPortlet project, and review the purpose of each file using Table 2 below. You will be modifying these files to create your own customized portlet.

Back to top

Step 3. Modify the session bean in MyFirstPortlet

Session beans are used to pass data to the JSP. In this step, create two new variables called myName and greeting to store the user's name and greeting message.

1. In Project Explorer expand MyFirstPortlet > Java Resources: src > com.ibm.myfirstportlet and double click the file MyFirstPortletSessionBean.java, as shown in Figure 11.
   
   Figure 11. MyFirstPortletSessionBean.java file
   
   
   
2. Delete all the class variables and methods from the MyFirstPortletSessionBean class, and create new private Strings for myName and greeting. The SessionBean class should now look like as follows.

   package myfirstportlet; public class MyFirstPortletPortletSessionBean { private String myName = ""; private String greeting = ""; }

   
   
3. Right-click in the MyFirstPortletSessionBean window and select Source > Generate Getters and Setters, as shown below.
   
   Figure 12. Generate Getters and Setters
   
   
   
4. Check the boxes for the variables greeting and myName, as shown in Figure 13. This wizard generates the getters and setters for both variables. Click OK.
   
   Figure 13. Select Getters and Setters to create
   
   
   
5. Save the file by pressing Ctrl-S.

You can see errors in the other classes. Don't worry, you will fix these errors later.

Back to top

Step 4. Modify the JSP in MyFirstPortlet

In this step, modify the JSP file and create a form with two text boxes and a submit button.

1. In Project Explorer, expand MyFirstPortlet > WebContent > MyFirstPortlet > JSP > html and double click the file MyFirstPortletView.jsp.
2. Modify the JSP file with the code shown below, and save the changes.

   The sample code that is generated with the project is very similar to the code you need to type in. To reduce the chances of making an error, focus on the items in bold in the code below.

   • Change the variable FORM_TEXT to FORM_NAME
   • Create a new variable similar to FORM_TEXT called FORM_GREETING
   • Change the if statement to also check if the strings stored sessionBeans are empty

   As you type, you can also use the Code Assist (Ctrl-Space) function to help complete the keywords.

   <%@ page session="false" contentType="text/html" import="java.util.*,javax.portlet.*, myfirstportlet.*" %> <%@taglib uri="http://java.sun.com/portlet" prefix="portlet" %> <portlet:defineObjects/> <% MyFirstPortletPortletSessionBean sessionBean = (MyFirstPortletPortletSessionBean)renderRequest.getPortletSession().getAttribute (MyFirstPortletPortlet.SESSION_BEAN); %> <DIV style="margin: 12px; margin-bottom: 36px"> <% String formName = sessionBean.getMyName(); String formGreeting = sessionBean.getGreeting(); if( formName.length()>0 && formGreeting.length() > 0) { %> '<%=formName%>' wants to wish you '<%=formGreeting %>'. <% } %> <FORM method="POST" action="<portlet:actionURL/>"> <LABEL for="<%=MyFirstPortlet.FORM_NAME%>">Enter Your Name:</LABEL><BR> <INPUT name="<%=MyFirstPortlet.FORM_NAME%>" type="text"/><BR> <LABEL for="<%=MyFirstPortletPortlet.FORM_GREETING%>">Greeting:</LABEL><BR> <INPUT name="<%=MyFirstPortlet.FORM_GREETING%>" type="text"/><BR> <INPUT name="<%=MyFirstPortlet.FORM_SUBMIT%>" type="submit" value="Submit"/> </FORM> </DIV>

   
   
3. Save the file by pressing Ctrl-S.

Back to top

Step 5. Modify the MyFirstPortlet.java file

In this step, you'll modify the MyFirstPortlet.java file to support the changes we made in the JSP and the sessionbean in previous steps.

1. In Project Explorer, expand MyFirstPortlet > Java Resources: src > com.ibm.myfirstportlet and double click the file MyFirstPortlet.java.
2. Modify the code, as shown below.
• Add the FORM_NAME and FORM_GREETING variable.
• Delete the variable FORM_TEXT (this variable was part of the generated sample code).

  public static final String VIEW_JSP = "MyFirstPortletPortletView"; public static final String SESSION_BEAN = "MyFirstPortletPortletSessionBean"; public static final String FORM_SUBMIT = "MyFirstPortletPortletFormSubmit"; public static final String FORM_NAME = "MyFirstPortletPortletFormName"; public static final String FORM_GREETING = "MyFirstPortletPortletFormGreeting";

  
  
• Modify the processAction() method, as shown below.

  public void processAction(ActionRequest request, ActionResponse response) throws PortletException, java.io.IOException { if( request.getParameter(FORM_SUBMIT) != null ) { // Set form text in the session bean MyFirstPortletPortletSessionBean sessionBean = getSessionBean(request); if( sessionBean != null ) { sessionBean.setMyName(request.getParameter(FORM_NAME)); sessionBean.setGreeting(request.getParameter(FORM_GREETING)); } }

  
  
3. Save the file by pressing Ctrl-S.

Back to top

Step 6. Run MyFirstPortlet in the WebSphere Portal Test Environment

In Rational Application Developer, you can locally test and debug your portlet applications using the WebSphere Portal Test Environment. In this step, add the MyFirstPortlet Project in the WebSphere Portal v6.0 Test Environment (PTE) and then run the project in the PTE.

1. In the Servers pane, right-click WebSphere Portal v6.0 Server and click Add and Remove Projects.
   
   Figure 14. Add and Remove Projects in PTE 6.0
   
   
   
2. Ensure that MyFirstPortlet is listed in the Configured Projects pane.
• If it is not, highlight MyFirstPortlet and click Add >, as shown below. Click Finish.
  
  Figure 15. Add MyFirstPortletEAR to PTE
  
  
  
• In the Servers pane, observe that MyFirstPortlet is added to the WebSphere Portal v6.0 server @localhost.
  
  Figure 16. Servers
  
  
  
3. Start the WebSphere PTE on your local machine.
• From Servers, right-click WebSphere Portal v6.0 Server and click Publish, as shown below. This starts the WebSphere Portal v6.0 server, and publishes the MyFirstPortlet to the server. It might take a few minutes to complete this step.
  
  Figure 17. Start the PTE
  
  
  
• When the WebSphere PTE has started and the MyFirstPortlet is published, an indication in Servers in the Status section appears.
  
  Figure 18. PTE start status
  
  
  
4. You can test the MyFirstPortlet on the WebSphere PTE right here in your local development environment.
• Right-click WebSphere Portal v6.0 Server in Servers and choose Open Portal.
  
  Figure 19. Open Portal
  
  
  
• MyFirstPortlet is launched in the IBM WebSphere PTE window in Rational Application Developer.
  
  Figure 20. MyFirstPortlet launched in PTE
  
  
  
5. Test the portlet by typing in your name, and a special greeting for a special someone. Since April first just passed, type in Happy April Fool's Day!.
• In Enter Your Name, type your name. In Greetings, type Happy April Fool's Day. Click Submit.
  
  Figure 21. Testing MyFirstPortlet in PTE
  
  
  
• Observe that the greeting is displayed in your portlet.
  
  Figure 22. MyFirstPortlet displays a message
  
  
  
6. Click Submit again in the form. Leave both text boxes blank this time. What happens?
7. Stop the Portal Test Server. Right-click WebSphere Portal v6.0 Server and select Stop.

Back to top

Step 7. Export MyFirstPortlet

At this point it's time to export your portlet.

1. In Project Explorer, right-click MyFirstPortlet. Select Export > WAR file.
   
   Figure 23. Export WAR file
   
   
   
2. In Destination, browse to a directory of your choice, as shown in Figure 24. Select the check box for Export source files, and click Finish.
   
   Figure 24. Export WAR file to specified destination
   
   
   

5 of 9 | Previous | Next

Comments

Back to top

Table of contents

• Before you start
• Introduction
• How WebSphere Portal fits into SOA
• About the exercises
• Exercise 1. Develop and test a portlet
• Exercise 2. Deploy a portlet
• Download
• Resources
• About the authors

---

5 of 9 | Previous | Next

Next steps from IBM

• Try: WebSphere Portal Express
• Briefing: WebSphere flexible business processes
• Buy: WebSphere Portal Express

Dig deeper into WebSphere on developerWorks

IBM SmartCloud trial. No charge.

Unleash the power of hybrid cloud computing today!

---

Public and private solutions in one trial.

Special offers