Next-generation platform

Setting up a Cordova project

Complete the instructions to set up a Cordova project.

Before you begin

As a prerequisite, set up an environment to create a hybrid application by using Apache Cordova by performing the following steps:
  1. Ensure that you have installed Sterling Store Engagement.
  2. Download and install Node.js version 16.14.0. For more information, see nodejs documentation.
  3. Install the Apache Cordova version 12.0.0. For platform-specific instructions, see Cordova documentation.
  4. Install platform-specific tools. For example, Xcode for iOS platform and Android SDK for android platform.

Procedure

  1. Create a workspace folder as follows:
    cd <cordova_project_container_folder>
  2. Create a Cordova project by running the following command:
    For example, cordova create StoreAppDemo com.ibm.isf.StoreAppDemo StoreAppDemo
    cordova create <project_name> <package_name> <folder_name>
    cordova create StoreAppDemo com.ibm.isf.StoreAppDemo StoreAppDemo
  3. Install iOS and Android SDK platforms and run the appropriate commands.
    • For iOS, run the following command:
      cordova platform add ios
    • For Android, run the following command:
      cordova platform add android
  4. Install the Cordova plug-ins by running the appropriate commands.
    • Install the Cordova plug-in device by running the following command:
      cordova plugin add cordova-plugin-device
    • Install the Cordova plug-in console by running the following command:
      cordova plugin add cordova-plugin-console
    • Install the peripheral device plug-ins.
    • If necessary, install the base plug-ins. For more information, see Cordova Plugins.
  5. Modify the Cordova config.xml file that is present in <project_folder>.
    1. Set the value of src attribute in the content element to point to the application URL.
      For example, <content src="http://localhost:9080/isf/store-frontend/index.html"/>
    2. Update the following elements to allow the application to access the URLs:
      <allow-navigation href="http://*/*" />
      <allow-navigation href="https://*/*" />
      <allow-intent href="http://*/*" />
      <allow-intent href="https://*/*" />
    3. Set an appropriate value for the AppendUserAgent attribute to load platform-specific Cordova plug-ins as follows:
      <preference name="AppendUserAgent" value="< >" />. For example, <preference name="AppendUserAgent" value="cordova-ios" />.
    4. Configure the project settings if specified by the plug-ins provided by peripheral-device vendors.
    5. Complete any additional instructions that are provided by the plug-ins that you installed.
  6. Build and deploy the application on the appropriate device. For more information, see the following resources: