Cordova3.x Fundamentals – (aka PhoneGap) – Pros and Cons

View Github Repository Open presentation in a new window

rensanning

See all presentation from rensanning

Cordova3.x Fundamentals – (aka PhoneGap) – Pros and Cons

0 0

cordova-3-fundamentals

Cordova (aka PhoneGap) 3.x Fundamentals

On Github rensanning / cordova-3-fundamentals

Cordova3.x Fundamentals

(aka PhoneGap)

Created by rensanning / @rensanning

What is Cordova ?

“Apache Cordova is an open source framework for building cross-platform native applications using standard web technologies such as HTML, CSS and JavaScript.”

PhoneGap vs Cordova ?

PhoneGap is a distribution of Apache Cordova。

WebKit -- Chrome/Safari Linux -- Ubuntu/CentOS

Pros and Cons

Pros

  • Open Source and Free
  • Web Development Skill Reuse
  • Platform Support
  • Plugin Architecture

Pros and Cons

Cons

  • Performance
  • Browser Support
  • Web LAF（Look & Feel）

Architecture

Native Application Architecture

Architecture

Streamlined plugin architecture

Architecture

Streamlined plugin architecture

Architecture

Native Bridge

>>more

Platform Support

Installing Cordova

Requirements

Android（JDK/Ant/Android SDK/ADT）、iOS(Xcode)、Node.js、Git

Install

npm install -g cordova

>>more

Cordova CLI

  • Create： Generate folder skeleton
  • Build： Generate mobile native apps
  • Deploy： Transfer to emulators and Devices

Cordova CLI

cordova create MyApp com.rensanning.cordova MyApp
cd MyApp
cordova platforms add android 
cordova plugin add org.apache.cordova.device 
cordova build android
cordova emulate android

Project Structure

myApp/ 
|-- config.xml 
|-- hooks/ 
| | |-- before_xxx/ 
| | `-- after_xxx/ 
|-- merges/ 
| | |-- android/ 
| | `-- ios/ 
|-- platforms/ 
| |-- android/ 
| `-- ios/ 
|-- plugins/ 
| |-- org.apache.cordova.console/ 
| `-- org.apache.cordova.device/ 
|-- www/ 
| |-- css/ 
| |-- img/ 
` |-- js/ 
  `-- index.html

>>more

config.xml

>>more

Cordova APIs

>>more

Cordova Events

  • deviceready
  • pause
  • resume
  • backbutton
  • menubutton
  • searchbutton
  • startcallbutton
  • endcallbutton
  • volumedownbutton
  • volumeupbutton
  • online
  • offline

Debugging Applications

  • Browser
  • Native
  • Remote

>>more

Apache Ripple

weinre

UI Framewrok

Cloud-based Build Services

  • PhoneGap Build
  • AppBuilder/Icenium
  • Appery.io/Tiggzi
  • Monaca
  • SAE云窗调试器

>>more

Reference

Reference

Thanks!