Mobile Hybrid architecture

Before we start working with Ionic, we need to understand the bigger picture of Mobile Hybrid development.

The concept is pretty simple. Almost every mobile operating system (also called platform, when working with Cordova) has an API to develop apps. This API consists of a component named WebView. A WebView is typically a browser that runs inside the scope of a mobile application. This browser runs the HTML, CSS, and JS code. This means that we can build a web page using the preceding technologies and then execute it inside our app.

We can use the same knowledge of web development to build native-hybrid mobile apps (here, native refers to installing the platform-specific format file on the device after it has been packaged along with the assets), for instance:

• Android uses Android Application Package (.apk)
• iOS uses iPhone Application Archive (.ipa)
• Windows Phone uses Application Package (.xap)

The package/installer consists of a piece of native code that initializes the web page and a bunch of assets needed to show the web page content.

This setup of showing a web page inside the mobile app container that consists of our application business logic is called a Hybrid App.