Using those technologies to replace native mobile development is still quite new, lead developer for the mobile app "Pistachio" will showcase the app he's building together with his team to display the possibilities that they bring when developing applications for mobile devices.
2. Luis Merino
Application Developer & Freelance
Co-Founder of Pistachio in Berlin
Web development projects:
• www.cloud9ide.com
• www.joinpistachio.com
• ...
twitter: @Rendez
email: mail@luismerino.name
5. DEVELOPING IN MOBILE BROWSERS
• Mobile browsers have improved
• Already familiar ground for web developers
6. DEVELOPING IN MOBILE BROWSERS
• Mobile browsers have improved
• Already familiar ground for web developers
• Easy adaptation process for the mobile developer wannabe
7. DEVELOPING IN MOBILE BROWSERS
• Mobile browsers have improved
• Already familiar ground for web developers
• Easy adaptation process for the mobile developer wannabe
• Part missing: browsers can’t access the device’s features...
8. DEVELOPING IN MOBILE BROWSERS
• Mobile browsers have improved
• Already familiar ground for web developers
• Easy adaptation process for the mobile developer wannabe
• Part missing: browsers can’t access the device’s features...
• ...Can’t they?
9. “It’s time to get back to innovating in the
browser space.”
~ Brendan Eich
11. WHY THE JAVASCRIPT WAY
...And why Sencha Touch 2
• Allows for fast product cycles
12. WHY THE JAVASCRIPT WAY
...And why Sencha Touch 2
• Allows for fast product cycles
• Easily deployable
13. WHY THE JAVASCRIPT WAY
...And why Sencha Touch 2
• Allows for fast product cycles
• Easily deployable
• Even easier ENV set-up
14. WHY THE JAVASCRIPT WAY
...And why Sencha Touch 2
• Allows for fast product cycles
• Easily deployable
• Even easier ENV set-up
• One set of tools to rule them all (iOS, Android, Blackberry)
15. WHY THE JAVASCRIPT WAY
...And why Sencha Touch 2
• Allows for fast product cycles
• Easily deployable
• Even easier ENV set-up
• One set of tools to rule them all (iOS, Android, Blackberry)
• Plays nice with PhoneGap
16. WHY THE JAVASCRIPT WAY
...And why Sencha Touch 2
• Allows for fast product cycles
• Easily deployable
• Even easier ENV set-up
• One set of tools to rule them all (iOS, Android, Blackberry)
• Plays nice with PhoneGap
• Feels like building an application, instead of HTML5
17. WHY THE JAVASCRIPT WAY
...And why Sencha Touch 2
• Allows for fast product cycles
• Easily deployable
• Even easier ENV set-up
• One set of tools to rule them all (iOS, Android, Blackberry)
• Plays nice with PhoneGap
• Feels like building an application, instead of HTML5
• It’s a solid Framework (enterprise-ready), not just a library
18. WHY THE JAVASCRIPT WAY
...And why Sencha Touch 2
• Allows for fast product cycles
• Easily deployable
• Even easier ENV set-up
• One set of tools to rule them all (iOS, Android, Blackberry)
• Plays nice with PhoneGap
• Feels like building an application, instead of HTML5
• It’s a solid Framework (enterprise-ready), not just a library
• Version 1.0 proved very successful
21. INGREDIENTS: QUICK START
What do I need?
• Download the Sencha Touch (1/2 dev preview) SDK.
• Install the Ruby GEM for using Compass [http://compass-style.org/]
22. INGREDIENTS: QUICK START
What do I need?
• Download the Sencha Touch (1/2 dev preview) SDK.
• Install the Ruby GEM for using Compass [http://compass-style.org/]
• Start your web server (nginx, apache... *couch*MAMP*couch*)
23. INGREDIENTS: QUICK START
What do I need?
• Download the Sencha Touch (1/2 dev preview) SDK.
• Install the Ruby GEM for using Compass [http://compass-style.org/]
• Start your web server (nginx, apache... *couch*MAMP*couch*)
• Your favorite IDE or code editor
24. INGREDIENTS: QUICK START
What do I need?
• Download the Sencha Touch (1/2 dev preview) SDK.
• Install the Ruby GEM for using Compass [http://compass-style.org/]
• Start your web server (nginx, apache... *couch*MAMP*couch*)
• Your favorite IDE or code editor
• Good background and understanding of Javascript
27. INSIGHTS ON SENCHA TOUCH 2
• Extended Javascript MVC paradigm
• Lots of pre-built UI components which bind to the models
28. INSIGHTS ON SENCHA TOUCH 2
• Extended Javascript MVC paradigm
• Lots of pre-built UI components which bind to the models
• Uses the Ext.JS 4.1 Class system:
• Extensible classes
• Integrates its own AMD, “requireJS”.
• HTML5 flavours: XHR2, offline storage, localStorage...
29. INSIGHTS ON SENCHA TOUCH 2
• Extended Javascript MVC paradigm
• Lots of pre-built UI components which bind to the models
• Uses the Ext.JS 4.1 Class system:
• Extensible classes
• Integrates its own AMD, “requireJS”.
• HTML5 flavours: XHR2, offline storage, localStorage...
• Lighting-fast theming for the views with SASS & Compass: great
looking UI “default” included with the SDK
30. HOW WE BUILD YOUR
EVENTS’ CALENDAR
This is simplified for demo purposes
Important stuff to learn here:
ui: ‘dark’, ‘light’... you name it.
itemTpl: similar to {{mustache}} but
with more features
34. ALTERNATIVES #1
Native VS HTML5: Be careful when choosing
• Deciding on what to choose can be a project on its own
35. ALTERNATIVES #1
Native VS HTML5: Be careful when choosing
• Deciding on what to choose can be a project on its own
• Platforms to compile native apps: Titanium OR Xamarin OR ...
• Their platforms seem to be performing better (specially for
iPhone :/ )
• Hard to debug, and not easy to deal with UI element
normalization
• Deployment is highly bound to the respective App Stores
37. ALTERNATIVES #2
Native VS HTML5: Be careful when choosing
• JQuery Mobile & the rest of the gang
• Doesn’t reach ST2‘s point of performance
• Personally, the speed of development feels slow
• But simpler, and highly compatible if you build a mobile web app
38. ALTERNATIVES #2
Native VS HTML5: Be careful when choosing
• JQuery Mobile & the rest of the gang
• Doesn’t reach ST2‘s point of performance
• Personally, the speed of development feels slow
• But simpler, and highly compatible if you build a mobile web app
• Personally an alternative: mix of jQuery with Backbone and
Underscore.js
Hi, my name is Luis Merino. For the past three months I’ve been building a mobile application called Pistachio. Yes, like the nut...\n\nTo give you a point of reference, the product that I and my team are building is basically a social calendar of events that includes people around you and also the stuff that you are interested about based on location. For example, if you are fan of Radiohead, you might want to know when they come to play in Berlin, or maybe you like to stay tuned to some meet-ups your friends are creating, like BerlinJS.\n\nThe interesting part about about this project is that is “almost” entirely built using Javascript and is running on a mobile device. \n\nAnd I’ll run the demo of the application, but first I want to show you a little about how to build it.\n
Mobile browsers are getting faster: they are shipping faster Javascript engines, more HTML5 support and they become more stable with each release.\n\nLearning a new set of tools and new programming language takes time.\n\nIf you are a web developer the same old gang is available for development: the mix of HTML5, CSS and Javascript.\n
Mobile browsers are getting faster: they are shipping faster Javascript engines, more HTML5 support and they become more stable with each release.\n\nLearning a new set of tools and new programming language takes time.\n\nIf you are a web developer the same old gang is available for development: the mix of HTML5, CSS and Javascript.\n
Mobile browsers are getting faster: they are shipping faster Javascript engines, more HTML5 support and they become more stable with each release.\n\nLearning a new set of tools and new programming language takes time.\n\nIf you are a web developer the same old gang is available for development: the mix of HTML5, CSS and Javascript.\n
Mobile browsers are getting faster: they are shipping faster Javascript engines, more HTML5 support and they become more stable with each release.\n\nLearning a new set of tools and new programming language takes time.\n\nIf you are a web developer the same old gang is available for development: the mix of HTML5, CSS and Javascript.\n
Mobile browsers are getting faster: they are shipping faster Javascript engines, more HTML5 support and they become more stable with each release.\n\nLearning a new set of tools and new programming language takes time.\n\nIf you are a web developer the same old gang is available for development: the mix of HTML5, CSS and Javascript.\n