FUTUREPROOF MOBILE
Nikolai Onken / @nonken
October 9th, 2011
OMG THANX <3
Some of the dark past
Nokia WRT - <3 HTML!
VF 360
What changed?
The iPhone brought the first a-class browser to mobile
And then there were beers
PhoneGap FTW - http://phonegap.com
The second goal of PhoneGap is for the project to cease to exist
Status quo - demos
Lets get started
- Runtimes
- Libraries / Mobile architectures
- Testing
- Other tools
bonus
- I will cover much of this in more detail on wednesday, come by if you want to start writing code
Runtimes omg
Don't cover all, stick to:
Poll
How many of you have written an app for iOS?
How many of you have written an app for Android?
How many of you have written an app for WebOS?
How many of you have written an app for BlackBerry?
Mobile devs can throw away a lot of baggage
Use libraries - BUT think of them like:
So you can optimize the hell out of it:
Mobile frameworks, some things I love
EmbedJS / embedjs.org
Work with features and consistent APIs. Don't branch your code to gap platform differences
Not cool
How you roll
Example
and 
Directory structure
Feature implementation
and 
Feature mapping
Developing with features
Two ways you can run a build
- Ship everything and do feature tests at runtime
- Make targeted builds using specific implementations
Runtime detection (perfect for dev)
Build for deployment
Feature demo
has.js / https://github.com/phiggins42/has.js/
Backbone is not a framework, its awesome little tools for ya
Backbone events
Backbone models / collections
Backbone views
Backbone router <3
Only top secret demos, check backbone site for impressive stuff
Mobile testing
Rules of thumb
- Test on the desktop for as long as you can
- Use webinspector, firebug, etc. to verify that stuff works
- Test in the browser on the device
- Test the built version of your app, on the desktop
- Test the built version on the device
- Package and test the package if you need to
- Again test as long as you can on the device, but don't forget to reference check regularly on the device
Weinre - http://phonegap.github.com/weinre
Weinre demo
alert() - oh noes
Other cool stuff
Zeon - http://zeonjs.com / https://github.com/qfox/zeon
Ripple - http://ripple.tinyhippos.com
Distimo app store analytics - http://distimo.com
Extend PhoneGap like hell - lets watch some video
http://humanapi.org (I am not really maintaining it :( )
The future?
Thank you for having me here
Credits:
- http://www.flickr.com/photos/marilink/4120848656
- http://www.flickr.com/photos/tacoekkel/25538919
- http://www.flickr.com/photos/hugo90/3916794427