Your SlideShare is downloading. ×
0
Mobile Apps with JavaScript - there’s more than web!                                         Heiko Behrens                ...
@moskovich: “Your mobile phone has morecomputing power than all of NASA in 1969.    NASA put a man on the moon...
...we put a bird into pigs.”
what’s so greatabout the web   anyway ?
!"##$%&(()*+,(-%.,/0$*12-%/3!"#$%&"()*+****)(-%.)/45#2,*-./0#$%0123/-4****60,*5637-1/"#$%&8)9"#$%:)#%;<2)"2=->*"#61%7-)19)...
user’s         i veperspec t
experience
expectation
consumers think apps
developer’sperspective
web apps
HTML5cache manifest, local storage, forms, geo locationCSS3animation, transitions, 3D transformationResolutioncss media qu...
server-side web                           Web Server                        executes application                          ...
client-side web     Web Browser      JavaScriptexecutes application logic  Files         Database          Device         ...
web frameworksiWebKit, iUI, jQTouch, JQuery mobile, Jo, ZeptoSencha Touch, SproutCoreSee also any mew library that spawns ...
Sencha TouchGPL+MIT License        GPL + Free Licensedeclarative + JQuery   programmaticallysimple                 complex
Sencha Touch                                              Ext.setup({                                                  tab...
Cocos2D JavaScript        Impact JS   MIT License           MIT LicenseSimple 2D + Physics   2D, Physics, Sound           ...
production learning         easy and countless tutorials+libraries tools            can mostly be developed on desktop mon...
hybrid apps
hybrid appNative App         Interpreter    Request   Interceptor         JavaScript Bridge          Browser     executes ...
request interception    demo
Dual LicenseMIT & BSD
Logitech Squeezebox Controller
RNAO Nursing Best Practice Guidelines
debugging
+weinre
PhoneGap on Windows Phone
Plugin-Ins for PhoneGap
production learning         as with web tools            cloud build, yes but barely no debugging monetizationscenarios li...
interpreted apps
interpreted appNative App         interpreter                  Database  Application    Script                       Files...
– (HTML & CSS) =
Apache 2 License     JavaScript   native controlsiPhone, iPad, Android(BlackBerry, HTML5)
Plugin-Ins for Appcelerator
production learning         specific API, similar to Sencha & Co. tools            own IDE, including debugger monetization...
generated apps
generated app    Generator Generator Input       Native App                               Logic     Logic      Modeldescri...
LGPL            commercial             EPL                       (BETA)    Java, C#           Java, AS             DSL  iO...
commercial800-4500 USDJavaScript / C#  full 2D/3Dgames tool chain iOS, Android
demo
production learning         completely new tool chain tools            scene editors, debuggers, asset manager, team versi...
JavaScript formobile apps ?
Web   PhoneGap   Appcelerator   Unity3Dproduction learning tools monetizationscenarios lists and data rich media gamesexpe...
twitter         @HBehrensblog            http://HeikoBehrens.netCEO & Founder   getBeamApp.com
beyond tellerrand: Mobile Apps with JavaScript – There's More Than Web
beyond tellerrand: Mobile Apps with JavaScript – There's More Than Web
beyond tellerrand: Mobile Apps with JavaScript – There's More Than Web
beyond tellerrand: Mobile Apps with JavaScript – There's More Than Web
beyond tellerrand: Mobile Apps with JavaScript – There's More Than Web
beyond tellerrand: Mobile Apps with JavaScript – There's More Than Web
Upcoming SlideShare
Loading in...5
×

beyond tellerrand: Mobile Apps with JavaScript – There's More Than Web

3,951

Published on

abstract from http://2011.beyondtellerrand.com

Modern web technologies and responsive design aim at a platform independent code base while promising first-class experience on any mobile device. Even though purely web-based approaches can achieve stunning results, they (still) cannot compete with their native counterpart regarding platform features and integration.
In this talk, I will show you how we can use JavaScript to produce mobile apps that include features such as native UI, push notifications, sensors, and paid distribution. You can expect lots of live demos when I will compare the strengths and weaknesses of various frameworks.

Published in: Technology, Business
1 Comment
3 Likes
Statistics
Notes
  • abstract from http://2011.beyondtellerrand.com

    Modern web technologies and responsive design aim at a platform independent code base while promising first-class experience on any mobile device. Even though purely web-based approaches can achieve stunning results, they (still) cannot compete with their native counterpart regarding platform features and integration.
    In this talk, I will show you how we can use JavaScript to produce mobile apps that include features such as native UI, push notifications, sensors, and paid distribution. You can expect lots of live demos when I will compare the strengths and weaknesses of various frameworks.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total Views
3,951
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
41
Comments
1
Likes
3
Embeds 0
No embeds

No notes for slide

Transcript of "beyond tellerrand: Mobile Apps with JavaScript – There's More Than Web"

  1. 1. Mobile Apps with JavaScript - there’s more than web! Heiko Behrens @HBehrens
  2. 2. @moskovich: “Your mobile phone has morecomputing power than all of NASA in 1969. NASA put a man on the moon...
  3. 3. ...we put a bird into pigs.”
  4. 4. what’s so greatabout the web anyway ?
  5. 5. !"##$%&(()*+,(-%.,/0$*12-%/3!"#$%&"()*+****)(-%.)/45#2,*-./0#$%0123/-4****60,*5637-1/"#$%&8)9"#$%:)#%;<2)"2=->*"#61%7-)19)??)?&#@)$%/@)->A*********5637-1/"#$%&8)9"#$%:8#""->*"#61%7-8#""->A*********5637-1/"#$%&8)9"#$%:%%"->**"#61%7-%65)%/@)->A*********5637-1/"#$%&8)9"#$%:BCD<BCD0#$%E1)->*"#61%7-BCD->4F 7(66.!(86$*95-*:$5;<% <?2C*+ ***45-.<$5;<%,*GHH@=4 ***<$5;<%=/"%(*>54&(%/-%? ***<$5;<%,*GHH@=4 !(3*1</@(8 F :BI?#8*+ ******&1#J&9#=&BI?#8,*H*H*K@=*<HHH4 ******&8)9L2%&9#=&BI?#8,*H*H*K@=*<HHH4 ******&1B&"23%)6,*M@6#D2?,NOP1D)Q6$B"#61:.2(6#B#"%:R3#87(#3#6S<TTTTTTAB%6)$D%ISU>M4 ******"23%)6, **************@6#D2?,NOP1D)Q6$B"#61:.2(6#B#"%:VI?#87(#3#6S<TTTTTTA?26)(%2#$SHAB%6)$D%ISU> **************@6#D2?,NOP1D)Q6$B"#61:.2(6#B#"%:VI?#87(#3#6S<TTTTTTA?26)(%2#$SWHAB%6)$D%ISU> **************@6#D2?,NOP1D)Q6$B"#61:.2(6#B#"%:VI?#87(#3#6S<TTTTTTA?26)(%2#$SXYHAB%6)$D%ISU> **************@6#D2?,NOP1D)Q6$B"#61:.2(6#B#"%:VI?#87(#3#6S<TTTTTTA?26)(%2#$SZ[HAB%6)$D%ISU>4 ******9#=&BI?#8,*H*H*K@=*<HHH4 F
  6. 6. user’s i veperspec t
  7. 7. experience
  8. 8. expectation
  9. 9. consumers think apps
  10. 10. developer’sperspective
  11. 11. web apps
  12. 12. HTML5cache manifest, local storage, forms, geo locationCSS3animation, transitions, 3D transformationResolutioncss media queries, reference, categories, float layoutURLsmails, telephone, sms, maps, youtube, etc.
  13. 13. server-side web Web Server executes application logicWeb Browser Files Database Device Backend
  14. 14. client-side web Web Browser JavaScriptexecutes application logic Files Database Device Backend
  15. 15. web frameworksiWebKit, iUI, jQTouch, JQuery mobile, Jo, ZeptoSencha Touch, SproutCoreSee also any mew library that spawns each new week
  16. 16. Sencha TouchGPL+MIT License GPL + Free Licensedeclarative + JQuery programmaticallysimple complex
  17. 17. Sencha Touch Ext.setup({ tabletStartupScreen: tablet_startup.png, phoneStartupScreen: phone_startup.png, icon: icon.png, glossOnIcon: false, onReady : function() { Ext.regModel(Contact, { fields: [firstName, lastName] }); var groupingBase = { ! ! ! // snip },<ul data-role="listview" data-theme="g"> store: new Ext.data.Store({! <li><a href="acura.html">Acura</a></li> model: Contact,! <li><a href="audi.html">Audi</a></li> sorters: firstName,! <li><a href="bmw.html">BMW</a></li></ul> getGroupString : function(record) { return record.get( firstName)[0]; }, data: [ {firstName: Tommy, lastName: Maintz}, ! ! ! ! ! // snip {firstName: Zed, lastName: Zacharias} ] }) }; new Ext.List(Ext.apply(groupingBase, { fullscreen: true })); } });
  18. 18. Cocos2D JavaScript Impact JS MIT License MIT LicenseSimple 2D + Physics 2D, Physics, Sound Emphasizes Mobile
  19. 19. production learning easy and countless tutorials+libraries tools can mostly be developed on desktop monetization no app store distributionscenarios lists and data rich media inferior performance games poor performance, only limited 3Dexperience hardware no camera, partly accelerometer, no fancy stuff user interface fancy UI possible, but platform specific offline HTML5platforms iOS Android Windows Phone since 7.5 aka Mango others great movement in responsive design!
  20. 20. hybrid apps
  21. 21. hybrid appNative App Interpreter Request Interceptor JavaScript Bridge Browser executes JavaScript Device Backend
  22. 22. request interception demo
  23. 23. Dual LicenseMIT & BSD
  24. 24. Logitech Squeezebox Controller
  25. 25. RNAO Nursing Best Practice Guidelines
  26. 26. debugging
  27. 27. +weinre
  28. 28. PhoneGap on Windows Phone
  29. 29. Plugin-Ins for PhoneGap
  30. 30. production learning as with web tools cloud build, yes but barely no debugging monetizationscenarios lists and data rich media same as with web games same as with webexperience hardware mostly accessible user interface high effort to match platform’s UI offlineplatforms iOS Android Windows Phone others best coverage of cross-platform frameworks
  31. 31. interpreted apps
  32. 32. interpreted appNative App interpreter Database Application Script Files Device Backend
  33. 33. – (HTML & CSS) =
  34. 34. Apache 2 License JavaScript native controlsiPhone, iPad, Android(BlackBerry, HTML5)
  35. 35. Plugin-Ins for Appcelerator
  36. 36. production learning specific API, similar to Sencha & Co. tools own IDE, including debugger monetization marketplace for apps and componentsscenarios lists and data perfect match rich media hard to work with movies/images and animations games some modules for rendering and physicsexperience hardware complete support user interface truly native widgets offlineplatforms iOS Android Windows Phone no plans on roadmap others plans for BlackBerry and HTML5
  37. 37. generated apps
  38. 38. generated app Generator Generator Input Native App Logic Logic Modeldescribes logic and Database Database complete system Files FilesFiles Database Device Backend
  39. 39. LGPL commercial EPL (BETA) Java, C# Java, AS DSL iOS, Android, iOS, Android, iOS, Android,(Windows Phone), Windows Phone, Windows Phone, JavaScript HTML5, WebOS, Server-Side Web BlackBerry, Flash
  40. 40. commercial800-4500 USDJavaScript / C# full 2D/3Dgames tool chain iOS, Android
  41. 41. demo
  42. 42. production learning completely new tool chain tools scene editors, debuggers, asset manager, team versioning monetizationscenarios lists and data no native UI rich media not optimized for movies gamesexperience hardware OpenGL and sensors user interface best for games offlineplatforms iOS Android Windows Phone no plans on agenda others desktop and web
  43. 43. JavaScript formobile apps ?
  44. 44. Web PhoneGap Appcelerator Unity3Dproduction learning tools monetizationscenarios lists and data rich media gamesexperience hardware user interface offlineplatforms iOS Android Windows Phone others
  45. 45. twitter @HBehrensblog http://HeikoBehrens.netCEO & Founder getBeamApp.com
  1. A particular slide catching your eye?

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

×