Ionic Framework Interview Questions

IONIC

1) What is the Ionic CLI?

The official Ionic CLI, or Command Line Interface, is a tool that quickly scaffolds Ionic apps and provides a number of helpful commands to Ionic developers. In addition to installing and updating Ionic, the CLI comes with a built-in development server, build and debugging tools, and much more. The CLI can also be used to perform cloud builds and deployments, and administer your account on Ionic Pro.

2) Who created the Ionic Framework?

The Ionic Framework was created by Max Lynch, Ben Sperry and Adam Bradley of Drifty Co. in 2013. The initial version was based on AngularJS. After releasing an alpha version of the framework in November 2013, a 1.0 beta was released in March 2014, a 1.0 final in May 2015, and several 2.0 releases in 2016.

3) What are the most prominent advantages and disadvantages of building applications using the Ionic framework?

The most obvious advantages are:

  1. 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.
  2. Development cost is less compared to native iOS and Android applications.
  3. Ionic framework is excellent for quick application ideas prototyping.

Some of the disadvantages are:

  1. It is not suited for high-end graphics dependent applications or games.
  2. Performances are not as good as native applications, namely animations, scrolling, and network operations.
  3. 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.

4) What is the difference between PhoneGap, Cordova, and Ionic?

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.

5) What is Ionic ? What are the prerequisites for installing Ionic framework ?

Ionic is a mobile app development framework used to build hybrid apps. Hybrid apps are basically web apps running in a browser within a wrapper that  has access to the native platform layer. Ionic framework is an HTML5 framework. It needs a native wrapper like Cordova or PhoneGap in order to run as a native app. Ionic framework lets you maintain one codebase and create builds for both Android and iOS platforms.

NodeJS , npm are required in order to install Ionic. You need NodeJS 6.0.0+ or a higher version in order to install ionic. 

6) Explain Ionic lifecycle hooks

Every component in Ionic has a lifecycle. Ionic creates, renders the component, checks it when its data-bound properties change and destroys it finally. Ionic offers lifecycle hooks that provide a way to tap into these key moments and trigger an action when they occur. 

Ionic 2 & 3 had these lifecycle events : ionViewDidLoad, ionViewWillEnter, 

ionViewDidEnter, ionViewWillLeave, ionViewDidLeave, ionViewWillUnload, 

ionViewCanEnter, ionViewCanLeave. 

  • ionViewDidLoad : Fired only when a view is stored in memory, will not fire if view has been already cached. 
  • ionViewWillEnter : fired when entering a page, before it becomes active one. this event is triggered every time user enters in the view. 
  • ionViewDidEnter : fired when entering a page, after it becomes active page. 
  • ionViewWillLeave : fired when user leaves a page, before it stops being the active page. 
  • ionViewDidLeave : fired when user leaves a page, after it stops being the active page. 
  • ionViewWillUnload : fired when a view is going to be completely removed. 
  • ionViewCanEnter : this is a nav guard. fired before entering a view. Useful when you want to control access to pages based on access credentials. 
  • ionViewCanLeave : this is also a nav guard, fired before leaving a view. 

Allows you to control whether user can exit the view or not Ionic 4 provides the Angular lifecycle hooks in addition to the above listed Ionic lifecycle hooks. All the angular lifecycle hooks are available. 

  • ngOnChanges , ngOnInit, ngDoCheck, ngAfterContentInit, ngAfterContentChecked, 
  • ngAfterViewInit, ngAfterViewChecked, ngOnDestroy .

7) How to debug the Ionic app on a real device (Both Android and iOS)

Debugging is one of the crucial parts of any development. W.r.t to Ionic We can debug Android and iOS apps on Chrome or Safari Browser.

  • Android: To debug an Android app in real time, we need to follow below steps.
    • Enable developer mode on Android Mobile.
    • Run the app on the real device either by running ionic Cordova run android or build the apk by running ionic Cordova build android and transfer it to the phone.
    • Connect device to your computer with a USB cable and lunch Google Chrome browser and open URL chrome://inspect/#devices which will display your phone and app name. Click on inspect there.
    • Now you will be able to inspect the app and check the logs.
  • iOS: To debug the iOS app in real-time, we need to follow below steps
    • Run the app on the device by executing command ionic Cordova run-ios or build the app with ionic Cordova build ios and Xcode to launch the app on the phone.
    • Now open safari browser -> windows -> Enable developer options.
    • Now open developer -> Your phone -> localhost, now you will be able to debug the app in real-time.

8) How can you test Ionic applications?

Ionic v.1 applications are built using AngularJS. Angular has a rich set of test libraries and frameworks such as Jasmine and Karma test runner. These frameworks can be used to write unit tests for Ionic applications. Also, ionic-CLI provides live reload feature so the application can be tested in the browser. For example, the ionic serve command can be used to load the application in any browser. Thus, we can use Chrome Developer Tools or Mozilla Firefox with Firebug to debug and inspect Ionic applications.

9) What are some possible security issues with Ionic apps?

When building hybrid applications, security is a common issue, as long as your app can be reverse engineered. Since version 4, Ionic CLI does provide built-in code uglification — a common technique of making the code difficult to read by hackers. But you also need to know that if you are using Angular CLI or older versions of Ionic, there is no code uglification going on. Your developers will have to uglify the code on their own.

There are a lot of ways to compromise what’s happening with your mobile app or PWA, like a man-in-the-middle attack. Why does it matter? Well, because basically, your Ionic application is a website, running on the device. The important takeaway is that Ionic communicates with the backend using usual HTTP calls. So, you also want to use the security measures on your Ionic app that you use to protect your website, like using HTTPS connection instead of the HTTP.

10) How do you persist data between application launches using Ionic?

As Ionic behind the scene builds HTML5 based applications, you can use localStorage and sessionStorage API to persist data on the mobile phone. However, since localStorage can only store strings, objects need to be stringified before saving. Also, it is important to mention localStorage has size limit around 5MB.

11) What are the Pros and Cons of Ionic Framework?

Pros:

  • It Is Completely Free And it is considered As one Of The best Open-Source software For developing Hybrid Mobile Applications.
  • Angular Is Being Used Which Is By Default Embedded In The Ionic Framework.
  • It Is Mainly Developed In HTML, CSS, And JS and almost all developers are familiar with it.
  •  Apps developed on Ionic are very maintainable and easy to update.

Cons:

  • Ionic Applications may not be as safe/secure as The Native Applications.
  • Ionic Apps are not as fast as Native Apps
  • 3. The Ionic Apps may lack in native functionalities. In such cases, plugins have to be built.
    4. Testing can be tricky because the browser does not always give correct information about the phone environment.

12) What’s the difference between “ionic build” and “ionic prepare”?

ionic prepare <platform> copies all files from the www folder into the target platform’s www folder.

ionic build <platform> also does this, but also builds the app’s source code so that it can be run on a simulator/emulator or a device.

Leave a Reply

Your email address will not be published. Required fields are marked *