Building a clone of WhatsApp with Grails, Cordova and AeroGear

Or "how worth potentially 19 billions of Dollars"

Corinne Krych

@corinnekrych alias Athos




Sebastien Blanc

alias Aramis


@sebi2706
scm.blanc@gmail.com
https://github.com/sebastienblanc

What is WhatsApp ?

A Cross-platform mobile messaging app


No login

Uses your Device Phone book

Push Notification

It's free

So let's build a Clone !


Using our favorite tools !

Backend should be easy to develop


Please Mister Grails do a step forward

The Mobile App should be scaffolded for more than 80%


Please Mister Grails do a step forward

The Mobile App should have a single code base for all the platforms


Please Mister Cordova do a step forward

Mobile Application should be able to access native features (Contacts)


Please Mister Cordova do a step forward

Sending Push Notifications should be easy as Pie


Please Mister AeroGear do a step forward

Local Storage should be encrypted


Please Mister AeroGear do a step forward

Grails


Awesome Framework

Why ?


  • RAD : KISS DRY COC
  • Scaffolds all the Things !
  • REST support
  • Modern Mobile scaffolding
  • Integrate Push Nofification using the dedicated plugin
  • Easy to integrate with Cordova!

Cordova


Apache Cordova

What's for?


  • Embedded Browser in a native app
  • Embedded Browser in a native app
  • Bridge between JavaScript and native features
  • Implement in JS once and deploy everywhere
  • One line to compile for all the platforms
  • Easy to extend with plugins!

Some magic in 4 commands




    cordova create greach

    cordova platform add ios

    cordova plugin add ../../aerogear-pushplugin-cordova

    cordova build

Integrate Push Notifications


AeroGear UnifiedPush Server

AeroGear Push

Send push notifications to any device, regardless of platform or network (APNs, GCM, SimplePush).

AeroGear Push Notifications



  • Short Messages to ... notify!
  • No connection to maintain: save your batteries
  • Device registers to the UPS
  • UPS admin to monitor
  • Unified Client Libraries to send messages
  • Cordova Aerogear Push Plugin

AeroGear Push

DataManager & Store

Persistence abstraction

  • JS diversities
  • encrypted version for each store

Store in JavaScript

// Create an Empty DataManager
var dm = AeroGear.DataManager(),
     // Create a new Crypto object to use
     agcrypto = AeroGear.Crypto(),
          idb;
 
 // Add an WebSQL store
 dm.add({
      name: "idb",
     type: "WebSQL",
     settings: {
       auto: true, 
         // New crypto options for DataManager
         crypto: {
             agcrypto: agcrypto,
             options: {
                 key: "password"
             }
         }
     }
 });
 
idb = dm.stores.idb;
idb.save({id:12,creditCard:"45454545454"});
                            ;

Thanks!