Cordova:Cordova (formerly PhoneGap) allows to build cross-platform apps (Android, iOS, and others) based on web technology.
SDKs for targeted platforms: You need Android Studio for making Android apps, and XCode for developping iOS applications that run on iPhone.
Development Process by Example
1. Setup your Cordova project
Create a Cordova project. It can be done using the following command line:
cordova create Counter
Define your target platforms, by running the following command line in your project folder: cordova platform add ios android
2. Develop Your PharoJS App
2.1 Develop the HTML Side
Edit www/index.html file according to your app requirements. Our app rely on 2 buttons, and a DIV to display the counter's value. Each of these three HTML elements has an ID attribute that we'll use in our Pharo code.
<div id="countDisplay" class="countText">0</div>
<button id="incrementButton" class="incrementButton">Increment</button>
<button id="resetButton" class="resetButton">Reset</button>
Add a reference to the index.js that will be generated by PharoJS. So, the www/index.html file should include this line:
Fix the security policy in the index.html file to allow websockets connect from the app to the localhost. The meta tag for content security policy should be silimar to the following one:
>meta http-equiv="Content-Security-Policy" content="default-src ws://localhost:* 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">
2.2 Develop the Pharo Side
Define an app by creating a subclass of PjFileBasedWebApp. That is PjCounterCordovaApp in our example. Since in this example we focus is on the the process, we create PjCounterCordovaApp simply by copying the existing PjCounterBrowserApp
PharoJS does not have support for testing on mobile application. So, test must run in a web browser. If you rely on plugins, you need to use Mocks in your tests. In our example, simply copy the existing PjCounterBrowserAppTest, and name the new class PjCounterCordovaAppTest. This new test class should refer our new application class PjCounterCordovaApp.
Ensure that your app references the www folder of our Cordova project. The simplest way of doing this is simply running the tests defined in PjCounterCordovaAppTest. You'll get prompted to provide the folder. Use the displayed file browser and select the www folder or our project.
3. Run on Mobile
Export your PharoJS app for production, via the PharoJS Playground/PjCounterCordovaApp/export app menu. You can also do the same by evaluating PjCounterCordovaApp exportApp in a playground.
Test your app on mobile. First ensure your smartphone is connected via USB to your computer. Thenm launch your app by evaluating the following command line in your Cordova project folder:
For Android: cordova run android
For iOS: cordova run ios
4. Release the App on Public Stores
Setup the config.xml with your application info
Add images for splash screen and icons in the res folder of your Cordova project. You need to have them for all screen dimensions and resolutions.
Build the excutable and upload to the store. The hell starts here! Good luck especially with the Apple store.