Cross Platform Mobile Development
Upcoming SlideShare
Loading in...5
×
 

Cross Platform Mobile Development

on

  • 556 views

Presented at BarCamp CodeCamp Tampa 2012.

Presented at BarCamp CodeCamp Tampa 2012.

Statistics

Views

Total Views
556
Views on SlideShare
553
Embed Views
3

Actions

Likes
0
Downloads
4
Comments
0

1 Embed 3

https://www.linkedin.com 3

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Cross Platform Mobile Development Cross Platform Mobile Development Presentation Transcript

  • October 2012Cross Platform Mobile App Development Manesh Lad maneshlad@gmail.com @maneshlad
  • About Me: Manesh Lad• Local tech professional, mobile development for last few years• Jquery Mobile sites & Native iOS iPhone & iPad apps• Mobile Developer PSCU• Mobile Instructor for Learning Tree: • Designing Web Sites for Mobile Devices (2315) • iPhone and iPad Programming: A Comprehensive Hands-On Introduction (2761) • Building iPhone® and iPad® Applications: Extended Features (2762)
  • Problem & Solution Introduction
  • The Problem• Multiple mobile platforms, devices, form factors - smartphone & tablets• Differing skillet for development• Differing packaging requirement for app stores• Need to support many devices
  • Solution• HTML based frameworks to build mobile app • Jquery Mobile • Sencha Touch• PhoneGap • Wrapping HTML into native app for app stores • Access hardware/device capabilities from JavaScript
  • Solution benefits• Allows you access to the mobile market without writing native code.• Build web apps that automatically scale for different devices, desktop to mobile to tablet• Range of pre-built UI components for touch• Proven, and used by many large companies
  • JQuery Mob & Sencha• Client side JavaScript frameworks for building mobile web apps• Framework is free tooling is not.• HTML/CSS/JavaScript skills -easier than native• Common code for multiple platforms/devices• Each framework supports diff devices, evaluate what you want to target.
  • Diff approaches• JQM is a about styling HTML so its mobile / touch friendly. Designer friendly• Sencha uses JS/MVC to generate HTML - pseudo OO approach• JQM easier to learn• Sencha has a steeper learning curve and does well at organizing, cleanly separating code
  • Testing Tools + demo• Opera Mobile Simulator• Chrome plugins, yslow, blackberry ripple• IPhone Simulator• Android simulator• Telerik TestStudio for iOS• Demo JQM Sites in simulators (www.oosharks.com, www.gadgetlad.com)
  • HTML Frameworks jquery mobile
  • jquery mobile
  • • Tabs & lists controls• Think of a list like a uitableview• Accordions - expandable sections
  • • Data entry widgets• Picker• Pop-up menu• Provides controls like UIKit does in cocoa touch
  • Themeroller• http://jquerymobile.com/themeroller/• Allows you to create up to 26 color themes/ swatches for the UI components• Lets you visually create CSS
  • What’s in it for Native Developers?• Maybe you want to integrate web content into you own app via a UIWebView.• Suggested uses of jQuery Mobile within your app: • Help pages, organize pages into a single html file • Access company info in your app • Leader boards or other server side info • Access a web page that links to your other apps for sale • The html files can be included in your app or run off a server • Demo DragonCoach in xcode
  • HTML Frameworks Sencha Touch
  • Sencha Touch • Used by over 50% of the Fortune 100 and 8 of the top 10 financial institutions • iOS, Android, Blackberry Touch Source: sencha.com
  • UI
  • Sencha Touch Demo Sencha Architect CityBars App
  • PhoneGapNative Building
  • What is PhoneGap?• http://phonegap.com/ - Open source wrapper for compiling mobile web apps as native apps• Access to hardware features on 7 major mobile platforms• Now owned by Adobe!• https://build.phonegap.com - compile web project for other platforms in the cloud!
  • Device Features via JS
  • build.phonegap.com• Cloud based service for compile mobile web apps• Allows you to compile for iOS w/o a Mac!
  • build.phonegap.com plans
  • XcodeDemos
  • • Phonegap xcode - sencha / citybars• Phonegap xcode - jqm / speechtimerz• Phonegap eclipse - jqm / website• Textwrangler - basic jQuery Mobile
  • Wrap-UpConclusion