JAVAEE MEETS
MATTHIAS WESSENDORFJBoss by Red HatMember Apache Software FoundationFormerly working at Kaazing and OracleSpeaker, Author,...
AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks   jQuery Mobile   Backbone.js   Your JS Framework....
AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks   jQuery Mobile   Backbone.js   Your JS Framework....
WHAT DOESMOBILE  MEAN?
FOR US, BASICALLY:Modern Smartphones & TabletsSupporting complex native appsAccess to the “standard” web
MOBILE APPLICATION CLIENT TYPES
Multi-Platform Requirements
MOBILE APPLICATION CLIENT TYPES
AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks   jQuery Mobile   Backbone.js   Your JS Framework....
WHAT DO YOU    MEAN WITHHTML5 + REST ?
THE MYTHICAL “HTML5”W3C Suite of Specifications   Canvas   Geolocation   WebSockets   SSE (Server-Sent Events)   CSS3   We...
AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks   jQuery Mobile   Backbone.js   Your JS Framework....
TAKE A REST...WITH JAX-RS RESTFUL ENDPOINTS   Uses HTTP standards   GET, POST, UPDATE, DELETE, etc...   Returns XML, JSON ...
REST...Uses meaningful response codes      200 OK      201 Created      400 Bad Request      404 Not Found      409 Conflict
HTML5 <3 REST
AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks   jQuery Mobile   Backbone.js   Your JS Framework....
AEROGEAR’S MOBILE WEB QUICKSTART        The HTML5 + REST example:     single page app     jQuery / jQuery mobile     JavaE...
DEMO
GOING NATIVE    as hybrid
APACHE CORDOVAperhaps known as PhoneGap...
APACHE CORDOVA1.   embedded browser in native app2.   bridge between browser and native3.   DEV => writes web app4.   pack...
DEMO
BACKBONE.JSGood structure => Four Abstractions    Collection    Model    Router    ViewDoesnt hide the DOM    since you ar...
DEMO
VANILLA.JSVanilla JS is a fast, lightweight, cross-platform framework for building              incredible, powerful JavaS...
AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks   jQuery Mobile   Backbone.js   Your JS Framework....
EXTEND JAVAEE INTO MOBILE CLIENTS!
AEROGEAROpen Source Libraries for Mobile Connectivity:      JBoss community project      Dedicated to mobile development  ...
AEROGEAR current offerings:AeroGear.jsAeroGear-iOSAeroGear.jar (Android)server components:   aerogear-controller   aerogea...
AEROGEAR.JS      internal usage of jQuery ($.ajax and $.extend)      Example:/ cet a epyppln: / rae n mt ieievrmPpln =ArGa...
DEMO
AEROGEAR.JS   ROADMAP:WebSocketMessagingData Syncclient side validation
AEROGEAR.NEXT1.   More transports (e.g. WebSocket)2.   Data Sync and Push notifications3.   OData?4.   More platforms ?   ...
THANK YOU  MATZEW AT REDHAT DOT COM           Find us:http://aerogear.org@AeroGearsIRC: #aerogearMAILING LIST   http://aer...
AEROGEAR-IOSiOS 5 - full ARC supportAFNetworking used for HTTP communicationExample:
DEMO
AEROGEAR-IOS       ROADMAP:Core Data supportData SyncWebSocket (via SocketRocket)APN
HTML alchemy: the secrets of mixing JavaScript and Java EE - Matthias Wessendorf
HTML alchemy: the secrets of mixing JavaScript and Java EE - Matthias Wessendorf
HTML alchemy: the secrets of mixing JavaScript and Java EE - Matthias Wessendorf
HTML alchemy: the secrets of mixing JavaScript and Java EE - Matthias Wessendorf
HTML alchemy: the secrets of mixing JavaScript and Java EE - Matthias Wessendorf
HTML alchemy: the secrets of mixing JavaScript and Java EE - Matthias Wessendorf
Upcoming SlideShare
Loading in...5
×

HTML alchemy: the secrets of mixing JavaScript and Java EE - Matthias Wessendorf

1,851

Published on

A deep dive on creating mobile-ready, cloud-enabled, HTML5 applications based on Java EE and modern JavaScript. You will learn how to balance and combine the enterprise Java programming model, based on APIs such as CDI, JAX-RS and EJB 3.1, with JavaScript libraries like jQuery Mobile, Backbone, Require and Underscore, while taking advantage of the ease of deployment and elasticity of the cloud.

Published in: Technology
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,851
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

HTML alchemy: the secrets of mixing JavaScript and Java EE - Matthias Wessendorf

  1. 1. JAVAEE MEETS
  2. 2. MATTHIAS WESSENDORFJBoss by Red HatMember Apache Software FoundationFormerly working at Kaazing and OracleSpeaker, Author, Blogger:http://wessendorf.netTwitter:@mwessendorf
  3. 3. AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks jQuery Mobile Backbone.js Your JS Framework...JBoss AeroGear FrameworkOutlook: AeroGear goes native
  4. 4. AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks jQuery Mobile Backbone.js Your JS Framework...JBoss AeroGear FrameworkOutlook: AeroGear goes native
  5. 5. WHAT DOESMOBILE MEAN?
  6. 6. FOR US, BASICALLY:Modern Smartphones & TabletsSupporting complex native appsAccess to the “standard” web
  7. 7. MOBILE APPLICATION CLIENT TYPES
  8. 8. Multi-Platform Requirements
  9. 9. MOBILE APPLICATION CLIENT TYPES
  10. 10. AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks jQuery Mobile Backbone.js Your JS Framework...JBoss AeroGear FrameworkOutlook: AeroGear goes native
  11. 11. WHAT DO YOU MEAN WITHHTML5 + REST ?
  12. 12. THE MYTHICAL “HTML5”W3C Suite of Specifications Canvas Geolocation WebSockets SSE (Server-Sent Events) CSS3 WebWorker Web Storageand some JavaScript APIs
  13. 13. AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks jQuery Mobile Backbone.js Your JS Framework...JBoss AeroGear FrameworkOutlook: AeroGear goes native
  14. 14. TAKE A REST...WITH JAX-RS RESTFUL ENDPOINTS Uses HTTP standards GET, POST, UPDATE, DELETE, etc... Returns XML, JSON content Annotate POJO’s for request mapping Error handling with Bean Validation CDI to tie it all together
  15. 15. REST...Uses meaningful response codes 200 OK 201 Created 400 Bad Request 404 Not Found 409 Conflict
  16. 16. HTML5 <3 REST
  17. 17. AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks jQuery Mobile Backbone.js Your JS Framework...JBoss AeroGear FrameworkOutlook: AeroGear goes native
  18. 18. AEROGEAR’S MOBILE WEB QUICKSTART The HTML5 + REST example: single page app jQuery / jQuery mobile JavaEE JAX-RS Endpoints CDI Beans and Services http://html5-aerogear.rhcloud.com/
  19. 19. DEMO
  20. 20. GOING NATIVE as hybrid
  21. 21. APACHE CORDOVAperhaps known as PhoneGap...
  22. 22. APACHE CORDOVA1. embedded browser in native app2. bridge between browser and native3. DEV => writes web app4. packages web app with the native code5. no device specific compile (of web app)6. PLUGINS: between layers! <3
  23. 23. DEMO
  24. 24. BACKBONE.JSGood structure => Four Abstractions Collection Model Router ViewDoesnt hide the DOM since you are doing web dev....lightweight, easy to start with
  25. 25. DEMO
  26. 26. VANILLA.JSVanilla JS is a fast, lightweight, cross-platform framework for building incredible, powerful JavaScript applications. http://vanilla-js.com/ :-)
  27. 27. AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks jQuery Mobile Backbone.js Your JS Framework...JBoss AeroGear FrameworkOutlook: AeroGear goes native
  28. 28. EXTEND JAVAEE INTO MOBILE CLIENTS!
  29. 29. AEROGEAROpen Source Libraries for Mobile Connectivity: JBoss community project Dedicated to mobile development HTML5 and native Facilitate all types of mobile Mobile Web Hybrid Native mobile Examples, tutorials, & community
  30. 30. AEROGEAR current offerings:AeroGear.jsAeroGear-iOSAeroGear.jar (Android)server components: aerogear-controller aerogear-security
  31. 31. AEROGEAR.JS internal usage of jQuery ($.ajax and $.extend) Example:/ cet a epyppln: / rae n mt ieievrmPpln =ArGa.ieie) a yieie eoerPpln(;/ Adacneto/ieojc: / d oncinpp betmPpln.d(poet"; yieiead"rjcs)/ Raigdt fo teyrjcs cneto: / edn aa rm h mpoet oncinmPpln.ie[poet.ed) yieieppsrjcs]ra(;
  32. 32. DEMO
  33. 33. AEROGEAR.JS ROADMAP:WebSocketMessagingData Syncclient side validation
  34. 34. AEROGEAR.NEXT1. More transports (e.g. WebSocket)2. Data Sync and Push notifications3. OData?4. More platforms ? GROW THE COMMUNITY
  35. 35. THANK YOU MATZEW AT REDHAT DOT COM Find us:http://aerogear.org@AeroGearsIRC: #aerogearMAILING LIST http://aerogear.org/community/
  36. 36. AEROGEAR-IOSiOS 5 - full ARC supportAFNetworking used for HTTP communicationExample:
  37. 37. DEMO
  38. 38. AEROGEAR-IOS ROADMAP:Core Data supportData SyncWebSocket (via SocketRocket)APN

×