mobile web app development

PhoneGap

Easy Mobile Apps with JavaScript

Monday, December 7, 2009

THANK YOU!

> var web = {};undefined> web.next();[”javascript”,”mobile”]


http://web.next

http://web.next

me.

• github.com/brianleroux• twitter.com/brianleroux

3


http://www.gartner.com/it/page.jsp?id=1126812


Mobile app dev is hard.


Device Platform FragmentationPlatform Language Notes

Apple iPhone Objective C Requires an Apple machine. Left arm.

RIM Blackberry OS Java Requires a Windows based machine. WTF.

Google Android Java (Dalvik VM) Runs mostly anywhere.

Windows Mobile .NET or unmanaged C++ Requires a Windows based machine.

Nokia Symbian C++, Java, Python, Flash, WRT

Runs mostly anywhere.

Palm WebOS HTML, CSS and JavaScript Runs mostly anywhere.


App Distribution FragmentationApple App Store Android Market Blackberry App World Nokia Ovi Store GetJar Palm App Catalog Samsung App Store LG Application Store Mobango Sony Ericsson PlayNow Windows Marketplace Vodafone App Store Java App Store Verizon VCast


Dev and distribution nightmare.


This is why the internet works.

cross platformopen standardsopen source


Cross Platform iPhoneAndroidBlackberryWindows MobileNokia Palm *Maemo*

* releasing VERY soon


HTML5

sorta


Webkit APIs

SQLiteCache ManifestCSS Transitions / Transforms / AnimationsCustom fonts


PhoneGap APIGeolocationAccelerometerNotificationsMedia playbackCameraDevice infoContactsOnline/OfflineSMS / TelephoneMagnetometer


Future APIs

File IOWebSocket

SQLite Wrapper


Free: as in freedom.

MIT Licensed


PhoneGap Philosophy

The purpose is to cease to exist.Make the web a first class dev tool.Be open, transparent and free.Adhere to standards when possible.


Sony Ericsson WebSDK

http://developer.sonyericsson.com/websdk

17




Yeah way.

GeolocationAccelerometerNotificationsMedia playbackCameraDevice infoContactsOnline/OfflineSMS / TelephoneMagnetometer

On these devices:

iPhone / iPod TouchAndroidBlackberryNokiaWindows MobilePalm webOS


Problems with the PhoneGap project

documentationapp store FUDno fucking testsmany webkit variantsperceived competitiontooling is not consolidatedsource is a bit of a gong showno standard technique for extending the project


docs.phonegap.com http://github.com/phonegap/phonegap-docs


App Store Rejections?

Rename your project.


No fucking tests?!


mobile-spec


Webkit

24


Good!sqlitecache manifestcss awesomecustom fontage

Yay Webkit!


Bad *

* many variants** not mozilla


• Blackberry less than 4.6 have no XHR

• Windows Mobile runs IE 4

• Or worse: IE 6 + 7

Ugly


The many flavours of WebkitiPhone OS 3.0 Webkit 528.16 BuildiPhone OS 2.2 Webkit 525.20 BuildiPhone OS 2.02 Webkit 525.20 BuildiPhone OS 1.5 Webkit 419.3 BuildAndroid 1.5 Webkit Nov 2008 ForkAndroid 1.1 Webkit Rev r30692Android 1.0 WebkitPalmPre OS WebkitNokia S60 Webkit ForkNokia WRT Webkit Fork


Not to mention what isn't Webkit

Blackberry Windows Mobile..........yet.


The web still rocks.

(even if the browsers do not)


Other options?Option Supported Platforms Language License

BigFive iPhone HTML, CSS and JS GPL2

LiquidGear iPhone HTML, CSS and JS* MIT

Corona iPhone Lua Proprietary

Appcelerator iPhoneAndroid

HTML, CSS and JS* Apache

Rhodes iPhoneSymbianAndroidBlackBerryWindows Mobile

HTML, CSS and JS. Ruby for native code. Accessed client/server style.

GPL3

NimbleKit iPhone HTML, CSS and JS* Proprietary

* Renders native controls via JavaScript.


PhoneGap supported devices

http://rubyurl.com/jtNs

32




Wash, Rinse, Repeat...FAIL

1. First, install all these:o iPhone SDKo Android SDKo Blackberry SDKo Windows Mobile SDKo Nokia WRT SDK

2. Download the PhoneGap source. 3. Map to each SDK.4. Copy your app into each.5. Build for each.6. Fix a bug. 7. GOTO 3.

Automation FAIL.


phonegap-dev

coming soon...


is demo time nao


Extending PhoneGap

Plugins


Many codebases.Monday, December 7, 2009

Great but how to get started?

Small screens.Less memory.Less CPU.Less hard drive space if any.Sketchy connectivity.


Constraints == Focus


JavaScript Sucks

(But it is ubiquitous.)


jQuery / Dojo / YUI / MooTools


XUI

2.2 kb


XUI + Emile


Good enough.

DOM / Event / Style / XHR / FX


What about UI components?


FUCK UI components.


Apps built w/ components look like it.


Solve your unique problem.

goals > features


Tapbots, for example.


Fuck components. Especially native components.

This is the modern equivalent of Outlook Express.


Solve your unique problem.

And you will do it better than a generic solution.


Maybe you don't even need native features?

Use a mobile specific stylesheet.Progressive enhancement of functionality w/ js.


The Future


More devices.Monday, December 7, 2009

OMTP BONDI

Spec.


W3C Device API Group


Get involved.

• code: github.com• docs: docs.phonegap.com / wiki.phonegap.com• test: mobile-spec

• blog about it• tweet about it!• tell your mom about it (I already did)• help on mailing list

57


Now... go write some apps!*http://phonegap.comhttp://groups.google.com/group/phonegap

Brian [email protected]://twitter.com/brianleroux

* After beers. Ideally at least 12 hours after beers.


mobile web app development

Technology

mobile app dev

app store rejections

windows mobile net

webkit rev r30692android

xhr windows mobile runs

phonegap source

windows basedmachine

phonegap easy mobile