What's new in IBM Rational Application Developer 8.5 portal tools

This article provides detail on all the features that have been introduced or enhanced in Version 8.5 of the IBM Rational Application Developer portal and portlet development tools, including additions for mobile devices. The authors explain use of some of these tools and include code snippets and illustrated examples. Familiarity with Rational Application Developer will be helpful in following the article.

Jaspreet Singh (jaspsing@in.ibm.com), Software Architect, IBM

author photoJaspreet Singh is a software architect for the Rational WebSphere Portal tools in ICS. His areas of expertise span the WebSphere Portal domain, Eclipse plug-ins, Java Enterprise Edition (JEE), and Web 2.0 frameworks. He has presented at the Rational Software Development Conference in 2008, Portal Excellence Conference 2009, the Rational software Innovate 2010 conference, and the Exceptional Web Experience Conference in 2011.



Mansi Gaba (mansigaba@in.ibm.com), Staff Software Engineer, IBM

author photoMansi Gaba is a staff software engineer at the IBM Software Labs in Delhi, India. Her areas of expertise include JavaServer Faces (JSF) portlet bridge, the JSR-286 Java Portlet specification, and portlet server tools. She has completed Sun Certified Java Programmer, Sun Certified Web Component Developer, and Oracle Certified Professional, Java EE 5 Business Component Developer.



06 November 2012

Introduction

The IBM® Rational® Application Developer integrated development environment (IDE) for software developers includes tools that help in designing, developing, testing, and deploying portal applications. The workbench provides tools to design and develop portal applications that can integrate with Java Enterprise Edition (JEE) frameworks, including JavaServer Faces (JSF) technologies to access data. Plus, it provides tools and features to integrate seamlessly with client-side JavaScript libraries, such as the Dojo widgets, to visualize data. You can also use it to test your application and publish it to a WebSphere Portal server.


Highlights of the new and enhanced features

The Rational Application Developer portal development tools in Version 8.5 have been enhanced to take advantage of IBM® WebSphere® Portal Version 8.0 capabilities. You also get revamped support for developing portlets that will be access from mobile devices, including smartphones and tablets.

WebSphere Portal 8.0 runtime support to create and test portlet projects

Rational Application Developer 8.5 has a new server runtime environment (shown in Figure 1), server type (Figure 2), and stubs for WebSphere Portal 8.0 support.

Figure 1. New Server Runtime Environment wizard
Wizard to create a new server runtime

You can create portlets targeted to WebSphere Portal Version 8.0 runtime and then publish or deploy to it, as well. This allows creation of portlets that leverage new features in the WebSphere Portal Version 8.0.

Figure 2. New Server wizard
Wizard to create a new server

JavaServer Faces 2.0 portlets support

Rational Application Developer 8.5 provides tools for creating a JavaServer Faces (JSF) 2.0 portlet application by using the New Portlet Project wizard shown in Figure 3. The portlet project created generates a default Facelet and the entire configuration required for deploying a JSF 2.0 portlet on WebSphere Portal 8.0. The default JavaServer Faces facet version is 2.0 for the Faces portlet project, with target runtime as WebSphere Portal 8.0, as shown in Figure 4 You can drag the standard JSF components and portlet palette items onto the Facelet page to generate Java code automatically, following coding best practices. All new JSF 2.0 features can be used seamlessly in portlet applications created in Rational Application Developer.

Note:
The JSF 2.0 portlet bridge acts as a broker between a portlet container and a JSF container to render a portlet on a portal page. You can use it to create portlets based on JSF 2.0 specifications and publish them on IBM WebSphere Portal 8.0. The JSF 2.0 portlet bridge is included in WebSphere Application Server Version 8.0.0.3 and later versions.

Figure 3. New Portlet Project dialog window
wizard to create a portlet

The Manage Features wizard lists the project facets, including all facet names and versions. This makes using all new features of JSF 2.0 on WebSphere Portal very convenient

Figure 4. Project Facets page
Page to select the facets for a project

Rich page Editor for portlet development with CSS3 and HTML5

The browser-based editor introduced in Version 8.5 helps you preview the Facelet or JavaServer Page (JSP), as they would appear in a web browser. The rich page editor provides WYSIWYG (preview) designing capabilities and supports HTML5 and CSS3 editing. It also offers instant preview and Content Assist help. You can create and edit JSP portlet files using the rich page editor. It shows different representations of your portlet page, with Source, Split, and Design view options. The editor uses embedded browsers to produce a visual representation of a page in the design view. For example, you drag any palette item onto a Border Container, as shown in Figure 5, and use the Split view to see both the Design (preview) and Source (code) views.

Figure 5. Rich page editor
View options in the Rich Page Editor

Single-click enablement of Web 2.0 features

The New Portlet Project wizard has been redesigned (see Figure 6) to provide single-click enablement for various Web 2.0 features that you can use in portlets. This is both intuitive and easier than having to enable these through project facets.

Figure 6. Web 2.0 features in the New Portlet Project creation wizard
Dialog window to specify Web 2.0 features to use

Mobile browser simulator

Rational Application Developer provides a fast and easy way to test multichannel portlet applications by using a mobile browser simulator. You can test the output view of the portlet on this simulator without having to install any separate device simulator. You can view the output on various mobile devices in a mobile browser simulator, and you can do all of this by staying within the integrated development environment (IDE).

To run a portlet project on a mobile browser simulator, right-click on the portlet project, select Run As, and then select Run on Mobile Browser Simulator (see Figure 7). The mobile browser simulator offers other features, such as switching orientation of the device, adding multiple devices simultaneously, mapping devices to their actual physical sizes. It is a very convenient and effective new feature to aid you in mobile portlet application testing.

Figure 7. How to access a mobile browser simulator
drop-down menu selections for the simulator

Improved smartphone and tablet portlet support

The improved smartphone and tablet support enables you to work on separate views for smartphones and tablets, rather than using a single portlet view page for both of those devices, as in earlier versions.

You can also choose support for either or both tablets and smartphones for your portlets, or both. When you select either of those options while creating a portlet project, Rational Application Developer now automatically provides support for selecting the devices as well, as show n in Figure 8. This opens further new options while developing portlets for these devices.

Figure 8. Improved smartphone and tablet support
Enhanced wizard for devices support and selection

The different portlet view JSPs created for devices as shown in the project structure of a device-enabled portlet project (see Figure 9).

Figure 9. Different device-enabled portlet project views generated
tree view shows 3 different JSP views

Dojo Mobile widgets support

You can create interactive, multichannel portal applications with exceptional GUIs for mobile devices by using Dojo Mobile, which is an HTML5 mobile JavaScript framework. It is an optimized set of widgets well-suited for smartphone requirements, such as smaller footprint and a native look and feel for mobile devices. You can drag the Dojo mobile widget from the palette (as shown in Figure 10) onto the portlet JSP and deploy it on WebSphere Portal Server.

Figure 10. Dojo Mobile widgets
Palette view of Dojo mobile widgets

Dojo markup and other boilerplate content is automatically generated when any Dojo mobile widget is dragged onto a portlet JSP file. Listing 1 shows an example of code generated for Dojo mobile widgets.

Listing 1. Code generated for Dojo mobile widgets
<div id="widgetContainer_<portlet:namespace/>">
<div data-dojo-type="dojox.mobile.View" id="view_<portlet:namespace/>">
<h1 data-dojo-type="dojox.mobile.Heading"data-dojo-props="label:'Heading'" 
    id="heading_<portlet:namespace/>">
<h2 data-dojo-type="dojox.mobile.EdgeToEdgeCategory" 
    id="edgeToEdgeCategory_<portlet:namespace/>">
<div data-dojo-type="dojox.mobile.EdgeToEdgeList" 
    id="edgeToEdgeList_<portlet:namespace/>">
<div data-dojo-type="dojox.mobile.ListItem" data-dojo-props="label:'Item1''"></div>
<div data-dojo-type="dojox.mobile.ListItem" data-dojo-props="label:'Item2''"></div>
</div>
</div>
</div>

Support for device classes

The multichannel smartphone and tablet support is now enhanced and standardized to include device classes. Earlier versions relied on the user agent string to detect the device from which the incoming request originated. This meant that no new device support could be added at run time, and it was also a non-uniform way of detecting devices.

Now, the WebSphere Portal runtime provides a standard API called Client profile information (CC/PP) for accessing client profiles. These APIs are exposed to the portlet developers as device classes, such as smartphone or desktop. These are referred in the portlet class to render the specific page based on the device class, as shown in Figure 11.

Figure 11. Screen capture of code generated automatically for a device class
auto-generated device class selection code

Summary

Version 8.5 advances Rational Application Developer in both multichannel development capabilities and the tools it provides for developers to create exceptional web experiences for end users. Both the tools and the ease of using them make it a very intuitive and productive to create the next generation of portal applications that give businesses an extra edge.

Resources

Learn

Get products and technologies

Discuss

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 Rational software on developerWorks


static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=1
Zone=Rational
ArticleID=844118
ArticleTitle=What's new in IBM Rational Application Developer 8.5 portal tools
publish-date=11062012