Flex Up Your Portlets!
By insidemyhead on Mar 22, 2007
As promised I started to do my Flex development, and boy I found it really amazing. Flex based UI is nothing but a SWF file that is run by the Flash VM running as a plugin in your browser, much like the Java Plugin. Personally I prefer Flex over Ajax, having tried both.
If you want to build a rich user interface web application that requires several state changes, spans multiple business processes and requires complex data handling at the back-end and still want to give the users a really rich and consistent experience (no refreshes!) then I think Flex definitely is the better choice.
It has the pretty good concept of,
Application = Code + Markup.
Where Markup is provided by the declarative MXML syntax, code is provided by ActionScript. ActionScript is Object Oriented as well, that is, if you are familiar with Java, learning ActionScript is pretty much a breeze.
Flex provides inbuilt support for making calls to the backends using HTTP (GET/POST) as well as native support to make webservices Calls via the <mx:HTTPService> and the <mx:WebService> tags respectively. Using the <mx:WebService> tag to make web services calls was so easy, that it felt like reading WebServices for Dummies!!
I believe it is possible to make calls into EJB's also, but I haven't yet explored that possibility. Still in my learning phase!.
The first application I did was an application that shows the user a drawing board in which the user can draw pictures. To do this it was a breeze in Flex Builder. Opened up the 'Design' view, dropped in a panel, a canvas object and then trapped the mouse clicks in ActionScript, and made sure that lines were drawn between the mousedown's and the mouseup's. Real Simple!
Anyway, being in the portal world, I wanted to make use of the Flex Application Platform in my portal. In other words, I wanted to 'Flex Up my portlet'. This would not only involve building the user interface in Flex, but would also get me to test the webservices support in Flex. Nice!
So now I needed a nice enough usecase. After thinking for a while, I thought that maybe a E-Signature portlet would really be nice. The portlet will present a user with a document (a NDA, EULA etc) that traditionally the end users would have signed/accepted. The portlet would provide a canvas wherein a user can actually sign the document. And then this signature is posted back to the server as a bitmap and saved. Basically, this portlet could leverage my initial work on the simple standalone 'canvas board' flex application. With this idea in mind, was all charged up to flex up my portlet.
- Flex Builder from Adobe as a plugin for Eclipse.
- Portal Pack for Eclipse : It helps when both plugins are in Eclipse ;-)
- Open Source Portlet Container
So my E-Signature portlet is done. I put up a small screencast of it for download. If you are interested then you can view it here.
In my next blog, I will post instructions on how to actually integrate Flex applications into your portlets. So keep posted!
UPDATE: I didn't get time to post the entry on how to create a portlet out of the Flex application, but I helped my colleague Murali on getting his Flex app as a portlet and he has been prompt enough to post the instructions on his blog here. Thanks Murali.