In this tutorial, you will learn how to port the jQWidgets eStore example to the BlackBerry 10 mobile operating system using PhoneGap/Apache Cordova.
Before you proceed with reading this tutorial, please make sure you are familiar with the beginner's BlackBerry 10 tutorial, which deals with how to set up your system and mobile device in detail.
We will be using the Windows operating system to create our eStore mobile application.
Open Command Prompt and create a new Cordova application, named eStore:
C:\>cordova create estore com.example.estore eStore
Enter the newly created project folder:
and add the BlackBerry 10 platform to it:
C:\estore>cordova platform add blackberry10
The next step is to include the application's source code and other necessary files
(including data sources and images) to the Cordova project. All these files should
be put in the
The files which have to be included are:
index.html- contains the app's HTML structure and references to all needed files. You can find the source code of
functionality.js- contains the app's functionality. You can find the source code of
laptops.txt- contains all the eStore product data;
jquery-1.11.1.min.js- jQuery script file;
jqx.base.css- main CSS file;
jqx.darkblue.css- Dark Blue theme file.
cordova.js- this file has to be referenced in
index.html, but does not have to be included in the
wwwfolder, beacause it is automatically added when the application is being built;
Here is the structure of the
www folder with all files included:
Build the project by typing:
Add a target to your project (Step 7 from the beginner's tutorial).
Finally, run your application:
C:\geoloc\>cordova run blackberry10
If a debug token is not yet set up for the device, an error message prompts you to use the platform run script instead with the password you provided when registering for signing keys:
C:\geoloc\>platforms\blackberry10\cordova\run.bat --device --keystorepass storepass123 --devicepass devicepass123
--keystorepassrefers to the password you provided when registering for signing keys (e.g.
--devicepassrefers to your device's password (e.g.
The application is now successfully installed! You can download the whole project from here.