Monday, 2 November 2015

Phonegap Application

Phonegape Application


Module 1: Creating a Cordova Project

Steps

  1. Make sure you have an up-to-date version of Node.js installed on your system.    

    or You Can Download Direct Here : -  Download
  2. Open Terminal (Mac) or a Command window (Windows), and type the following command to install the Cordova CLI:
    npm install -g cordova
    
    or on a Mac: (use Terminal)
    sudo npm install -g cordova
    
    If you already have Cordova installed on your computer, make sure you upgrade to the latest version:
    npm update -g cordova
    
    or
    sudo npm update -g cordova
    
  3. Navigate (cd) to a directory where you store projects on your file system.                                example :    cd desktop
  4. Using the Cordova CLI, create a Cordova project named Workshop in a directory named workshop:
    cordova create workshop com.yourname.workshop Workshop
    
  5. Navigate to the project directory:
    cd workshop
    
  6. Add support for the iOS platform (optional)  *******  (Use only For Android) ************
    To be able to build for the iOS platform, the iOS SDK must be installed on your system. If it's not, you can skip this step and add support for another platform, or simply run the tutorial application in your browser.
    1. Make sure the iOS SDK is available on your system.
    2. On the command line, make sure you are in the workshop directory and type:
      cordova platforms add ios
      
  7. Add support for the Android platform (optional) *****  (Use only For Android) *******
    To be able to build for the Android platform, the Android SDK must be installed on your system. If it's not, you can skip this step and add support for another platform, or simply run the tutorial application in your browser.
    1. Make sure the Android SDK and the ant build tool are available on your system. The Android SDK is available here. Both the android and ant tools must be available in your path.
    2. On the command line, make sure you are in the workshop directory and type:
      cordova platforms add android
      
  8. Make sure you are in the workshop directory, and add basic plugins to your projects: (Optional)
    cordova plugin add org.apache.cordova.device
    cordova plugin add org.apache.cordova.console
    
  9. Examine the directory structure under workshop.
    • The www folder is where you will code your HTML / JavaScript application. Open the index.html file in a browser to see the default application created by the Cordova CLI.
    • The platforms folder is where Cordova will build your application for different platforms (iOS, Android, etc). The contents of this folder will be automatically generated by the Cordova CLI, and you should never edit code in that directory.
    • Plugins are installed in the plugins directory.
    • Application parameters (name, author, etc) are stored in config.xml.    
  10. Here If You Have Your www Folder for your own Project Then Replace This folder With www Folder in Project.
  11. if You Replace This Folder Then Build it using Below Command :
    cordova build ios
  12. Then prepare Project using Below Command :
    cordova prepare

Module 2: Building a Cordova Project

Building for iOS

You need the iOS SDK installed on your computer to build an iOS version of your application using the steps below.
On the command line, make sure you are in the workshop directory and type:
cordova build

   : Run Your Project :


Run Using Command :-
The project is built in the workshop/platforms/ios folder. Double-click Workshop.xcodeproj to open the project in Xcode, and run it in the emulator or on your device.
You can also run the application in the iOS emulator directly from the command line. First install ios-sim:
npm install -g ios-sim
or
sudo npm install -g ios-sim
Then run the application in the iOS emulator:
cordova emulate ios

No comments:

Post a Comment