Sencha Touch Build Mobile Web apps for iPhone, Android and Blackberry
Who am I ? <ul><li>Joseph Khan </li></ul><ul><li>Senior Software Engineer. </li></ul><ul><li>Flex, HTML5, Sencha Touch, Mo...
<ul><li>MOTIVATION </li></ul>
Objectives
Why mobile web apps?
native apps v/s mobile web Mobile Web apps Native apps <ul><li>Native apps can do more, access the hardware </li></ul><ul>...
What is Sencha Touch?
Sencha Touch
How it works ? A normal HTTP client – server interaction Request sent from mobile browser Response arrives – html/css/js w...
How it looks ?
Features Charts
User Interface – very rich
Animations
Data
Media
Events
Touch Charts new charting library create beautiful dashboard applications rich and interactive all possible chart visualiz...
Themes – Built in Ability to create custom theme
How to get started ?
Getting started… Sencha Touch is a JavaScript library Download Sencha Touch home page SDK www.sencha.com/products/touch
Getting started… Integrated Development Environment (IDE) – Visual Web Developer 2008 Javascript files CSS reference
Getting started… Integrated Development Environment (IDE) – Visual Web Developer 2008 Start writing your code in a new scr...
Getting started… kitchen sink Showcase of all the features Examples of all features Source code dev.sencha.com/deploy/touc...
Getting started… API docs Very good API documentation search for a class dev.sencha.com/deploy/touch/docs
Getting started… other sources Hello world example Sencha Touch forum Articles and tutorials Of course …… Google it http:/...
Getting started… http://jbkflex.wordpress.com/ Detailed tutorial series in my blog
Live demo – USAID OTI Mobile site
Other libraries…. jQuery Mobile jQTouch WebApp.net 10 best mobile web frameworks to kick start your mobile web career http...
Thank you I have shared the slides in my blog http://jbkflex.wordpress.com/
Reach me at [email_address]   facebook.com/jokhan jbkflex.wordpress.com/
Upcoming SlideShare
Loading in...5
×

Introduction to Sencha touch - developing web applications for mobile devices

7,861
-1

Published on

A presentation on Introduction to Sencha Touch - developing web applications for mobile devices such as iPhone, Android, Blackberry. For a detailed tutorial series visit my blog : http://jbkflex.wordpress.com/2011/07/30/writing-your-first-sencha-touch-application-part1/
or search for Sencha Touch in blog. You will find a series of posts.

Published in: Technology, Design
1 Comment
5 Likes
Statistics
Notes
No Downloads
Views
Total Views
7,861
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
289
Comments
1
Likes
5
Embeds 0
No embeds

No notes for slide

Introduction to Sencha touch - developing web applications for mobile devices

  1. 1. Sencha Touch Build Mobile Web apps for iPhone, Android and Blackberry
  2. 2. Who am I ? <ul><li>Joseph Khan </li></ul><ul><li>Senior Software Engineer. </li></ul><ul><li>Flex, HTML5, Sencha Touch, Mobile Web </li></ul><ul><li>4 yrs of experience. </li></ul>
  3. 3. <ul><li>MOTIVATION </li></ul>
  4. 4. Objectives
  5. 5. Why mobile web apps?
  6. 6. native apps v/s mobile web Mobile Web apps Native apps <ul><li>Native apps can do more, access the hardware </li></ul><ul><li>Native apps run faster </li></ul><ul><li>Native is easier to develop </li></ul><ul><li>Native fits platform look and feel </li></ul><ul><li>Native can be monetized </li></ul><ul><li>Web is catching up fast </li></ul><ul><li>Web runtimes are much faster today and most apps do not need the speed anyway </li></ul><ul><li>Web is often easier to develop when targeting multiple platforms </li></ul><ul><li>Web can also give the same platform look and feel </li></ul><ul><li>Well, even web can be monetized </li></ul>
  7. 7. What is Sencha Touch?
  8. 8. Sencha Touch
  9. 9. How it works ? A normal HTTP client – server interaction Request sent from mobile browser Response arrives – html/css/js www.zaloni.com/mobile Mobile device with webkit browser HTTP Web Server www.zaloni.com domain public-html mobile index.html
  10. 10. How it looks ?
  11. 11. Features Charts
  12. 12. User Interface – very rich
  13. 13. Animations
  14. 14. Data
  15. 15. Media
  16. 16. Events
  17. 17. Touch Charts new charting library create beautiful dashboard applications rich and interactive all possible chart visualizations visualize complex data set data drill down with built in events and animations like pinch-to-zoom, swipe-to-pan, tap
  18. 18. Themes – Built in Ability to create custom theme
  19. 19. How to get started ?
  20. 20. Getting started… Sencha Touch is a JavaScript library Download Sencha Touch home page SDK www.sencha.com/products/touch
  21. 21. Getting started… Integrated Development Environment (IDE) – Visual Web Developer 2008 Javascript files CSS reference
  22. 22. Getting started… Integrated Development Environment (IDE) – Visual Web Developer 2008 Start writing your code in a new script block
  23. 23. Getting started… kitchen sink Showcase of all the features Examples of all features Source code dev.sencha.com/deploy/touch/examples/kitchensink/
  24. 24. Getting started… API docs Very good API documentation search for a class dev.sencha.com/deploy/touch/docs
  25. 25. Getting started… other sources Hello world example Sencha Touch forum Articles and tutorials Of course …… Google it http://www.sencha.com/learn/touch/ http://www.sencha.com/learn/hello-world http://www.sencha.com/forum/
  26. 26. Getting started… http://jbkflex.wordpress.com/ Detailed tutorial series in my blog
  27. 27. Live demo – USAID OTI Mobile site
  28. 28. Other libraries…. jQuery Mobile jQTouch WebApp.net 10 best mobile web frameworks to kick start your mobile web career http://superdit.com/2010/12/20/10-framework-to-help-build-mobile-web-application/
  29. 29. Thank you I have shared the slides in my blog http://jbkflex.wordpress.com/
  30. 30. Reach me at [email_address] facebook.com/jokhan jbkflex.wordpress.com/
  1. A particular slide catching your eye?

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

×