Introducing Ionic 4 Mobile Development

In this quick post, we'll learn about hybrid mobile development using Ionic 4.

Ionic 4 is now framework agnostic but still integrates seamlessly with Angular. The client side Javascript framework created by Google to build web apps and websites using TypeScript.

Hybrid Mobile Development

So what's a hybrid mobile app? and what's Ionic?

Hybrid mobile apps are simply apps which are developed using web technologies like HTML, CSS and Javascript but run on mobile devices like native apps do, with the help of a native wrapper.

Hybrid mobile development allows web developers to build apps for mobile devices using their web development skills such as HTML, CSS and Javascript and any related technology such as TypeScript and Angular. This eliminates the need to learn native languages such as Java or Swift for developing mobile apps.

One more nice thing about hybrid mobile apps - They allow developers to target multiple mobile paltforms such as Android, iOS and Windows with one code base so you don't need to create an app from scratch for each platform.

Since hybrid mobile apps are just web apps, you can run them as mobile apps using a native wrapper.

There are many native wrappers but the most popular and mature tool is Cordova.

The main role of Cordova is to provide a web view for loading and rendering your application.

Cordova has also another task which is allowing your application to use the native features of mobile devices such as the Camera, sensors and contacts list etc.

Cordova has many ready plugins to access the native features of mobile devices and developers can also create their own Cordova plugins.

What about Ionic 4

Ionic 4 is the latest version of the Ionic framework which uses Cordova and Capacitor to access native device features and provides web developers with ready mobile UI components.

Ionic 4 is framework agnostic which means you'll be able to use it with your preferable framework or library or with no framework at all.

Thanks to libraries like Ionic 4 you can leverage your web development skills to not just build web apps but also mobile apps for your clients or to implement your ideas and publish them to the app stores.

Ionic has a great community around it and it's one of the most popular hybrid mobile frameworks out there.

Developers around the world are starting to adopt Ionic.It's easy to learn if you are already a web developer also the Ionic marketplace and Ionic Themes can be very usefull if you want to buy or sell ready Ionic themes.

Is there any difference between native and hybrid mobile apps?

Yes, there are many differences between hybrid and native mobile apps such as, for example, the tools and languages used to develop them but the most important difference is performance.

A native app has always better performance since there is no middleware between the app and the device API (the native wrapper and web view in the case of hybrid apps).

But browsers (web views) are getting faster and also mobile devices become more powerfull each day making the difference in performance unnoticeable for the end user.

There are some types of apps that need every available bit of performance that mobile devices can offer so this kind of apps need to be native, but don't worry the majority of apps can be built with a hybrid approach and the end user will not see any difference.


That's all for the first part. In the next tutorial, we are going to setup our development environment for developing hybrid mobile apps using Ionic 4 and Angular 7.


Official Ionic 4

Blog post announcing Ionic 4

Note: We also publish our tutorials on Medium and If you prefer reading in these platforms, you can follow us there to get our newest articles.

You can reach the author via Twitter:

About the author

Ahmed Bouchefra
is a web developer with 5+ years of experience and technical author with an engineering degree on software development. You can hire him with a click on the link above or contact him via his LinkedIn account. He authored technical content for the industry-leading websites such as SitePoint, Smashing, DigitalOcean, RealPython, freeCodeCamp, JScrambler, Pusher, and Auth0. He also co-authored various books about modern web development that you can find from Amazon or Leanpub

Get our Learn Angular 8 in 15 Easy Steps ebook in pdf, epub and mobi formats, plus a new Angular 8 tutorial every 3 days.

comments powered by Disqus Protection Status