Hello, Jo! Introduction to this lightweight HTML5 mobile app framework
•Download as KEY, PDF•
4 likes•3,065 views
Jo is a small (~12K gzipped) JavaScript framework for making cross-platform mobile apps. It supports iOS, Android, webOS, BlackBerry, Symbian, Adobe Air, and even OSX Dashboard apps. It is compatible with PhoneGap, fast, and easy to learn.
More Related Content
Similar to Hello, Jo! Introduction to this lightweight HTML5 mobile app framework
Similar to Hello, Jo! Introduction to this lightweight HTML5 mobile app framework (20)
Recently uploaded
Recently uploaded (20)
Hello, Jo! Introduction to this lightweight HTML5 mobile app framework
- 1. Hello, Jo! The Lightweight HTML5 Mobile App Framework Dave Balmer JSConf 2011 Portland
- 2. Introduction The “hello” part of my talk.
- 3. Who the Hell am I? • Programmer for 34 years • Occasional designer wanna-be • JavaScript freak (since 2004) • Open Source Community noob • Living proof that getting a little kid addicted to programming might not be a “good thing”
- 4. What the Hell is Jo? • JavaScript lovin’ mobile app framework • Touchable, tappable UI widgets • Simple data layer • Smallish footprint, ~12K gzipped • Plays with PhoneGap for iOS, Android, webOS, BlackBerry &
- 5. Jo with Browsers, Desktop Widgets, Your JS App Jo webkit • Works alongside other libs • Doesn’t force you to use it for everything
- 6. Jo with iOS/Android PhoneGap PhoneGap Your JS App Jo webkit • PhoneGap acts as a WebView wrapper • Your code is about the same
- 7. Jo & PhoneGap on webOS and Your JS App PhoneGap Jo webkit • PhoneGap acts as a compatibility layer • And your code is still about the
- 8. ...And it’s Open Source (of course, of course) • FreeBSD license • Hosted on GitHub • Looking for more code contributors
- 9. Philosophy Jo is made from a few of my favorite things.
- 10. Jo’s Syntactic Sugar • Constructor nesting • Method chaining • Custom extend() method • Observer pattern • Supports either bind() or passing context
- 11. Jo’s Principles • Don’t try to “fix” JavaScript • Let CSS3 do its job • Keep the code light
- 12. If Jo Were a Person...
- 13. If Jo Were a Person... Indiana Jones! • Smart • Flexible • Travels light • Can dress up (if he has to)
- 14. ...OK, More Like Young Indy Today • Capable • Reeking with potential • A little rough around the edges (Did I mention I’m looking for more code contributors?)
- 15. Comparison How to spot Jo in a crowd of mobile frameworks.
- 16. Jo vs. The Volcanos Obligatory Size Comparison Jo 2 XUI 3 Zepto 5 SproutCore 10 Dojo Mobile 11 Sencha Touch 12 jQuery Mobile 13 0 3 6 9 12 15
- 17. Jo vs. The Volcanos Obligatory Size Comparison (using my favorite metric: bytes per framework name) Jo 2 XUI 3 Zepto 5 SproutCore 10 Dojo Mobile 11 Sencha Touch 12 jQuery Mobile 13 0 3 6 9 12 15
- 18. Jo’s Sweet Spot Minimal Zepto XUI Jo HTML JS jQuery Mobile Sencha Touch Sprout Core Massive Dojo Mobile
- 19. Code Examples Yadda yadda yadda... show me the code!
- 20. Hello, Jo! Sample <!DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" href="jo.css" type="text/css"> </head> <body> <script src="jo.js"></script> <script> var app = new joScreen(); app.alert(“Hello, Jo!”); </script> </body> </html>
- 21. More Samples... /* code > slides */
- 22. Q&A Session Because every talk needs one.
- 23. Thank You!* Dave Balmer Twitter @Balmer http://joApp.com http://github.com/davebalmer/jo *see me after, I have Jo on flash drives as well
Editor's Notes
- \n
- \n
- \n
- \n
- \n
- \n
- \n
- \n
- \n
- \n
- \n
- \n
- \n
- \n
- \n
- \n
- \n
- \n
- \n
- \n
- \n
- \n
- \n