wesphere portlet factory – ria et web 2.0 autour de ... · pdf filewesphere portlet...

13

Session S8

Wesphere Portlet Factory – RIA et Web 2.0 autour de WebSphere Portal

Arjen MoermansIT Specialist – Lotus Techworks [email protected]

© 2008 IBM Corporation2

IBM Corporation

Agenda

WebSphere Portlet Factory overview

Web 2.0 and Rich Internet Applications (AJAX)

WebSphere Portlet Factory and AJAX overview

AJAX and Web 2.0 features

Demo


IBM Corporation

• User-driven adoption

• Value on demand

• Low cost of entry

• Public infrastructure

Software as aSERVICE

Service, not software

COMMUNITYmechanisms • Recommendations

• Social networking features

• Tagging

• User comments

• Community rights management

Users add value

SIMPLEuser interface

and dataservices

• Responsive UIs (RIA, AJAX)

• Feeds (Atom, RSS)

• Simple extensions

• Mashups (REST APIs)

Easy to use, easy to remix

Web 2.0

The three patterns driving Web 2.0


IBM Corporation

Several Commonly Used Technologies Underlying Web 2.0

• AJAX– Asynchronous JavaScript and XML– Related technologies to create so called “rich internet applications” (RIA)

• Provides a rich user interface

• JSON– JavaScript Object Notation

• Lightweight Data-interchange format {name-value pair, ordered list}• Use JavaScript’s eval() to create an object to be used in JavaScript / AJAX

– Frequently used in AJAX applications; alternative to XML in representing an object

• ATOM– Standard for data feeds– Alternative to RSS (Really Simple Syndication) Feed

• REST– REpresentational State Transfer– Centered around named resources– Use HTTP Methods {POST, GET, PUT, DELETE} to provide CRUD operations


IBM Corporation

Definitions of “AJAX”

• AJAX stands forAsynchronous JavaScript And XML

• AJAX is not a new programming language, but a new way to use existing standards and mechanisms

• With AJAX you can create better, faster, and more user-friendly web applications


IBM Corporation

Traditional web application

Client

Server

User interacts with page,triggers action

User interaction…

Request processed, fullpage HTML generated

Time

HTTP request HTTP response

Browser replaces entire page


IBM Corporation

AJAX-based web application• User actions in the browser cause JavaScript to execute • Script communicates directly with the server

– XmlHttpRequest or hidden IFRAME• Server replies

– Data: text, JSON, XML, etc.– HTML fragment

• JavaScript in the page interprets this reply and uses it to update one or more page areas

• Benefits– Faster response time– No “flicker”– Potentially higher performance due to smaller pieces of data

being transferred between server and client


IBM Corporation

AJAX-based application (RIA)

Client

Server

User interacts with page,triggers action

User interaction…

Request processed, data orHTML fragment generated

Time

Part of page is refreshedbased on new data/HTML

JavaScript

Script invoked tohandle request

HTTP request HTTP response

Widget


IBM Corporation

The Dojo toolkit

• Open source JavaScript toolkit• Designed to ease the rapid development of JavaScript- or

Ajax-based applications• Includes support for:

– Widgets– Drag and drop support– Asynchronous communication– Client-side data storage– …and more

• Works cross-browser• Has much industry backing• Strategic technology for IBM


IBM Corporation

Agenda


Portlet Factory overview

Portlet Factory and AJAX overview

AJAX features

Demo


IBM Corporation

Rapid Development for WebSphere Portal andWebSphere Application Server

IBM® WebSphere® Portlet Factory is a portlet and web application creation environment that simplifies & accelerates the development, deployment, maintenance and reuse of custom SOA-based applications – including SAP, Domino, PeopleSoft, Siebel and Web Service portlets.

WebSphere Portlet Factory is entitled as part of WebSphere Portal Server

WebSphere Portlet Factory provides rapid application development and integration to existing applications, data & other IT assets for custom portlet creation - reducing the complexity of J2EE development and speeding WebSphere Portal deployments


IBM Corporation

Portlet Factory key features• Plug-in to Eclipse & Rational

Application Developer• Multi-page complex custom portlets/

applications without coding• Integration capabilities (SAP,

Domino, PeopleSoft, Siebel, Web Services, Databases, Portal Content Repository)

• Service-oriented development (SOA)• Support for Portal features such as

portlet communication, business user configuration, auto-deploy, single sign-on

• “Dynamic profiling” capability, to create multiple variations from a single source model

These are all built on Portlet Factory’s software automation technology


IBM Corporation

Portlet Factory key concepts

BuilderAn adaptive, wizard-like component that implements a specific design pattern and iteratively generates Java, XML, and JSP

ModelA container of Builders

ProfileA set of parameters that vary Builder inputs to dynamically generate unique versions of the portlet


IBM Corporation

Business Information

Information OLAP / Cubes Warehouse /

Mart Databases

Enterprise Svcs Process Server ESB

Enterprise Apps SAP Siebel PeopleSoft Custom

Other Domino Spreadsheets Documents

Services, Portlets, and Customizers

Composite Apps

Employee Self Service

Dashboards

Partner/Customer Self-Service

Services Layer (loose coupling to data services)

IBM WebSphere Portlet Factory

Security/SSO

Collaboration

BPEL/Workflow

Business Information

Portal Services


IBM Corporation

Agenda




AJAX features

Demo


IBM Corporation

Goals of AJAX support in Portlet Factory

• Enable creation of more interactive applications–Partial-page refresh–Rich widgets–Client-side event handling

• Use Portlet Factory’s automation to make complex AJAX techniques simple–Builders can generate the necessary client-side and

server-side elements• Work with existing Portlet Factory builders and

functionality• Leverage existing server platforms

–WebSphere Portal (6.0.x, 6.1.x)–WebSphere Application Server (6.0.x, 6.1.x)–Tomcat 5.5.x (for development)


IBM Corporation

Ajax-related features of Portlet Factory

• Partial-page refresh, within or across portlets• Drag/drop • Inline editing• Tooltips • Type-ahead• Timed action• Hover highlighting• JSON (JavaScript Object Notation)• REST (Representational State Transfer)

service support


IBM Corporation

Portlet Factory AJAX architecture• Many AJAX features require programmatic

access to “standalone” data or HTML (REST)–Just the data -- no surrounding portal HTML

• Some uses–Partial page refresh–XML data streamed to custom AJAX widgets or

JavaScript code–Pop-up windows–Downloads of other file types such as computed

images


IBM Corporation

WebSpherePortal

PortletFactoryWAR

PortletAJAX

Servlet

Browser

Full page request goes to portal onfirst page load

Partial-page requests use AJAX servlet via a back-channel URL

Portal and AJAX Servlet


IBM Corporation

AJAX servlet and security

• All requests to the AJAX servlet must come in the same user session that generated the URL

• Back-channel URLs contain a pseudo-random key; the actual action is found by looking up that key in a session-resident map

• Back-channel URLs are not bookmarkable


IBM Corporation

REST services

• Creating REST Services–Easily create REST services that can be called by any

client or server application–Any Portlet Factory method, such as a service that

accesses back end data from an integration builder, can be exposed as a REST service

• Consuming REST Services–For calling REST services a REST Service Call builder

sample is available–Supports RSS and ATOM–Complete Get, Put, Post and Delete Support coming in

Q3


IBM Corporation

Agenda




Demo

AJAX features


IBM Corporation

Partial-page refresh

• AJAX Region builder:–Causes all actions within a specified area to refresh only

within that area–Can also be used for entire page or entire model (useful

when model is contained in Portal or in another page using Model Container)

• Post-Action Behavior inputs of page action builders (Link, Button, HTML Event Action, Image Button)–This tells a specific action which part of the page to

refresh


IBM Corporation

Partial-page refresh using client events• Client Event support enables cross-portlet client-side

interaction• Enables cross-portlet communication with partial page

refresh• Allows multiple locations to be updated from one event• Leverages existing Portlet Factory event support• Event Declaration builder specifies where to deliver

events–Server only, client only, or both server and client

• Client Event Handler builder adds “listen” support–Page action builder that registers a handler for a specified

client event


IBM Corporation

Dojo Extension Feature Set • Drag/Drop

–Adds drag and drop capabilities to pages (within or across models)

• Dojo Inline Edit –Adds editing capabilities to a field (click to initiate edit

mode)• Dojo Tooltip

–Displays a popup text box when you mouse over a target page area (simple caption string, or an entire page)

• Dojo Enable–Adds Dojo support to a page in a model in order to

manually add Dojo functionality


IBM Corporation

Type-ahead

• AJAX Type-Ahead builder can be applied to any text input field

• The list of choices for the drop-down can come from any XML in the model or from a Lookup Table

• The list of choices can be handled in two ways:–Generate a single list and use automatic pattern-

matching as the user types–Generate lists of choices as the user types, using

custom code that looks at what the user has typed so far


IBM Corporation

Direct access to data or pages

• Many AJAX builders use the standalone data access of Portlet Factory under the covers

• Custom JavaScript code can also access standalone data–For partial refresh in client code–For client code access to data, e.g. XML

• Use webAppAccess.getBackchannelActionURL() method–Provides direct access to any action in Portlet Factory

application


IBM Corporation

Using JSON

• JavaScript Object Notation• Data interchange format commonly used

in AJAX applications• Can be directly evaluated as a JavaScript

object• Convenient format for JavaScript code –

no need to parse XML, etc.• XML / JavaScript Converter – generates

JSON from any XML data in application


IBM Corporation

Some XML and corresponding JSON<EmployeeDetails> <EMPNO>000070</EMPNO> <FIRSTNME>EVA</FIRSTNME> <MIDINIT>D</MIDINIT> <LASTNAME>PULASKI</LASTNAME> <WORKDEPT>D21</WORKDEPT> <PHONENO>7831</PHONENO> <HIREDATE>1980-09-30</HIREDATE> <JOB>MANAGER </JOB> <EDLEVEL>16</EDLEVEL> <SEX>F</SEX> <BIRTHDATE>1953-05-26</BIRTHDATE> <SALARY>36170.00</SALARY> <BONUS>750.00</BONUS> <COMM>2893.00</COMM></EmployeeDetails>

{ "EmployeeDetails" : { "BIRTHDATE" : "1925-09-15", "HIREDATE" : "1949-08-18", "PHONENO" : "6789", "MIDINIT" : "S", "LASTNAME" : "GEYER", "EDLEVEL" : "16", "SALARY" : "40175.00", "FIRSTNME" : "JOHN", "SEX" : "M", "BONUS" : "1800.00", "COMM" : "3214.00", "EMPNO" : "000050", "JOB" : "MANAGER ", "WORKDEPT" : "E01" } }


IBM Corporation

Summary– Rapidly create AJAX

portlets that support features such as drag & drop across portlets, in-line editing, partial page refreshing

– Leverage existing investments – Seamlessly deploy rich AJAX portlets on WebSphere Portal and WebSphere Application Server, versions 5.1 and above

• Highly productive tooling shields developers from the complexities of Web 2.0. technologies


IBM Corporation

Agenda


Demo


AJAX features



IBM Corporation

Demo


IBM Corporation

For more information• Portlet Factory product documentation (has samples and

overview documentation)– http://www-128.ibm.com/developerworks/websphere/zones/portal/portletfactory/

proddoc.html

• developerWorks forums (Portlet Factory forums are quite active)–http://www.ibm.com/developerworks/forums/wsdd_forums.jsp

• Portlet Factory product support–http://www.ibm.com/software/genservers/portletfactory/support/

• Portlet Factory product information–http://www.ibm.com/software/genservers/portletfactory/

http://www-128.ibm.com/developerworks/websphere/zones/portal/portletfactory/proddoc.html

http://www-128.ibm.com/developerworks/websphere/zones/portal/portletfactory/proddoc.html

http://www.ibm.com/developerworks/forums/wsdd_forums.jsp

http://www.ibm.com/developerworks/forums/wsdd_forums.jsp

http://www.ibm.com/software/genservers/portletfactory/support/



http://www-306.ibm.com/software/genservers/portletfactory/




IBM Corporation

© IBM Corporation 2008. All Rights Reserved.

The workshops, sessions and materials have been prepared by IBM or the session speakers and reflect their own views. They are provided for informational purposes only, and are neither intended to, nor shall have the effect of being, legal or other guidance or advice to any participant. While efforts were made to verify the completeness and accuracy of the information contained in this presentation, it is provided AS IS without

warranty of any kind, express or implied. IBM shall not be responsible for any damages arising out of the use of, or otherwise related to, this presentation or any other materials. Nothing contained in this presentation is intended to, nor shall have the effect of, creating any warranties or representations from IBM or its suppliers or licensors, or altering the terms and conditions of the applicable license agreement governing the use of IBM software.

References in this presentation to IBM products, programs, or services do not imply that they will be available in all countries in which IBM operates. Product release dates and/or capabilities referenced in this presentation may change at any time at IBM’s sole discretion based on market opportunities or other factors, and are not intended to be a commitment to future product or feature availability in any way. Nothing contained in these materials is intended to, nor shall have the effect of, stating or implying that any activities undertaken by you will result in any specific sales, revenue growth or other results. Performance is based on measurements and projections using standard IBM benchmarks in a controlled environment. The actual throughput or performance that any user will experience will vary depending upon many factors, including considerations such as the amount of

multiprogramming in the user's job stream, the I/O configuration, the storage configuration, and the workload processed. Therefore, no assurance can be given that an individual user will achieve results similar to those stated here.

All customer examples described are presented as illustrations of how those customers have used IBM products and the results they may have achieved. Actual environmental costs and performance characteristics may vary by customer.

The following are trademarks of the International Business Machines Corporation in the United States and/or other countries. For a complete list of IBM trademarks, see www.ibm.com/legal/copytrade.shtmlIBM, the IBM logo, Lotus, Rational, and WebSphere. Java and all Java-based trademarks are trademarks of Sun Microsystems, Inc. in the United States, other countries, or both.Other company, product, or service names may be trademarks or service marks of others.