Module 1: Creating a Cordova Project

Steps

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

  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:

    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.

  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)

    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)

    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:

    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.

comments powered by Disqus