For up-to-date product documentation, see the IBM MobileFirst Foundation Developer Center.
Add MobileFirst features to an existing Cordova app
We can add capabilities provided by IBM MobileFirst™ Platform Foundation to an existing Cordova app created with Apache Cordova, Ionic, or other third-party tools by adding the IBM MobileFirst Platform Foundation SDK to our app. The SDK is provided in the form of Cordova plug-ins.
Before you begin
- You must already have a Cordova application on your system created with third-party tools such as the Apache Cordova command-line interface or the Ionic Framework command-line interface.
- Your existing Cordova app must already include the applicable Apache Cordova platforms. The version of a platform must be at least the version supported by IBM MobileFirst Platform Foundation. If a platform in your app is at a lower version level than is in this list, upgrade to the version level on the list.
- Your existing Cordova app most likely includes some Apache Cordova plug-ins. The version of any Apache Cordova plug-in that is used by your app must be at least the version supported by IBM MobileFirst Platform Foundation. If a plug-in in your app is at a lower version level than is in this list, upgrade to the version level on the list.
- You must have the Cordova Command-Line Interface (CLI) installed, and any prerequisites installed required for using the Cordova CLI for our target platforms.
- You must have the IBM MobileFirst Platform Command Line Interface (CLI) installed.
- You must have internet access.
- You must have node.js version 4.0.0 or later installed.
We can add any of the following plug-ins to our app.
- cordova-plugin-mfp
- cordova-plugin-mfp-push
- cordova-plugin-mfp-jsonstore
- cordova-plugin-mfp-fips
- cordova-plugin-mfp-encrypt-utils
The cordova-plugin-mfp provides the MobileFirst SDK and is required. See Cordova plug-ins for MobileFirst features for information about the function of each of the other plug-ins.
Procedure
- To review the readme file for the plug-ins that we want, navigate to the download page for each one on the npm web site in your web browser. Use one or more of the following URLs, depending on the plug-in:
- https://www.npmjs.com/package/cordova-plugin-mfp
- https://www.npmjs.com/package/cordova-plugin-mfp-push
- https://www.npmjs.com/package/cordova-plugin-mfp-jsonstore
- https://www.npmjs.com/package/cordova-plugin-mfp-fips
- https://www.npmjs.com/package/cordova-plugin-mfp-encrypt-utils
Note: We can also download the compressed (.zip) file packages from JazzHub. Click the link that starts with hub.jazz.net from the npm page for a given plug-in to reach the download page.
- On your local system, navigate to the root folder of your Cordova app.
- Run one of the following commands, depending on which plug-ins we want to install.
Note: The following steps use the Cordova CLI. If you are using different Cordova-compatible tools, the procedure might differ.
Important: Check your app's components for compatibility issues, to make sure that they will work with the latest plug-ins. The latest available versions of plug-ins will be downloaded by default with the commands described in this step. To download a specific version of a plug-in, specify the version number by using the syntax cordova plugin add plugin_name@version. For example, to download the latest published plug-in for IBM MobileFirst Platform Foundation 8.0, use cordova plugin add cordova-plugin-mfp@8.0. If we want to import a specific version such as 8.0.2016021411, replace with the version number you are using, including the major minor and patch numbers. The patch number is in the format YYYYMMDDHH.. For example: cordova plugin add cordova-plugin-mfp@8.0.2016021411.
IBM MobileFirst Platform Foundation
- To install the core MobileFirst Cordova plug-in:
cordova plugin add cordova-plugin-mfp
Or if you acquired the Cordova SDK from MobileFirst Operations Console
cordova plugin add <unzip_dir>/plugins/cordova-plugin-mfp
Where <unzip_dir> is the directory where you unzipped the acquired SDK.
- To install the cordova-plugin-mfp-push and cordova-plugin-mfp plug-ins:
cordova plugin add cordova-plugin-mfp-push
- To install the cordova-plugin-mfp-jsonstore and cordova-plugin-mfp plug-ins:
cordova plugin add cordova-plugin-mfp-jsonstore
- To install the cordova-plugin-mfp-fips and cordova-plugin-mfp plug-ins:
cordova plugin add cordova-plugin-mfp-fips
- To install the cordova-plugin-mfp-encrypt-utils and cordova-plugin-mfp plug-ins:
cordova plugin add cordova-plugin-mfp-encrypt-utils
Note: If you install cordova-plugin-mfp by itself, we can add the cordova-plugin-mfp-push , cordova-plugin-mfp-jsonstore , cordova-plugin-mfp-fips or cordova-plugin-mfp-encrypt-utils plug-ins later by specifying them with the cordova plugin add command.
Results
The IBM MobileFirst Platform Foundation SDK plug-ins for Cordova are installed.
What to do next
We can now start developing the IBM MobileFirst Platform Foundation capabilities in your Cordova app.To further develop your app with features that depend on the MobileFirst Server, register your app with the server. For more information, see Register Cordova applications from the MobileFirst Platform CLI.
Important: (Android and iOS development only.) If you are developing your app for the Android or iOS platforms, when you add the platform to our app that contains the cordova-plugin-mfp plug-in, an existing file in your app is replaced by a version of the file that is provided by MobileFirst Platform Foundation. These files are:
- Android: The file MainActivity.java is replaced. Your original MainActivity.java file is backed up and renamed MainActivity.original.
- iOS: File main.m is replaced. Your original main.m file is backed up and renamed main.m.bak.
If you made any changes to the original versions of these files, we must merge the changes that you made into the new version of the file that is provided by IBM MobileFirst Platform Foundation.
Parent topic: Create Cordova apps that include MobileFirst features