What is Apache Cordova?

In simple terms, Cordova is the piece of software that stitches the web application and the native application together. The Apache Cordova website states that:

"Apache Cordova is a platform for building native mobile applications using HTML, CSS and JavaScript."

Apache Cordova does not just stitch the web app with the native app, but it also provides a set of APIs written in JavaScript to interact with the native features of the device. Yes, you can use JavaScript to access your camera, take a picture, and send it in an e-mail. Sounds exciting, right?

To get a better understanding of what is happening, let's take a look at the following image:

As you can see, we have a web view where the HTML/CSS/JS code gets executed. This code can be a simple standalone piece of user interface; at best you are making an AJAX request to get some data from a remote server. Or, this code can do much more, like talking to the Bluetooth of the device and getting the list of devices in the vicinity.

Tip

For this chapter, you can also access the code, raise issues, and chat with the author at GitHub (https://github.com/learning-ionic/Chapter-2).

In the latter case, Cordova has a bunch of APIs that interface with the web view using JavaScript and then talk to the device in its native language (for example, Java for Android), thus providing a bridge between them. For instance, if you would like to know more from the JavaScript about the device in which your app is running, all you need to do is write the following code inside the JS file:

var platform = device.platform;

After installing the device plugin, you can also access the UUID, model, OS version, and the Cordova version of the device from inside the web view using JavaScript as follows:

var uuid = device.uuid;
var model = device.model;
var version = device.version;
var Cordova = device.Cordova;

We will deal more with Cordova plugins in Chapter 7, Cordova and ngCordova.

The preceding explanation was to give you an idea of how Mobile Hybrid apps are structured and how you can use device features from the web view using JavaScript.

Note

Cordova does not convert the HTML, CSS, and JS code to an OS-specific binary code. All it does is wrap the HTML, CSS, and JS code and execute it inside a web view.

So, you must have guessed by now that Ionic is the framework with which we build the HTML/CSS/JS code that runs in the web view and talks with Cordova to access device specific APIs.