Generate mobile apps using Apache Cordova

Learn how to convert your Responsive HTML5/frameless output generated from FrameMaker or RoboHelp into a mobile app by using Apache Cordova.

This step-by-step article guides you through the process of converting your Responsive HTML5/frameless output generated from FrameMaker or RoboHelp into a mobile app. To generate the mobile app for iOS or Android platforms, you need to set up Apache Cordova, the process of which is also explained in this article. 

Prerequisites

Before installing Cordova, ensure that the required SDK is installed on your system. These SDKs are output-dependent, which means that you must install the SDK based on the output (iOS or Android) that you want to generate. 

To add support or rebuild a project for any platform, run the command-line interface (CLI) from the same machine that supports the platform's SDK. The CLI  supports the following combinations:

  • iOS (Mac)

  • Android (Mac, Linux, Windows)

More details on the most common output platforms can be found in the following links:

Note:

You also need the Responsive HTML5/frameless output generated from FrameMaker or RoboHelp before installing Cordova.

Generate Responsive HTML5/frameless output

To generate a mobile app, you need to publish your content into Responsive HTML5/frameless output using FrameMaker or RoboHelp. The process of generating the output is explained in the following articles:

Install Cordova

Note:

Ensure that you have installed the platform-specific SDK before installing Cordova. 

  1. Download and install Node.js.

    Note:

    After installing Node.js, you should be able to launch node or npm on your terminal or CLI.

  2. Open the Windows Command Prompt (Ctrl+r, type cmd) or the terminal in Mac (press Command - spacebar, type terminal).

  3. Enter the following node or npm command to install the Cordova utility:

    npm install -g cordova

    By default, Cordova generates a skeletal web-based application that is to be replaced with the HTML output you want to host in the iOS or Android application. The home page of the application is www/index.html.

  4. Replace the Responsive HTML5/frameless output generated through FrameMaker or RoboHelp within the www folder.

Create your first app

  1. Navigate to the folder where you want to create your application and execute the cordova script:

    cordova create <name of folder> com.example.<name of folder> <name of application>

    For example:

    cordova create helpapp com.example.helpapp Adobe_Help_App

    The script creates a project and the required folders for your cordova app.     

  2. Navigate inside the project folder, and add platforms for which you want to create your app. For example:

    cd helpapp

    cordova platform add android (if running on MacOS and Windows)

    cordova platform add ios (if running on only MacOS)

  3. Build the application by running the following command:

    cordova build

    After successfully building your application, follow the instructions given in this article to test your application. On the same article, you can also find more details on adding plug-ins and features to your application. 

Get help faster and easier

New user?