Tag Archive for: Cordova

Get local html files (views/widgets) and insert them into your Cordova Single Page Application

Approach to load different views into an Android SPA.

  1. An index.html file with all the scripts, styles and so on.
  2. HTML, CSS and JS files at least as many as views in folders called view, css and js respectively and with the same names to not mess around. Ex: page.html, page.css and page.js
  3. We can use Axios to load views instead of the typical XMLHttpRequest that follows:

Dealing with keystores and passwords when building for Android with Cordova

Which is the easiest way of builing apps in Android with Cordova?

Use a build.json file

{
     "android": {
         "release": {
             "keystore": "./your_keystore_file",
             "storePassword": "your_keystore_password",
             "alias": "your_alias_name",
             "password" : "your_alias_password"
         }
     }
 }

And type in your console: cordova build android –release

If you already have a keystore and don’t know what alias to use, run the command: keytool -list -v -keystore YOUR_KEYSTORE_FILE to see all the available aliases.

Keystore only has one password. You can change it using keytool: keytool -storepasswd -keystore MY_KEYSTORE

Note: I’m locating my build.json and keystore_file in my project’s root folder.

Xamarin is not a good candidate for phone apps

A few days ago an acquaintance pass me an article about Xamarin as the new best candidate for phone apps. Sorry, but I’ve never laughed more in my life. He compered it with Phonegap (Cordova) telling me that it’s more powerfull… but the real thing is that it’s not and I’m going to tell you just some couple of good reasons.

  1. Xamarin only supports iOS, Android and Windows phone plataforms whereas Cordova supports iOs, Android, Windows, Amazon Fire OS, Backberry, Ubuntu, Firefox OS, LG webOS, etc.
  2. You have to pay to use Xamarin and it’s not Opensource whereas Cordova is Opensource and free.
  3. Xamarin doesn’t support Web Standards whereas Cordova supports Web Standards.
  4. Both have access to the device API.
  5. Xamarin uses it’s own native interface whereas Cordova uses Web UI which is the most widespread.
  6. Neither of both have a full native performance for all the platforms.
  7. Xamarin uses C# whereas Cordova uses HTML5, CSS and JavaScript.

However, the real comparison would be with Qt which uses C++ (a compiled language) but even Qt is better, more mature, more tested, opensource and free, and with even more supported platforms.

So, if you want to lose your time and make things go slower, feel free to use Xamarin. I think at the end some people are as blind with Technologies and Brands as they are with Politics and Religions. You can’t argue with them because they don’t like the proofs and the truth (they feel like you were attacking their physical integrity) or maybe you are a C# programmer who doesn’t want to learn new technologies in your life (more reasonable).

And why not use Qt? Well, I’ve been developing with Qt since 2007, when I was at the University (before tablets, phones and wearables boom). Qt is really heavy, complex, with a steep learning curve if you want to create awesome interfaces. One of the best things was its access to the device API (cross platform) but Web Technologies have caught it up.

We advance to make easier, open and powerful apps. I know, it’s hard to forget what you’ve learned but you have to deal with it because at the end you will thank yourself.

 

 

How to make a mobile app?

cordova-logo

In this tutorial I’m going to explain you step by step how I make phone apps using Cordova (Phonegap/Ionic) and Ubuntu.

1) Install Cordova

For those who don’t know anything about Cordova, it is an opensource platform for building multiple platforms applications using HTML, CSS and JavaScript. The main different between Cordova and Phonegap is that the second one gets the Cordova code and redistributes with some Adobe rights, now it’s free but maybe tomorrow who knows, my recommendation is to use Cordova that apart of this is always more updated!

So, first step you have to install Cordova, open a shell in Ubuntu and type:

$ sudo npm install -g cordova

Any problems? See the Cordova documentation.

2) Install Platform

After that you need to install a platform, in this example we are going to develop an Android app so you have to install the Android SDK.

I recommend you to install Android Studio that brings you the SDK and many extra tools in an user friendly access. Get Android Studio.

Once you download it and unzipped it, you have to run it the first time to install everything. If you set android-studio in your home folder, it will create an Android folder with the SDK.

3) Add Android SDK to your “PATH”

Make Android SDK accessible in your environment (system)

Open a shell and type:

$ nano ~/.bashrc

Then you need to add to your “PATH” variable where your SDK and Gradle are.

export ANDROID_SDK_ROOT=~/Android/Sdk
export PATH=${PATH}:~/Android/Sdk/tools:~/Android/Sdk/platform-tools:~/android-studio/gradle/gradle-5.1.1/bin

After that, reload bashrc, if not it will not have any effect.

$ source ~/.bashrc

Note: you need to set your own path and names for the Android SDK, I used my “home” folder and default Android Studio’s folders.

4) Install Text Editor / IDE

Use the one you feel more confortable, my favorites are: Atom and VSCodium.

5) Create your App

$ cordova create myApp
$ cd myApp
$ cordova platform add android
$ cordova run --debug --device

Now you can start programming! HTML, CSS and JavaScript files are in the “www” folder.

Remember you need to activate developer options in your Android phone.

If you have any access problem (EACCES)  to your android-studio folder.

$ chmod 777 -R ~/android-studio/

Enjoy 🙂

Here if you want you can download my Cordova logo and use it for free: Cordova logo