Creating mobile apps with Cordova for iOS, Android and BlackBerry 10

  • 633 views
Uploaded on

Understand everything that is needed to create cross platform mobile applications using Cordova for iOS, Android and BlackBerry 10. We will go through all the steps for configuring your machine (Mac …

Understand everything that is needed to create cross platform mobile applications using Cordova for iOS, Android and BlackBerry 10. We will go through all the steps for configuring your machine (Mac or Windows), as well as add Cordova and WebWorks plugins. We will see how to package, deploy and debug hybrid apps on BlackBerry 10 and Android devices. In the end, we will inspect the project phonegapbootcamp.io, an open source website/mobileapp built with Angular, Gulp and Cordova.

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
633
On Slideshare
0
From Embeds
0
Number of Embeds
3

Actions

Shares
Downloads
11
Comments
0
Likes
3

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. C R E A T I N G M O B I L E A P P S W I T H C O R D O V A Demian Borba Design Thinker, BlackBerry Developer Evangelist @demianborba
  • 2. • Graduated in Industrial Design (CEFET-PR) • Graduated in Computer Science (UFAL) • Crazy about Design, UX, Business and Technology • Former Instructor at UCSD, Platt College and Art Institute • Working with Interactive Media for over 15 years • Founder of Action Creations, interactive agency in California • Developer Evangelist, 90% #upintheair (Americas+Asia+Europe) • Created the project www.designthinkingnow.com • www.phonegapbootcamp.io creator A B O U T M E
  • 3. dborba.com html5test.com
  • 4. @demianborba @gustavocostaw @joselitojunior1
  • 5. http://phonegapbootcamp.io
  • 6. https://play.google.com/store/apps/details?id=io.phonegapbootcamp.appandroid
  • 7. http://appworld.blackberry.com/webstore/content/54145887
  • 8. • Understand what Cordova/PhoneGap is • Understand how to configure your computers (Mac or Windows) • Understand how to create a project with Cordova Source (not CLI) • Understand how to build apps for iOS, Android and BlackBerry 10 • Understand how to use Cordova and WebWorks plugins • Understand how to deploy and debug your app on a real device (BlackBerry 10) • Understand www.phonegapbootcamp.io code (open source) angular+gulp+cordova. G O A L S T O D A Y
  • 9. W H A T C O R D O V A I S ? P H O N E G A P ?
  • 10. C O N F I G U R I N G Y O U R C O M P U T E R
  • 11. Download and Install Node: http://nodejs.org/download/
  • 12. Download and unzip ANT: http://ant.apache.org/bindownload.cgi
  • 13. Adding ANT to system PATH (Windows) ;C:yourfolderapache-ant-1.9.4bin
  • 14. Add ANT to your system PATH (Mac) export PATH="/Developer/apache-ant-1.9.4/bin:$PATH"
  • 15. Download Cordova Source: http://cordova.apache.org
  • 16. jdk + jre + adt-bundle (http://developer.android.com/sdk/index.html)
  • 17. export PATH="/Applications/adt-bundle-mac-x86_64-20131030/sdk/platform-tools:$PATH" export PATH="/Applications/adt-bundle-mac-x86_64-20131030/sdk/tools:$PATH"
  • 18. Download http://developer.blackberry.com/native/downloads
  • 19. export PATH="/Applications/Momentics.app/host_10_2_0_15/darwin/x86/usr/bin:$PATH"
  • 20. U S I N G C O R D O V A
  • 21. Unzip cordova-3.4.0-src.zip
  • 22. Unzip {{ wanted-platform }}
  • 23. Creating your first project
  • 24. Creating your first Cordova project for iOS
  • 25. Creating your first Cordova project for Android
  • 26. Creating your first Cordova project for BlackBerry 10
  • 27. Adding a Target Device (BlackBerry 10)
  • 28. B U I L D I N G F I R S T Y O U R A P P
  • 29. Building your First App (iOS or Android)
  • 30. Building your First App (BlackBerry 10) RELEASE MODE
  • 31. Building your First App (BlackBerry 10) DEBUG MODE
  • 32. U S I N G A N DC O R D O V A W E B W O R K S P L U G I N S
  • 33. CORDOVA DOCS: http://cordova.apache.org/docs/en/edge/index.html
  • 34. Cordova PLUGIN APIs Battery Status: Monitor the status of the device's battery. Camera: Capture a photo using the device's camera. Contacts: Work with the devices contact database. Device: Gather device specific information. Device Motion (Accelerometer): Tap into the device's motion sensor. Device Orientation (Compass): Obtain the direction that the device is pointing. Dialogs: Visual device notifications. FileSystem: Hook into native file system through JavaScript. File Transfer: Hook into native file system through JavaScript. Geolocation: Make your application location aware. Globalization: Enable representation of objects specific to a locale. InAppBrowser: Launch URLs in another in-app browser instance. Media: Record and play back audio files. Media Capture: Capture media files using device's media capture applications. Network Information (Connection): Quickly check the network state, and cellular network information. Splashscreen: Show and hide the applications splash screen. Vibration: An API to vibrate the device.
  • 35. Meeting PLUGMAN https://cordova.apache.org/docs/en/edge/plugin_ref_plugman.md.html INSTALLING PLUGMAN npm install -g plugman INSTALLING A PLUGIN plugman install --platform <ios|android|blackberry10> --project <directory> --plugin <pluginID> UNINSTALLING A PLUGIN plugman uninstall --platform <ios|android|blackberry10> --project <directory> --plugin <pluginID>
  • 36. Using WebWorks PLUGINS (BlackBerry 10) https://github.com/blackberry/BB10-WebWorks-Samples/tree/WebWorks-2.0/Localization plugman install --platform blackberry10 --project PROJECTROOTFOLDER --plugin com.blackberry.system
  • 37. D E P L O Y I N G D E B U G G I N GA N D Y O U R A P P
  • 38. Deploying your App (iOS or Android)
  • 39. Deploying your App (BlackBerry 10)
  • 40. Debugging your App (BlackBerry 10)
  • 41. App Stores
  • 42. P H O N E G A P B O O T C A M P . I O
  • 43. https://github.com/demianborba/phonegapbootcampsite
  • 44. http://ionicframework.com
  • 45. http://brackets.io
  • 46. T H A N K Y O U Demian Borba Design Thinker, BlackBerry Developer Evangelist @demianborba