Building first Cordova application

We are going to build a cool app which use Apache Cordova, bluetooth, neuroheadsets and developed with JS+HTML. That’s all for perfect TuSion development. So let’s start. I will call such `dev arcticle` like that as a devshoot. Today is 2 July 2018 and I’m inside Bakovka settlement near Skolkovo in Moscow. Sorry but I will write for Windows course now I’m on Win).

We are going to do/to compile the same application as on the picture.

Our target is an Android App built with Cordova. In any case.

We need to install:

  1. Node (8.11.3)
  2. Cordova (8.0.0)
  3. JDK 1.8 (1.8.0_171)
  4. Android Studio (3.1.3)

After NODE installation please follow these Cordova instructions and see that guide for the Android platform.

Java. Install JDK 1.8 (JDK 1.10 is not supported now) and add $JAVA_HOME$ path variable. I also added $JAVA_HOME$/bin to $PATH. That’s all about Java.

Android. Create sample project (with Kotlin support:) ) in Android Studio. Studio will ask to sync & install build-tools. Install android-api-26 using Tools-> SDK Manager.

Android 8.0 (api 26) added.

For Cordova it is also needed to set $ANDROID_HOME$ variable.

Setting variables.

Now we need to create Android Virtual Device to run our Applications. Create api26 android device in Android Studio Tools-> AVM Manager. I have API28 device immediately after installation and we need to install also API26 device because 28 it’s not supported with Cordova today.

Create any virtual Android API-26 device.

After Cordova installing…

npm install -g cordova

Let’s create a sample app.

E:\space\cordov>cordova create sample_howto
Creating a new cordova project.
E:\space\cordov>cd sample_howtoE:\space\cordov\sample_howto>cordova platform
Installed platforms:
Available platforms:
android ~7.0.0
browser ~5.0.1
ios ~4.5.4
osx ~4.0.1
windows ~5.0.0
www ^3.12.0
E:\space\cordov\sample_howto>cordova platform add android
Using cordova-fetch for cordova-android@~7.0.0
Adding android project...
Creating Cordova project for the Android platform:
Path: platforms\android
Package: io.cordova.hellocordova
Name: HelloCordova
Activity: MainActivity
Android target: android-26
Subproject Path: CordovaLib
Subproject Path: app
...

Now build it.

E:\space\cordov\sample_howto>cordova build
Android Studio project detected
ANDROID_HOME=E:\Android\sdk
JAVA_HOME=E:\Program Files\Java\jdk1.8.0_171
studio
BUILD SUCCESSFUL in 2s
...
:app:assembleDebug
:app:cdvBuildDebug
BUILD SUCCESSFUL in 25s
47 actionable tasks: 47 executed
Built the following apk(s):
E:\space\cordov\sample_howto\platforms\android\app\build\outputs\apk\debug\app-debug.apk

Then we can got an error on listing android devices.

E:\space\cordov\sample_howto>cordova run android --list
Available android devices:
Available android virtual devices:
ERROR: TypeError: Cannot read property 'semver' of null
An unexpected error has occured while running list-emulator-images with code 2: Error: cmd: Command failed with exit code 2

Follow this we will change E:\space\cordov\sample_howto\platforms\android\cordova\lib\emulator.js on the 190th line. Then got smth like:

E:\space\cordov\sample_howto>cordova run android --list
Available android devices:
Available android virtual devices:
Nexus_5X_API_26
Nexus_5X_API_28_x86
Android_Accelerated_x86_Oreo

And it successfully launched only on the second time.

E:\space\cordov\sample_howto>cordova run android --target Nexus_5X_API_26
...
Waiting for emulator to start...
(node:18576) UnhandledPromiseRejectionWarning: CordovaError: Failed to execute shell command "getprop,dev.bootcomplete"" on device: Error: E:\Android\sdk\platform-tools\adb.exe: Command failed with exit code 1 Error output:
error: device still connecting
at E:\space\cordov\sample_howto\platforms\android\cordova\lib\Adb.js:88:25
### FAILED LAUNCH ###
### OK. Second one ###
E:\space\cordov\sample_howto>cordova run android --target Nexus_5X_API_26
Android Studio project detected
ANDROID_HOME=E:\Android\sdk
JAVA_HOME=E:\Program Files\Java\jdk1.8.0_171
studio
Subproject Path: CordovaLib
Subproject Path: app
publishNonDefault is deprecated and has no effect anymore. All variants are now published.
The Task.leftShift(Closure) method has been deprecated and is scheduled to be removed in Gradle 5.0. Please use Task.doLast(Action) instead.
at build_4u2vokdbpnlhtf4spbuoffpob.run(E:\space\cordov\sample_howto\platforms\android\app\build.gradle:143)
:CordovaLib:preBuild UP-TO-DATE
:CordovaLib:preDebugBuild UP-TO-DATE

The result is on next picture.

Apache Cordova app on Android. Fine!

If Cordova can’t launch AVD try to run it via AVM Manger.

Nearest future — to learn next stacked tabs:

  1. Evothings Studio and examples.
  2. Build Evothing apps with Cordova.
  3. Muse neuroheadset with JS.
  4. iOS Cordova plugin for NeuroSky support written by Jihyun Lee.
  5. Cordova Bluetooth LE Plugin.
  6. Flow usage. A static type checker for javascript.
  7. Nuclide with Cordova.
  8. Bluetooth Cordova plugin and other BT plugins.

The big plan is to create cross-platfrom iOS/Android app with Bluetooth neurodevices support with any JS game engine combined with processing.js.

The next story is about how to fail with Muse lib.

Thanks a lot and sorry for the uncovered details ^^