Your SlideShare is downloading. ×
0
DjangoSki!

DjangoSki
Brian LeRoux




• Nitobi Software,Vancouver
• Mostly JavaScript things
Welcome to the
Hockey’s Golden city!
Don’t go farther north
Things I’m working on

• PhoneGap
• XUI
• Lawnchair
WTF dude
BEER!
Also mobile
6 billion people on the planet
1 billion television sets
3 billion web enabled mobile devices
...?
profit!
Apps for that

• Mobile Web Apps
• Native Apps
• Hybrid Apps
The Mobile Web

• Growing stupid fast
• Tech is also moving stupid fast
• A whole new clusterfuck of browsers
Mobile Browsers

• Many flavors of WebKit
• Blackberry and IE Mobile
• Fennic!
Not to mention

• Fucked up screen sizes
• Bizzare pixel density
• ...and basically complete shit for cpus,
  memory and s...
Sweet.
Constraints === Focus
       • Know your demographic
       • Choose your target platforms
       • ...?
       • Profit!
DOM concerns


• What does your target browser support?
• Offline capable? storage / cache manifest
Backend Arch

• RESTful JSON
• favor parse to eval btw
• Use local storage or device api for file i/o
  to cache data as mu...
front end solutions

• jqTouch
• Dashcode
• iUI
• mobify.me
Native Apps
Apple iPhone OS .............................. Obj C
RIM Blackberry ................................. Java
Goo...
Fuck. That.
PhoneGap

• HTML, CSS and JavaScript
• Device APIs
• ...and one more thing
We got a pony too
two of em.
Typical Architecture

• www folder
• single index.html file that loads static assets
• remoting via xhr/json-p
• oh ya: ico...
Protip


• The architecture of a hybrid app is
  strikingly similar to that of a W3C Widget
Device APIs
• Geolocation
• Accelerometer
• Telephony
• Media
• Magnometer
• Camera
• Contacts
Protip #2


• Device APIs are being standardized by the
  W3C DAP Group and OTMP BONDI
API Examples


• demo time nao
Geolocation
Accelerometer
Camera
Contacts
PhoneGap Futures

• 1.0 is very soon
• better tests in mobile-spec
• build tooling
• widget spec compliance
But! Web apps suck?

• Yes.
• But there are libs for that.
• Or quit your bitching and just wait for
  better phones.
The DOM is broken
But it is possibly a little better on mobile.
Desktop JavaScript
  Frameworks



   An embarrassing mess.
XUI

• jQuery work-alike
• simple api
• 2-3kb
• Admittedly a shitty name
Demo Time!

• selectors
• events
• style
• fx
• xhr
XUI Future

• 1.0 coming soon
• Build tooling based on RequireJS
• Support for ALL mobile browsers
Going offline

• Web apps: Cache Manifest
• Hybrid apps: Reachability API
• DOM storage
• SQLite
Cache Manifest Example
Reachability Example
DOM Storage Example
SQLite Example
Ghetto, actually
• DOM Storage is key/value only. Slightly
  nicer than cookies but way lamer name.
• SQLite seems like a ...
How about a Lawnchair?
Lawnchair quickly

• JSON document store (not key/value)
• Designed for mobile; very light
• Clean and simple async oo api...
Some code, eh


• demoooo
Lawnchair Futures

• 1.0 is REAL SOON I FUCKING PROMISE
• Adaptors abstracted into a RequireJS build
• Some actual benchma...
Closing rant
• App stores are sanitized and walled
  gardens. The content is dictated.
• 30% for the ability to sell is co...
Also


• wtfjs.com
• but don’t worry about javascript, eh
Thanks, eh
brian@nitobi.com
http://westcoastlogic.com
http://twitter.com/brianleroux
http://brianleroux.github.com
DjangoSki
DjangoSki
DjangoSki
Upcoming SlideShare
Loading in...5
×

DjangoSki

2,076

Published on

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,076
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
18
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide























































  • Transcript of "DjangoSki"

    1. 1. DjangoSki! DjangoSki
    2. 2. Brian LeRoux • Nitobi Software,Vancouver • Mostly JavaScript things
    3. 3. Welcome to the Hockey’s Golden city!
    4. 4. Don’t go farther north
    5. 5. Things I’m working on • PhoneGap • XUI • Lawnchair
    6. 6. WTF dude
    7. 7. BEER!
    8. 8. Also mobile
    9. 9. 6 billion people on the planet 1 billion television sets 3 billion web enabled mobile devices ...? profit!
    10. 10. Apps for that • Mobile Web Apps • Native Apps • Hybrid Apps
    11. 11. The Mobile Web • Growing stupid fast • Tech is also moving stupid fast • A whole new clusterfuck of browsers
    12. 12. Mobile Browsers • Many flavors of WebKit • Blackberry and IE Mobile • Fennic!
    13. 13. Not to mention • Fucked up screen sizes • Bizzare pixel density • ...and basically complete shit for cpus, memory and storage
    14. 14. Sweet.
    15. 15. Constraints === Focus • Know your demographic • Choose your target platforms • ...? • Profit!
    16. 16. DOM concerns • What does your target browser support? • Offline capable? storage / cache manifest
    17. 17. Backend Arch • RESTful JSON • favor parse to eval btw • Use local storage or device api for file i/o to cache data as much as possible • Update apps through the various stores
    18. 18. front end solutions • jqTouch • Dashcode • iUI • mobify.me
    19. 19. Native Apps Apple iPhone OS .............................. Obj C RIM Blackberry ................................. Java Google Android ................................ Java Symbian / Maemo (Nokia) ............. * Palm webOS ..................................... Web Windows Mobile ............................. .NET
    20. 20. Fuck. That.
    21. 21. PhoneGap • HTML, CSS and JavaScript • Device APIs • ...and one more thing
    22. 22. We got a pony too
    23. 23. two of em.
    24. 24. Typical Architecture • www folder • single index.html file that loads static assets • remoting via xhr/json-p • oh ya: icon, loading screen
    25. 25. Protip • The architecture of a hybrid app is strikingly similar to that of a W3C Widget
    26. 26. Device APIs • Geolocation • Accelerometer • Telephony • Media • Magnometer • Camera • Contacts
    27. 27. Protip #2 • Device APIs are being standardized by the W3C DAP Group and OTMP BONDI
    28. 28. API Examples • demo time nao
    29. 29. Geolocation
    30. 30. Accelerometer
    31. 31. Camera
    32. 32. Contacts
    33. 33. PhoneGap Futures • 1.0 is very soon • better tests in mobile-spec • build tooling • widget spec compliance
    34. 34. But! Web apps suck? • Yes. • But there are libs for that. • Or quit your bitching and just wait for better phones.
    35. 35. The DOM is broken But it is possibly a little better on mobile.
    36. 36. Desktop JavaScript Frameworks An embarrassing mess.
    37. 37. XUI • jQuery work-alike • simple api • 2-3kb • Admittedly a shitty name
    38. 38. Demo Time! • selectors • events • style • fx • xhr
    39. 39. XUI Future • 1.0 coming soon • Build tooling based on RequireJS • Support for ALL mobile browsers
    40. 40. Going offline • Web apps: Cache Manifest • Hybrid apps: Reachability API • DOM storage • SQLite
    41. 41. Cache Manifest Example
    42. 42. Reachability Example
    43. 43. DOM Storage Example
    44. 44. SQLite Example
    45. 45. Ghetto, actually • DOM Storage is key/value only. Slightly nicer than cookies but way lamer name. • SQLite seems like a bad idea: schemas, migrations, impedance mismatch, oh my.
    46. 46. How about a Lawnchair?
    47. 47. Lawnchair quickly • JSON document store (not key/value) • Designed for mobile; very light • Clean and simple async oo api • Adaptor pattern for store customization
    48. 48. Some code, eh • demoooo
    49. 49. Lawnchair Futures • 1.0 is REAL SOON I FUCKING PROMISE • Adaptors abstracted into a RequireJS build • Some actual benchmarks • PhoneGap File I/O adaptor
    50. 50. Closing rant • App stores are sanitized and walled gardens. The content is dictated. • 30% for the ability to sell is corporate greed at its worst. • Requiring provisioning to build code on a device you own is unethical. • This should not be tolerated by developers: speak out!
    51. 51. Also • wtfjs.com • but don’t worry about javascript, eh
    52. 52. Thanks, eh brian@nitobi.com http://westcoastlogic.com http://twitter.com/brianleroux http://brianleroux.github.com
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.

    ×