1. Creation of hybrid portlet application for file download using IBM Worklight and IBM Rational Application Developer v9 Gaurav Bhattacharjee Lakshmi Priya

2. Agenda 8/17/2015  IBM Websphere Portal overview.  IBM Web Content Manager (WCM).  IBM Rational Application Developer overview.  Creating multi-channel portlet application in RAD  Web vs Hybrid vs Native  IBM Worklight overview.  Creating hybrid app in Worklight.  Consuming portal content in the Worklight app  Adding native functionality to the hybrid app.

3. 3 What is a Portal? sds  Portal is a central place for making all types of information accessible to an audience of varying range.  Portal –Enterprise Information Portals – Vast information consolidated in single screen. –Content Management Portals – Access and sharing of information.  IBM WebSphere Portal is a set of software tools that enables companies to build and manage web portals. It provides a single access point to web content and applications, while delivering differentiated, personalized experiences for each user.

4. 4 Portal Principles  Combines portlets (application user interfaces and/or content) together into one unified presentation  Delivers a highly personalized experience, considering role, personal settings, and device settings  Separates site design, site/page assembly/administration, from application design  Provides application integration, collaboration, single sign-on services and much more

5. 5 WCM Overview  Web Content Manager is used to create, manage, and deliver content for your website.  It manages:  The content and design of pages in a web site.  The framework and navigation of a web site.  The creation, editing, approval and publication of a web site's content.

6. 6 Web Content Management features Content management  Web Content Management comes with a set of tools to manage the creation, approval and publication of web content.  Authoring templates : Authoring templates are used to store a set of default values to be used when creating new content. S

7. IBM Rational Application Developer  IBM® Rational® Application Developer for WebSphere® Software accelerates the development and deployment of Java, Java EE, Web 2.0, mobile, OSGi, portal and service-oriented architecture (SOA) applications.  Both expert and novice developers can increase productivity and efficiency by using its many integrated capabilities for easier development, testing, analysis and delivery of applications.

8. 8 Creation of multi-channel portlet application  Create a multi-channel portlet application in RAD that will provide different UI for desktop browser and smartphone/tablet browsers.  In this case you will design the application in such a manner that it will show you a list of web content present in a sample library.

9. Web vs Native vs Hybrid

10. IBM Worklight  IBM Worklight helps you extend your business to mobile devices.  It is designed to provide an open, comprehensive platform to build, run and manage HTML5, hybrid and native mobile apps.  IBM Worklight can help you reduce both app development and maintenance costs, improve time-to-market and enhance mobile app governance and security.

11. Hybrid application created in Worklight  Create a hybrid application for smartphones in worklight.  In this case you will develop a hybrid application that will get it's content from portal server and augments it with native functionality so that it allows to download a file on the device.

12. 12 Use case  The portlet application that you will develop will use JAX-RS to retrieve the web content present in a sample library present on WebSphere Portal server.  The desktop version of this sample downloads the file onto any location that the user chooses in the file system.  The hybrid mobile version created using IBM Worklight would add native functionality of downloading the selected file onto the device.  The sample uses Dojo Mobile toolkit for UI generation of mobile version and dojo widgets for desktop version.  It uses JAX-RS to access IBM web content management libraries' content.

13. 13 Creation of a hybrid application with native functionality At a high level, it involves the following steps:  Creation of a hybrid application (for android environment) in worklight.  Updating the application to fetch contents from portal run-time. The cordova js file would reside in the Portal side.  Updating the portlet JSP to add a download icon when the portal page containing the portlet is accessed by the application.  Updating portlet application's javascript to invoke Apache Cordova APIs to download the file onto the device.  Finally testing the application developed on Android emulator.

14. Thanks 14