#NammaJUDCon. This presentation explains the concepts and featues of the AeroGear Mobile development project. The project is part of the JBoss community This was presented at the JBoss Users and Developers Conference(JUDCon), Jan 2014, Bangalore

1. 1

2. Gearing Up for Mobile
Development with AeroGear
Prajod Vettiyattil
@prajods
in.linkedin.com/in/prajod
2
Naveen Raj Balasubramaniam
@Naveenrajbala
in.linkedin.com/in/naveenraj

3. Agenda
A walk with AeroGear
Simplify mobile development
Front end development support
Server side development support
The Road Ahead
Summary
3

4. A walk with AeroGear
4

5. Mobile Development Framework
Local Data
Management
User Interaction
Management
Authentication /
Authorization
Communication
Framework
Native API handler
Patch / Version
Management
Management
Monitoring
UI Framework
Data
Management
Request
Processing
Authentication /
Authorization
Device Variant
Management
Communication
Framework
Metering /
Billing
Patch / Version
Management
Monitoring
Management
Server side Framework
5
User / Device
Registration

6. Mobile Development Framework
AeroGear features
Local Data
Management
User Interaction
Management
Authentication /
Authorization
Communication
Framework
Native API handler
Patch / Version
Management
Management
Monitoring
UI Framework
Data
Management
Request
Processing
Authentication /
Authorization
Device Variant
Management
Communication
Framework
Metering /
Billing
Patch / Version
Management
Monitoring
Management
Server side Framework
6
User / Device
Registration

7. Mobile web Development
There many mobile
phone operating systems
in the market.
7

8. And there are Frameworks
•
•
There are lot of technologies for every platform
Native and non–native technologies
8

9. Overview of AeroGear
AeroGear is for mobile development
• A set of libraries
•
•
•
•
Android library, iOS library, JavaScript Library
AeroGear Connectivity
AeroGear Controller, Security
AeroGear Persistence
• Unified approach to development
• Multi-platform support
• Out of the box push notification and
security
9

10. Browser support in Aerogear
Currently AeroGear supports the following desktop
web browsers
• Firefox
• Chrome
• IE
• Safari
Currently AeroGear Supports the following mobile web
browsers.
• Android Browser
• Safari
In General all the web browsers with html5 support
will support Aerogear apps too
10

11. Mobile development options
Option 1: Mobile Browser app
Mobile Brower
HTML5,
CSS3, JS
11
• Mobile browser app(web
app)
• HTML5 + CSS3 +
javascript
• Most portable
• Platform independent
code
• No access to native
APIs

12. Mobile development options
Option 2: Native App
• Native apps
Native App
Native Device
APIs
12
• Platform dependent
• Uses native APIs
• Most powerful, least
portable
• Most popular among
users
• Best user experience

13. Mobile development options
Option 3: Hybrid App
• Hybrid apps, plugins
Native Shell
Mobile Brower
HTML5, CSS3,
JS
Bridge code
Native Device APIs
13
Developed as web apps
Deployed and run as native apps
Javascript calls the bridge code
Plugins for direct access to native
APIs
• Looks like a native app
• Has limitations in accessing native
APIs
• Cordova, PhoneGap, Appcelerator,
Sencha
•
•
•
•

14. Comparing the options
Mobile Brower
Native Shell
Mobile Brower
Native App
HTML5,
CSS3, JS
HTML5, CSS3,
JS
Bridge code
Native Device
APIs
Browser only
14
Native Device APIs
Native only
Hybrid(browser+native)

15. Which option is AeroGear for ?
• Primarily
• Client-server type of apps
• Browser only apps
• Hybrid apps
• Also
• Native apps
• The communication and server side
features
15

16. Simplify mobile development
with AeroGear
16

17. AeroGear Mobile Development
Aerogear makes front end development easier and
unified in the following platforms
• Android
• iOS
• Mobile web
For the server side, AeroGear touches the following areas
• Push Notification (Android, JS, iOS)
• Security
• More coming up…
17

18. Unified Development
Libraries for different platforms
• Java for Android
• JavaScript for web browsers
• Objective-C for iOS
• Unified approach
• Single application for multiple Mobile platforms
• Same deployment can be viewed by both mobile device
browsers and desktop browsers
18

19. Push Notification
Notifications are a popular method of communication
Push = messaging
from Server side
The why and how of notification
• Alert apps about events, updates
• High scalability
• Lightweight messages
App 7
Server
Push
Service
Push
19

20. Push: The platform concept
Push
Servers
20

21. Security
Authentication
Authorization
• OTP: One Time Password
• HTTPS: SSL
• General: username /password (encrypted transmission)
• Single Sign On
• Federated Identity Management using external Identity
Managers
21

22. Support for
front end development
22

23. User Interface Development
• UI Coding: Use HTML 5, CSS3 and
Javascript
• aerogear.js: javascript library
• REST: used for communications
23

24. AeroGear Development
Communication and Storage
Pipe
•
•
A connection made to the server
Connectivity to asynchronous data sources
Pipeline
pipe
Pipeline
•
•
A wrapper for a set of pipes
Has management features for pipes
DataManager
•
•
•
Data connections
Data models
Data connection is represented as a Store
Store
•
•
24
Data Stores on the mobile platform
Eg: SQLite(iOS, Android), Web Storage(HTML5)
Data Manager
iOS
Store
Android
Store
Web
Store

25. JavaScript Development
Creating Pipeline and Pipes
Instantiate a Pipeline
Add pipes to the Pipeline
Name
URL
Using Data Manager and Store
Instantiate a DataManager
Adding stores to the DataManager
25
Type

26. JavaScript Development
Creating Pipeline and Pipes
var memberPipe = AeroGear.Pipeline([{
name: “2014",
settings: {
baseURL: “JUDCon/“
}
}
]).pipes.members;
The pipe’s URL will then look like:
URL
Instantiate a data manager
var dataManager = AeroGear.DataManager(
"membersStore" ),
MemberStore =
dataManager.stores["membersStore"];
26
pipe’s name
http://localhost/application_name/JUDCon/2014
Using Data Manager and Store
Assign a store
Instantiate a pipe
//Create a custom local store
var dManage =
AeroGear.DataManager({
name: "mySessionStorage",
type: "SessionLocal",
id: "customID"
});

27. Android Development
Pipeline and Pipes
public class MyActivity extends ListActivity {
Pipeline pipeline;
void onCreate() {
pipeline = new Pipeline("http://www.judcon.com");
pipeline.pipe(Car.class);
}
Pipeline
Operations
•
•
•
•
Read
Save
Update
Remove
void onStart() {
LoaderPipe<Car> pipe = pipeline.get("car", this);
pipe.read(new MyCallback());
}
}
27

28. Android Development contd…
SQLStore
Memory Store
28
Operations
StoreConfig sqlStoreConfig = new StoreConfig();
sqlStoreConfig.setContext(getApplicationContext());
sqlStoreConfig.setType(SQL);
sqlStoreConfig.setKlass(Data.class);
Store store = dataManager.store("sqlStore",
sqlStoreConfig);
((SQLStore))store).open(/*callback*/);
•
•
•
•
•
Read
Save
Remove
Filter
Reset
StoreConfig memoryStoreConfig = new StoreConfig();
memoryStoreConfig.setContext(getApplicationContext());
memoryStoreConfig.setType(MEMORY);
memoryStoreConfig.setKlass(Data.class);
Store store = dataManager.store("memoryStore", memoryStoreConfig);

29. iOS Development
Pipeline and Pipes
// NSURL object:
NSURL* serverURL = [NSURL URLWithString:@"http://todoaerogear.rhcloud.com/todo-server/"];
Pipeline
Operations
•
•
•
•
29
Read
Save
Update
Remove
// create the 'todo' pipeline, which points to the baseURL
of the REST application
AGPipeline* todo = [AGPipeline
pipelineWithBaseURL:serverURL];
// Add a REST pipe for the 'projects' endpoint
id<AGPipe> projects = [todo pipe:^(id<AGPipeConfig>
config) {
[config setName:@"projects"];
// this is the default, can be emitted
[config setType:@"REST"];
}];

30. iOS Development contd…
SQLite
Memory Store
30
// create the datamanager
AGDataManager* dm = [AGDataManager manager];
// add a new (default) store object:
id<AGStore> store = [dm store:^(id<AGStoreConfig>
config) {
[config setName:@"tasks"];
[config setType:@"SQLITE"];
}];
Data
Operations
•
•
•
•
•
Read
Save
Remove
Filter
Reset
// create the datamanager
AGDataManager* dm = [AGDataManager manager];
// add a new (default) store object:
id<AGStore> myStore = [dm store:^(id<AGStoreConfig> config) {
[config setName:@"tasks"];
}];

31. The server side components
AeroGear Controller
AeroGear Security
UnifiedPush
31

32. AeroGear Controller
What is the AeroGear Controller ?
• A lean MVC implemented in java
• Routes HTTP requests to plain Java Object endpoint, and
handles the results
• Can be deployed on any container supporting CDI(Context and
Dependency Injection)
public class Routes extends AbstractRoutingModule {
@Override
public void configuration() {
route()
.from("/").roles("admin")
.on(RequestMethod.GET)
.consumes(JSON)
.produces(JSP, JSON)
.to(Home.class).index();
}
}
32

33. AeroGear Controller continued…
Routes
public class Routes extends AbstractRoutingModule {
@Override
public void configuration() {
route()
.from("/").roles("admin")
.on(RequestMethod.GET)
.consumes(JSON)
.produces(JSP, JSON)
.to(Home.class).index();
}
}
33

34. AeroGear Controller continued…
Pagination
•
•
If a page is too long for the screen
Returns a limited number of elements
Sample code returning a page in AeroGear controller, with pagination
route()
.from("/cars")
.on(RequestMethod.GET)
.produces(JSON)
.to(Cars.class).findCarsBy(param(PaginationInfo.class), param("color"));
Error Handling
route()
.on(YourException.class)
.to(ExceptionHandler.class).errorPage();
34

35. Push Notification: Registration
1
2 User
Developer
Push Notification Server
Application
Registration
Storage
Sender
JBoss AS backend server
35

36. Push Notification: Runtime
Push Notification
Server
5
Application
Registration
Simple Push
Storage
4
Sender
GCM
APN
3
JBoss AS backend server
36

37. Push for web clients
http
37

38. Push for Android
XMPP
38

39. Push for iOS
39

40. Push Notification: feature list
AeroGear Unified Push Notification Server
App 7
• Single unified push notification
• Single server for multiple apps and mobile platforms
• Currently supports Google Cloud Messaging, Apple
Push Notification
• Web push based on Mozilla’s Simple Push
Unified Push Administration Console
•
•
•
•
40
A single place to manage configurations
Register new push apps
Register variants of platforms
Currently supported: Android, iOS and Simple push
variants

41. Security
Hawk
Java OTP
PicketLink
iOS OTP
Shiro
41

42. Security
AeroGear Security Implementation
• Providing integration with security providers like
PicketLink, Shiro
• Completely decoupled from the AeroGear controller
import org.jboss.aerogear.controller.spi.SecurityProvider;
public class AeroGearSecurityProvider implements SecurityProvider {
@Inject
private IdentityManagement identityManagement;
@Override
public void isRouteAllowed(Route route) throws ServletException {
if (!identityManagement.hasRoles(route.getRoles())) {
throw new AeroGearSecurityException(HttpStatus.AUTHENTICATION_FAILED);
}
}
42
}

43. Security: Filters and HSTS
Filters
• A security mechanism with many applications
• Eg: prevent ClickJacking
HSTS
• HTTP Strict Transport Security
• Force https usage
• Optional in AeroGear
43

44. Security: OTP
AeroGear OTP
• One time password
• Increased security while executing transaction
• OTP and AeroGear Security can be used together or
separately
// Get a user’s otp
// verify the user’s otp
public class Otp {
public User otp(SimpleUser user, String otp) {
@Inject
@Secret
private Instance<String> secret;
Totp totp = new Totp(secret.get());
boolean result = totp.verify(otp);
if (!result)
throw new RuntimeException("Invalid OTP");
@Inject
@LoggedUser
private Instance<String> loggedInUserName;
return user;
}
public String secret() {
return new
Totp(secret.get()).uri(loggedInUserName.get());
}
44
}

45. The Road Ahead
45

46. Road Ahead
Browser Support
•
•
•
Windows Mobile
Mobile Chrome
Opera Mobile and Desktop
Push Notification
•
•
46
MQTT
STOMP

47. Summary
• What is Aerogear
• Supported platforms
• Front end development
• AeroGear Libraries for each platform
• Server side development
• AeroGear Push Notification
• AeroGear Security
47

48. Useful Links
AeroGear References
• http://aerogear.org
External References
• http://www.markus-falk.com/mobile-frameworks-comparisonchart/
• http://www.infoq.com/articles/javaee-mobile-applicationdevelopment-aerogear
• http://www.slideshare.net/lfryc/the-gear-you-need-to-gomobile-with-java-enterprise
• http://www.slideshare.net/jaxlondon2012/html-alchemy-thesecrets-of-mixing-javascript-and-java-ee
• http://www.ohloh.net/p?ref=homepage&q=aerogear
48

49. Thank You
@prajods
@Naveenrajbala
Start Gearing…
49