SlideShare a Scribd company logo
1 of 100
Download to read offline
The hitchhiker's guide to
                         mobile development
                                Mobilism 2011



                                 Nikolai Onken
                                    uxebu



Sunday, May 15, 2011
@nonken



Sunday, May 15, 2011
Sunday, May 15, 2011
We open the mobile web.




Sunday, May 15, 2011
How you totally should do it




Sunday, May 15, 2011
Lets look at




Sunday, May 15, 2011
Lets look at


                  1. Current state of mobile dev




Sunday, May 15, 2011
Lets look at


                  1. Current state of mobile dev


                  2. Coding




Sunday, May 15, 2011
Lets look at


                  1. Current state of mobile dev


                  2. Coding


                  3. Call for action


Sunday, May 15, 2011
Current state of mobile dev




Sunday, May 15, 2011
State of mobile dev: runtimes




Sunday, May 15, 2011
State of mobile dev: runtimes




Sunday, May 15, 2011
State of mobile dev: runtimes




Sunday, May 15, 2011
State of mobile dev: runtimes




Sunday, May 15, 2011
State of mobile dev: runtimes




Sunday, May 15, 2011
State of mobile dev: runtimes




Sunday, May 15, 2011
State of mobile dev: runtimes




Sunday, May 15, 2011
State of mobile dev: runtimes




Sunday, May 15, 2011
State of mobile dev: runtimes




Sunday, May 15, 2011
State of mobile dev: runtimes




Sunday, May 15, 2011
State of mobile dev: runtimes




Sunday, May 15, 2011
State of mobile dev: runtimes I would use




Sunday, May 15, 2011
State of mobile dev: runtimes I would use




Sunday, May 15, 2011
State of mobile dev: debugging




Sunday, May 15, 2011
State of mobile dev: debugging




                            http://bit.ly/chrome-remote
Sunday, May 15, 2011
State of mobile dev: debugging




                               http://bit.ly/weinre
Sunday, May 15, 2011
State of mobile dev: debugging




                              http://jsconsole.com
Sunday, May 15, 2011
State of mobile dev: debugging




                             http://bit.ly/o-dragonfly
Sunday, May 15, 2011
State of mobile dev: debugging




                           http://jsdebugger.appspot.com
Sunday, May 15, 2011
State of mobile dev: debugging




                               http://zeonjs.com
Sunday, May 15, 2011
State of mobile dev: debugging




Sunday, May 15, 2011
State of mobile dev: editors




                           http://cloud9ide.com




Sunday, May 15, 2011
State of mobile dev: editors




                           http://cloud9ide.com




Sunday, May 15, 2011
State of mobile dev: debugging




                               SubEthaEdit FTW
Sunday, May 15, 2011
Sunday, May 15, 2011
Sunday, May 15, 2011
Sunday, May 15, 2011
Sunday, May 15, 2011
State of mobile dev: build services




                                  http://apparat.io
                             http://build.phonegap.com
                       https://github.com/brianleroux/cordova




Sunday, May 15, 2011
State of mobile dev: build services




                                  http://apparat.io
                             http://build.phonegap.com
                       https://github.com/brianleroux/cordova




Sunday, May 15, 2011
State of mobile dev: build services




                                  http://apparat.io
Sunday, May 15, 2011
State of mobile dev: build services




                                  http://apparat.io
Sunday, May 15, 2011
State of mobile dev: build services




                                  http://apparat.io
Sunday, May 15, 2011
State of mobile dev: testing




                          http://ripple.tinyhippos.com/
                       https://github.com/vf/web-testsuite




Sunday, May 15, 2011
State of mobile dev: testing




                          http://ripple.tinyhippos.com/
                       https://github.com/vf/web-testsuite




Sunday, May 15, 2011
State of mobile dev: reporting




                             http://distimo.com




Sunday, May 15, 2011
State of mobile dev: reporting




                             http://distimo.com




Sunday, May 15, 2011
State of mobile dev: app stores




                                  yea right...




Sunday, May 15, 2011
State of mobile dev: app stores...




    Probably more than just ‘mobile’ - chromestore anyone?




Sunday, May 15, 2011
State of mobile dev: libraries




                                 tons of em




Sunday, May 15, 2011
State of mobile dev: libraries




                               but size matters!




Sunday, May 15, 2011
Coding




Sunday, May 15, 2011
Rewire our brains




Sunday, May 15, 2011
What about those
                         libraries?




Sunday, May 15, 2011
Uh oh




Sunday, May 15, 2011
Uh oh




Sunday, May 15, 2011
Uh oh




Sunday, May 15, 2011
Uh oh




Sunday, May 15, 2011
Uh oh




Sunday, May 15, 2011
What about maintainability?




Sunday, May 15, 2011
Work with features and interfaces
                            Don’t branch your code




Sunday, May 15, 2011
Bad




Sunday, May 15, 2011
Really Bad




Sunday, May 15, 2011
Good




Sunday, May 15, 2011
Good




Sunday, May 15, 2011
Good




Sunday, May 15, 2011
Good




Sunday, May 15, 2011
http://embedjs.org
                       The DIY framework




Sunday, May 15, 2011
Sunday, May 15, 2011
Sunday, May 15, 2011
vs.




Sunday, May 15, 2011
vs.




Sunday, May 15, 2011
13 LOC




                         vs.


                       ~200 LOC


Sunday, May 15, 2011
Enough code? Demo
                         Mobilism app




Sunday, May 15, 2011
Mixins hell yea




Sunday, May 15, 2011
Delegate


               • Different approach on event handling
               • Simple, clear implementation
               • Less overhead than the multi purpose
                       event handlers such as dojo.connect
               • More explicit than pub/sub 
               • https://github.com/uxebu/delegate

Sunday, May 15, 2011
Delegate




Sunday, May 15, 2011
Delegate




Sunday, May 15, 2011
Delegate




Sunday, May 15, 2011
Delegate




Sunday, May 15, 2011
Example: Delegate




               • Mobilism Schedule (Object emitters)
                       https://github.com/nonken/mobilism2011




Sunday, May 15, 2011
Data binding



               •       Based on delegate’s event handling
               •       No templating language!
               •       Objects emit events on state change
               •       Data binding takes care of modifying
                       DOM 



Sunday, May 15, 2011
Data binding




Sunday, May 15, 2011
Data binding




Sunday, May 15, 2011
Data binding




Sunday, May 15, 2011
Example




               • Mobilism schedule (Data binding)




Sunday, May 15, 2011
DOM Events




               • Binds native DOM events to object
                       methods




Sunday, May 15, 2011
DOM Events




Sunday, May 15, 2011
DOM Events




Sunday, May 15, 2011
DOM Events




Sunday, May 15, 2011
DOM Events




Sunday, May 15, 2011
Example DOM Events




               • Mobilism mobile app (DOM event binding)




Sunday, May 15, 2011
Gaming



               • Curve Desaster - the experiment
                       https://github.com/uxebu/curvedesaster
               • No library
               • Using only the Delegate mixin and a
                       mixin helper
               • wwtest / http://10.0.2.1:8080

Sunday, May 15, 2011
Call for action




Sunday, May 15, 2011
What is happening right now?

               •       Fact: Native mobile is moving fast
               •       Bad: Apple disabled Nitro in WebView
               •       Good: Android now has an ADK
               •       Awesome: Chromestore now has
                       payment APIs
               • Woot: HP kicks ass, you can use node.js!
               • ...
Sunday, May 15, 2011
How can we be of influence?




Sunday, May 15, 2011
Push PhoneGap to its limits




Sunday, May 15, 2011
Human APIs... in JavaScript!




Sunday, May 15, 2011
Questions?




Sunday, May 15, 2011
Wuut



                               @nonken


                       http://uxebu.com - @uxebu




Sunday, May 15, 2011

More Related Content

Similar to The Hitchhiker's guide to mobile development

Ruby and Rails, as secret weapon to build your service-oriented apps
Ruby and Rails,  as secret weapon to build your service-oriented appsRuby and Rails,  as secret weapon to build your service-oriented apps
Ruby and Rails, as secret weapon to build your service-oriented apps
Felipe Talavera
 
GT Logiciel Libre - Convention Systematic 2011
GT Logiciel Libre - Convention Systematic 2011GT Logiciel Libre - Convention Systematic 2011
GT Logiciel Libre - Convention Systematic 2011
Stefane Fermigier
 
Intro - Geomob May 2011
Intro - Geomob May 2011 Intro - Geomob May 2011
Intro - Geomob May 2011
GeomobLDN
 
Desenvolvimento Indolor com JQuery Mobile
Desenvolvimento Indolor com JQuery MobileDesenvolvimento Indolor com JQuery Mobile
Desenvolvimento Indolor com JQuery Mobile
Bruno Oliveira
 
Aloha Editor DevCon 2011 Vienna keynote
Aloha Editor DevCon 2011 Vienna keynote Aloha Editor DevCon 2011 Vienna keynote
Aloha Editor DevCon 2011 Vienna keynote
Haymo Meran
 
Jan Senderek - Building Mobile First: Eeve - Geomob May 2011
Jan Senderek - Building Mobile First: Eeve - Geomob May 2011Jan Senderek - Building Mobile First: Eeve - Geomob May 2011
Jan Senderek - Building Mobile First: Eeve - Geomob May 2011
GeomobLDN
 

Similar to The Hitchhiker's guide to mobile development (20)

Ruby and Rails, as secret weapon to build your service-oriented apps
Ruby and Rails,  as secret weapon to build your service-oriented appsRuby and Rails,  as secret weapon to build your service-oriented apps
Ruby and Rails, as secret weapon to build your service-oriented apps
 
GT Logiciel Libre - Convention Systematic 2011
GT Logiciel Libre - Convention Systematic 2011GT Logiciel Libre - Convention Systematic 2011
GT Logiciel Libre - Convention Systematic 2011
 
DevOps Introduction @Cegeka
DevOps Introduction @CegekaDevOps Introduction @Cegeka
DevOps Introduction @Cegeka
 
Managing Projects on a Mac
Managing Projects on a MacManaging Projects on a Mac
Managing Projects on a Mac
 
Devops workshop unit2
Devops workshop unit2Devops workshop unit2
Devops workshop unit2
 
Intro - Geomob May 2011
Intro - Geomob May 2011 Intro - Geomob May 2011
Intro - Geomob May 2011
 
Desenvolvimento Indolor com JQuery Mobile
Desenvolvimento Indolor com JQuery MobileDesenvolvimento Indolor com JQuery Mobile
Desenvolvimento Indolor com JQuery Mobile
 
2011 The Year of Web apps
2011 The Year of Web apps2011 The Year of Web apps
2011 The Year of Web apps
 
Introducing Cloud9 at DynCon 2011
Introducing Cloud9 at DynCon 2011Introducing Cloud9 at DynCon 2011
Introducing Cloud9 at DynCon 2011
 
6.1 Social Media
6.1 Social Media6.1 Social Media
6.1 Social Media
 
Aloha Editor DevCon 2011 Vienna keynote
Aloha Editor DevCon 2011 Vienna keynote Aloha Editor DevCon 2011 Vienna keynote
Aloha Editor DevCon 2011 Vienna keynote
 
Spectrum of IT BPO Services in the Philippines
Spectrum of IT BPO Services in the PhilippinesSpectrum of IT BPO Services in the Philippines
Spectrum of IT BPO Services in the Philippines
 
Zanox zxexperday presentation
Zanox zxexperday presentationZanox zxexperday presentation
Zanox zxexperday presentation
 
HTML5 and jQuery for Flex Developers
HTML5 and jQuery for Flex DevelopersHTML5 and jQuery for Flex Developers
HTML5 and jQuery for Flex Developers
 
Createanduse
CreateanduseCreateanduse
Createanduse
 
Jan Senderek - Building Mobile First: Eeve - Geomob May 2011
Jan Senderek - Building Mobile First: Eeve - Geomob May 2011Jan Senderek - Building Mobile First: Eeve - Geomob May 2011
Jan Senderek - Building Mobile First: Eeve - Geomob May 2011
 
Can Metadata Keep Libraries Relevant?
Can Metadata Keep Libraries Relevant?Can Metadata Keep Libraries Relevant?
Can Metadata Keep Libraries Relevant?
 
Developing a Progressive Mobile Strategy (Key Comm Version)
Developing a Progressive Mobile Strategy (Key Comm Version)Developing a Progressive Mobile Strategy (Key Comm Version)
Developing a Progressive Mobile Strategy (Key Comm Version)
 
Just Ship: Managing to Stay Out of the Way
Just Ship: Managing to Stay Out of the WayJust Ship: Managing to Stay Out of the Way
Just Ship: Managing to Stay Out of the Way
 
Mobile apps using drupal as base system SumitK DrupalCon Chicago
Mobile apps using drupal as base system   SumitK DrupalCon ChicagoMobile apps using drupal as base system   SumitK DrupalCon Chicago
Mobile apps using drupal as base system SumitK DrupalCon Chicago
 

More from Nikolai Onken

More from Nikolai Onken (17)

Running a cloud-based developer platform
Running a cloud-based developer platformRunning a cloud-based developer platform
Running a cloud-based developer platform
 
The Art Of Practicing - WebSummit 2014
The Art Of Practicing - WebSummit 2014The Art Of Practicing - WebSummit 2014
The Art Of Practicing - WebSummit 2014
 
Embedjs
EmbedjsEmbedjs
Embedjs
 
Human APIs
Human APIsHuman APIs
Human APIs
 
Html5 Development
Html5 DevelopmentHtml5 Development
Html5 Development
 
Html5 Apps
Html5 AppsHtml5 Apps
Html5 Apps
 
Human APIs - expanding the mobile web or are robots coming to JavaScript?
Human APIs - expanding the mobile web or are robots coming to JavaScript? Human APIs - expanding the mobile web or are robots coming to JavaScript?
Human APIs - expanding the mobile web or are robots coming to JavaScript?
 
Robotic JavaScript
Robotic JavaScriptRobotic JavaScript
Robotic JavaScript
 
Mobile Cross Platform
Mobile Cross PlatformMobile Cross Platform
Mobile Cross Platform
 
Human APIs, the future of mobile
Human APIs, the future of mobileHuman APIs, the future of mobile
Human APIs, the future of mobile
 
Mobile JavaScript Development - QCon 2010
Mobile JavaScript Development - QCon 2010Mobile JavaScript Development - QCon 2010
Mobile JavaScript Development - QCon 2010
 
Mobile cross platform development with Dojo
Mobile cross platform development with DojoMobile cross platform development with Dojo
Mobile cross platform development with Dojo
 
Dojo, from scratch to result
Dojo, from scratch to resultDojo, from scratch to result
Dojo, from scratch to result
 
EventNinja, Dojo and mobile
EventNinja, Dojo and mobileEventNinja, Dojo and mobile
EventNinja, Dojo and mobile
 
Dojo Introduction
Dojo IntroductionDojo Introduction
Dojo Introduction
 
Dojo and Adobe AIR
Dojo and Adobe AIRDojo and Adobe AIR
Dojo and Adobe AIR
 
RIA/UI development with Dojo
RIA/UI development with DojoRIA/UI development with Dojo
RIA/UI development with Dojo
 

Recently uploaded

Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
 

Recently uploaded (20)

"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
 
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
 
A Beginners Guide to Building a RAG App Using Open Source Milvus
A Beginners Guide to Building a RAG App Using Open Source MilvusA Beginners Guide to Building a RAG App Using Open Source Milvus
A Beginners Guide to Building a RAG App Using Open Source Milvus
 
MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectors
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu SubbuApidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
 

The Hitchhiker's guide to mobile development