Creating Hybrid Apps with Phonegap

What I will cover

● What is Phonegap?● Pros & Cons● Phonegap App Example● Tools used to create app

Technology Magpie >> A geek often distracted by ALL THE THINGS..

Citation: European Magpies unlike Aussie ones, collect shiny objects

She Hacks v1.0

iOS 6 +4.2 (Jelly Bean) +

● a framework for building cross-platform mobile apps with web technologies

● Javascript APIs● Actively maintained by

Adobe● Opensource● leader in the cross-

platform tools space

What is PhoneGap?

PhoneGap Pros

● Easy for web developers● Reduced development costs● Write once, run anywhere ● Open source

PhoneGap Cons

● Not suitable for all types of apps (think high end graphics & 3D Support)

● Not all native features are supported● App might not run as fast

She Hacks App...

● Single Page Angular JS App● Asynchronous WS with Promises● HTML5 LocalStorage for data

caching● SASS for css variables and

mixins● Grunt for CSS & JS pre-

processing● PhoneGap APIs used for

○ Network connectivity detection

Front End Architecture

$ phonegap build ios

UI Frameworks

Web Services

● RESTful web services ● Built in Scala on the Play

Framework● MongoDB database for JSON

objects

○ Driver was fully Non-

Blocking and asynchronous

● Deployed to Heroku

Summary

● App built in 4 weeks, in spare time● Making the app look good took a long

time● Heroku rocked - easy to use● PhoneGap had some fiddly parts but in

general was easy to work with - would choose again

Fork Us

Back end:github.com/rowdyrabbit/eventapp

Front end:github.com/georgiknox/sheHacksApp

www.GeekGirl.io

@GeorgiKnox

@CatRapture