Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Choosing the Right Mobile Development Platform (Part 2)


Published on

As more and more projects are requiring mobile applications, developers are faced with a wide range of options. AIR for mobile? PhoneGap? Titanium's Appcelerator? Sencha? Native? Which development environment makes sense? This session will explore the advantages and limitations of each of these environments from someone who has been in the mobile application development world for over 4 years. Get a clear picture of what these technologies can offer for your mobile development needs.

Published in: Technology, Business
  • Be the first to comment

Choosing the Right Mobile Development Platform (Part 2)

  1. 1. Choosing the Right MobileDevelopment Platform (Part 2) @ChrisGriffith
  2. 2. What does jQuery Mobile do? jQuery Mobile makes it easy to develop user interfaces for mobile web apps.
  3. 3. Basic Structure <body> <div id="homePage" data-role="page"> <div data-role="header"> <h1>Header</h1> </div> <div data-role="content"> <p>Content</p> </div> <div data-role="footer"> <h4>Footer</h4> </div> </div> </body>
  4. 4. Basic Structure
  5. 5. Basic Structure <body> <div id="homePage" data-role="page"> <div data-role="header"> <h1>Page Title</h1> </div> <div data-role="content"> <p>My page content</p> <p><a href="#about">About this app</a></p> </div> <div data-role="footer"> <h4>Footer</h4> </div> </div> <div data-role="page" id="about"> <div data-role="header"> <h1>About This App</h1> </div> <div data-role="content"> <p>This app rocks! <a href="#homePage">Go home</a></p> </div> </div> </body>
  6. 6. Performance
  7. 7. Performance $(document).bind("mobileinit", function() { $.mobile.defaultPageTransition = "none"; $.mobile.defaultDialogTransition = "none"; });
  8. 8. Device Access? Limited Device by device But… Getting better
  9. 9. Templating
  10. 10. Templating $(#hikeDetailsPage).live(pageshow, function(event) { var hikeDetailsHTML; hikeDetailsHTML = Mustache.to_html(hikeDetailsTemplate, currentHikeData); $(#hikeDetails).html(hikeDetailsHTML); });
  11. 11. Styling
  12. 12. iOS
  13. 13. iOS
  14. 14. Android
  15. 15. Android
  16. 16. This presentation continues in part 3