This document summarizes a presentation about developing mobile applications using HTML5, REST, and JavaScript frameworks. It discusses using JAX-RS to create RESTful endpoints in Java EE that return JSON/XML, and consuming those endpoints from HTML5 web apps or hybrid mobile apps built with Apache Cordova. It also introduces the AeroGear framework for extending Java EE functionality to mobile clients and facilitating mobile development. Demos are provided of AeroGear.js, Backbone.js, and the AeroGear-iOS library. The roadmap includes adding support for WebSockets, data syncing, and push notifications across the AeroGear projects.
2. MATTHIAS WESSENDORF
JBoss by Red Hat
Member Apache Software Foundation
Formerly working at Kaazing and Oracle
Speaker, Author, Blogger:
http://wessendorf.net
Twitter:
@mwessendorf
3. AGENDA
Mobile: some background
HTML5
JavaEE -> JAX-RS
JavaScript Frameworks
jQuery Mobile
Backbone.js
Your JS Framework...
JBoss' AeroGear Framework
Outlook: AeroGear goes native
4. AGENDA
Mobile: some background
HTML5
JavaEE -> JAX-RS
JavaScript Frameworks
jQuery Mobile
Backbone.js
Your JS Framework...
JBoss' AeroGear Framework
Outlook: AeroGear goes native
16. THE MYTHICAL “HTML5”
W3C Suite of Specifications
Canvas
Geolocation
WebSockets
SSE (Server-Sent Events)
CSS3
WebWorker
Web Storage
and some JavaScript APIs
17. AGENDA
Mobile: some background
HTML5
JavaEE -> JAX-RS
JavaScript Frameworks
jQuery Mobile
Backbone.js
Your JS Framework...
JBoss' AeroGear Framework
Outlook: AeroGear goes native
18. 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
22. AGENDA
Mobile: some background
HTML5
JavaEE -> JAX-RS
JavaScript Frameworks
jQuery Mobile
Backbone.js
Your JS Framework...
JBoss' AeroGear Framework
Outlook: AeroGear goes native
23. 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/
27. APACHE CORDOVA
1. embedded browser in native app
2. bridge between browser and native
3. DEV => writes web app
4. packages web app with the native code
5. no device specific compile (of web app)
6. PLUGINS: between layers!
<3
29. BACKBONE.JS
Good structure => Four Abstractions
Collection
Model
Router
View
Doesn't hide the DOM
since you are doing web dev....
lightweight, easy to start with
31. VANILLA.JS
Vanilla JS is a fast, lightweight, cross-platform framework for building
incredible, powerful JavaScript applications.
http://vanilla-js.com/
:-)
32. AGENDA
Mobile: some background
HTML5
JavaEE -> JAX-RS
JavaScript Frameworks
jQuery Mobile
Backbone.js
Your JS Framework...
JBoss' AeroGear Framework
Outlook: AeroGear goes native
34. AEROGEAR
Open 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
36. AEROGEAR.JS
internal usage of jQuery ($.ajax and $.extend)
Example:
/ cet a epyppln:
/ rae n mt ieie
vrmPpln =ArGa.ieie)
a yieie eoerPpln(;
/ Adacneto/ieojc:
/ d oncinpp bet
mPpln.d(poet";
yieiead"rjcs)
/ Raigdt fo te'yrjcs cneto:
/ edn aa rm h mpoet' oncin
mPpln.ie[poet'.ed)
yieiepps'rjcs]ra(;