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

  • 1,659 views
Uploaded 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 …

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.

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
1,659
On Slideshare
0
From Embeds
0
Number of Embeds
1

Actions

Shares
Downloads
0
Comments
0
Likes
4

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. JAVAEE MEETS
  • 2. MATTHIAS WESSENDORFJBoss by Red HatMember Apache Software FoundationFormerly working at Kaazing and OracleSpeaker, Author, Blogger:http://wessendorf.netTwitter:@mwessendorf
  • 3. AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks jQuery Mobile Backbone.js Your JS Framework...JBoss AeroGear FrameworkOutlook: AeroGear goes native
  • 4. AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks jQuery Mobile Backbone.js Your JS Framework...JBoss AeroGear FrameworkOutlook: AeroGear goes native
  • 5. WHAT DOESMOBILE MEAN?
  • 6. FOR US, BASICALLY:Modern Smartphones & TabletsSupporting complex native appsAccess to the “standard” web
  • 7. MOBILE APPLICATION CLIENT TYPES
  • 8. Multi-Platform Requirements
  • 9. MOBILE APPLICATION CLIENT TYPES
  • 10. AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks jQuery Mobile Backbone.js Your JS Framework...JBoss AeroGear FrameworkOutlook: AeroGear goes native
  • 11. WHAT DO YOU MEAN WITHHTML5 + REST ?
  • 12. THE MYTHICAL “HTML5”W3C Suite of Specifications Canvas Geolocation WebSockets SSE (Server-Sent Events) CSS3 WebWorker Web Storageand some JavaScript APIs
  • 13. AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks jQuery Mobile Backbone.js Your JS Framework...JBoss AeroGear FrameworkOutlook: AeroGear goes native
  • 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. REST...Uses meaningful response codes 200 OK 201 Created 400 Bad Request 404 Not Found 409 Conflict
  • 16. HTML5 <3 REST
  • 17. AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks jQuery Mobile Backbone.js Your JS Framework...JBoss AeroGear FrameworkOutlook: AeroGear goes native
  • 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. DEMO
  • 20. GOING NATIVE as hybrid
  • 21. APACHE CORDOVAperhaps known as PhoneGap...
  • 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. DEMO
  • 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. DEMO
  • 26. VANILLA.JSVanilla JS is a fast, lightweight, cross-platform framework for building incredible, powerful JavaScript applications. http://vanilla-js.com/ :-)
  • 27. AGENDAMobile: some backgroundHTML5JavaEE -> JAX-RSJavaScript Frameworks jQuery Mobile Backbone.js Your JS Framework...JBoss AeroGear FrameworkOutlook: AeroGear goes native
  • 28. EXTEND JAVAEE INTO MOBILE CLIENTS!
  • 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. AEROGEAR current offerings:AeroGear.jsAeroGear-iOSAeroGear.jar (Android)server components: aerogear-controller aerogear-security
  • 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. DEMO
  • 33. AEROGEAR.JS ROADMAP:WebSocketMessagingData Syncclient side validation
  • 34. AEROGEAR.NEXT1. More transports (e.g. WebSocket)2. Data Sync and Push notifications3. OData?4. More platforms ? GROW THE COMMUNITY
  • 35. THANK YOU MATZEW AT REDHAT DOT COM Find us:http://aerogear.org@AeroGearsIRC: #aerogearMAILING LIST http://aerogear.org/community/
  • 36. AEROGEAR-IOSiOS 5 - full ARC supportAFNetworking used for HTTP communicationExample:
  • 37. DEMO
  • 38. AEROGEAR-IOS ROADMAP:Core Data supportData SyncWebSocket (via SocketRocket)APN