Hybrid Application Developer Interview Preparation Guide

Download PDF

Ionic provides a collection-repeat directive that renders only visible items in the DOM. So even if the list is huge, like 5000 in our example, only items visible in a viewport are rendered. Thus, scroll performance is not affected.

To run your app, all you have to do is enable USB Debugging and Developer Mode on your Android device, then run ionic cordova run android --device from the command line.

For,

☛ IOS: Xcode, iOS SDK
☛ Android: Android SDK, ADT plugin
☛ BlackBerry: Sun SDK, Apache ant and BlackBerry Webworks SDK
☛ Symbian: SDK

PhoneGap applications can be architect, in the same way, like other mobile web services. The main difference is that the initial HTML assets are available locally, instead of a remote server. The PhoneGap application loads the initial HTML which can request resources from a server or from the local environment. PhoneGap also supports the single page web experienced model.

To upgrade PhoneGap in Mac and Linux
$ sudo npm install –g phonegap

For Windows:
C:> npm install –g phonegap

☛ Even a small change needs a recompile that slows up the developers. This become a nightmare when the codebase is very large.
☛ Testing new functionality is cumbersome.
☛ Calls between native and interpreted environment could end up blocking UI thread.

Yes, this is not related to phonegap, but interviewer expects the answer!

Property lists are a way of structuring arbitrary data and accessing it at run-time. An information property list is a specialized type of property list that contains configuration data for a bundle. The keys and values in the file describe the various behaviors and configuration options you want applied to your bundle. Xcode typically creates an information property list file for any bundle-based projects automatically and configures an initial set of keys and values with appropriate default values. You can edit the file to add any keys and values that are appropriate for your project or change the default values of existing keys.

We use PhoneGap because it allows them to have a common codebase for all their application code. It doesn’t force developers to reinvent the wheel every time they move from platform to platform.

PhoneGap was donated to the Apache Software Foundation (ASF) under the name Apache Cordova. Through the ASF, future PhoneGap development will ensure open stewardship of the project. It will remain free and open source under the Apache License, Version 2.0.
PhoneGap is an open source distribution of Cordova. Think about Cordova’s relationship to PhoneGap like WebKit’s relationship to Safari or Chrome.

XML based layouts provide standard means of setting up the User Interface definition format

Activities are like windows to a user interface. Activities play same role of windows for input and output operations though it may not be always in the form of user interface.

Intents display notification messages to the user from within Android device. It can be used to alert the user also for a particular state of the App

☛ The platforms phone gap supports are
☛ iphone/iphone 3G and Higher
☛ Blackberry os 5.x and Newer
☛ Android
☛ Web OS
☛ Tizen
☛ Windows Phone 7
☛ Symbian
☛ Bada

☛ deviceready
☛ pause
☛ resume
☛ online
☛ offline
☛ backbutton
☛ batterycritical
☛ batterylow
☛ batterystatus
☛ menubutton
☛ searchbutton
☛ startcallbutton
☛ endcallbutton
☛ volumedownbutton
☛ volumeupbutton

☛ Ionic
☛ Mobile Angular UI
☛ Intel XDX
☛ Appcelerator Titanium
☛ PhoneGap
☛ Kendo UI

☛ PhoneGap: It is a framework for mobile application development, built upon the open source Apache Cordova project. It permits you to write an app once with CSS, JavaScript, HTML and then deploys it to a broad range of mobile devices without losing the features of a native app.
☛ PhoneGap Build: It is a cloud-based service built on top of the PhoneGap framework.

PhoneGap is an open source framework, which enables you to develop applications for mobile devices by using web technologies like CSS3, JavaScript and HTML5 instead of using Java for Android, C# for windows phone devices and Objective C or Swift for iOS. It uses the native project format for each platform.

Ionic does not provide a camera API out of the box. However, since Ionic uses plugins architecture, and because it is based on Cordova, we can use Cordova plugins in our application. Ionic team provides a set of Cordova extensions with Angular wrappers, and they can be found at ngCordova.

To use Cordova plugins, we need to install the plugin using Ionic command install <plugin name>. In some cases, we will additionally need to add the plugin’s Angular module to your Angular application too.

To use a mobile phone’s camera in the Ionic application, we can call the camera API by using cordova-plugin-camera that is hosted on GitHub. This plugin defines a global navigator.camera object, which provides an API for taking pictures and for choosing images from the system’s image library.

Ionic framework uses the default web browser available for the device to run its hybrid application. Older versions of Android devices (4.0-4.3) use Android’s default browser, which has significantly less performance and standards compliance than the modern Chrome browser.

One way to resolve this issue is to use crosswalk along with Ionic framework. Crosswalk allows you to package a modern Chrome webview along with Ionic application, so an application does not have to rely on native Android browser. The end results are much better performances and modern web API across all Android versions.

Ionic uses AngularJS and UI-router. It means you can use Angular services or UI-router’s state resolve to pass data from one view to another. Since Angular services are singletons, data stored in services can be accessed across other Angular controllers.

As mentioned, UI-router provides a resolve configuration. For example:

$stateProvider
.state('todos', {
url: '/todos',
controller: 'TodosCtrl',
templateUrl: 'todos.html',
resolve: {
todos: function(TodosService) {
return TodosService.getTodos()
}
}
})
One advantage of resolve over stateful services is better testing: as resolve injects dependencies in the controller, it is easy to test them.

The most obvious advantages are:

☛ Ionic framework builds hybrid applications using web technologies. It means web developers can easily build mobile applications too. Also, because it uses JavaScript, almost the same codebase can be used to build both iOS and Android applications.
☛ Development cost is less compared to native iOS and Android applications.
☛ Ionic framework is excellent for quick application ideas prototyping.

Some of the disadvantages are:
☛ It is not suited for high-end graphics dependent applications or games.
☛ Performances are not as good as native applications, namely animations, scrolling, and network operations.
☛ As mentioned, JavaScript animations are not as performant as native animations. However, there are JavaScript libraries, like tweenMAX, which provide decent animation performance on the devices.

Since Android is an open source format, different Android OS have been released in different devices on different versions and upgrades. An App developed for particular OS may or may not run on another version and developer need to analyse and correct the code

PhoneGap is a library that exposes native mobile phone functionalities as JavaScript API. When Adobe purchased PhoneGap, its open source core was donated to the Apache Software Foundation under the name Cordova. In the beginning, there was almost no difference between Cordova and PhoneGap. Although, over the years of development, Adobe started adding a proprietary set of the services to PhoneGap. Today, it is safe to say PhoneGap is Cordova plus extra Adobe services.

Ionic uses Cordova, not PhoneGap for its core tools. Beside native mobile phone functionalities, Ionic gives structure and code scalability to JavaScript applications by using AngularJS. It also provides a set of Angular directives and components to speed up application development.

Some of the PhoneGap API are

☛ Accelerometer
☛ Camera
☛ Capture
☛ Compass
☛ Connection
☛ Contacts
☛ Device
☛ Geo-location and so on

PhoneGap plugin contains two files
☛ JavaScript file that defines the function for accessing the native hooks
☛ Implementation files written in the native language to co-ordinate with native phone features

To create your own PhoneGap plugins, you have to
☛ Make a new directory in your ${PROJECT_DIR}/plugins directory
☛ Make a JavaScript file within that new directory
☛ Make a new Objective-C class that extends the PhoneGap command class and also in the new directory

☛ seekTo in OpenGap Media API is a function that updates the latest position of the underlying audio file of a Media Object
☛ getDuration is a function that returns the duration of the audio file in seconds. It will return the value -1, if the duration is unknown