SPA App Conversion to Android

If you’re a web developer, you’re probably familiar with the Angular framework. It allows you to conveniently build SPA – single page applications.

In the age of hybrid apps, we are able to deliver a mobile application to the user instead of just a website. To achieve this, we will use a platform called Apache Cordova.

Below is a list of steps that will allow you to convert an application written in Angular into an APK file.

Step 1

Installing Android Studio SDK.

Step 2

Global Apache Cordova installation.

npm install -g cordova

Step 3

Creating a project.

cordova create hello-app-world-cordova com.example.hello Aplikacja

Step 4

Adding a platform. To do this, go to the directory of the created project and run the following command

cordova platform add android

Step 5

Now you need to merge the Angular and Cordova project files. To do this, copy all folders and files – except package.json, package-lock.json, node_modules, from the crodova project to the angular project.

Step 5

Next, you need to merge the contents of the package.json file from both projects. To do this, copy the missing dependencies from the Cordova project to the Angular project. Also, write the name variable with the value from the Cordova project.

Step 6

Open the index.html file in your Angular project and change the path to the one below.

Step 7

Now you need to change the build path of the application. The default path for Angular is /dist, and for Cordova /www. To do this, change the value in the angular.json file to /www.

Next, you need to build the applications.

ng build --prod --aot cordova build android

In this way, we have created an application that can be tested in a virtual Android device. To do this, open Android Studio and run Android Virtual Device Manager. Then execute the command below.

cordova emulate android

In order to make the application we have written available in the Play Store, a few more steps need to be completed.

First, we need to release our application.

cordova build --release android

Then you need to go to platforms/android/app/build/outputs/apk/release folder and generate a key.

eytool -genkey -v -keystore aplikacja.keystore -alias aplikacja -keyalg RSA -keysize 2048 -validity 10000

Once we have the key, we can proceed to sign the application. This is required to later share it.

jarsigner -verbose -sigalg SHA1withRSA -digestalg SHA1 -keystore aplikacja.keystore app-release-unsigned.apk aplikacja

The final step is to execute the command below.

zipalign -v 4 app-release-unsigned.apk app-release-signed.apk

This is how we got a signed application ready to be placed in the Play Store.