Introduction to Ionic

What is Ionic?

Ionic Framework is an open-source UI toolkit for building cross-platform applications using HTML, CSS, and TypeScript with integrations for popular frameworks such as Angular, React, and Vue.

Why should you learn Ionic?

Out of the numerous other mobile development frameworks that are available, why should you choose to develop with Ionic?

In our opinion, Ionic offers the best feature set and product/service ecosystem of any mobile development framework on the market today.

Built to work seamlessly with both Apache Cordova and Angular, Ionic brings the features and functionality of those frameworks while providing a generous library of pre-built components and device plugins to choose from. All of these are based on modern standards and can be built on by other developers.

In addition to these technologies, Ionic is free to download and use.

A brief history: 2007 to the present

The first smartphone

As mobile app developers, we’ve come a long way since the first introduction of the iPhone at the Macworld Conference & Expo in January 2007, followed by the commercial release of Android in September 2008.

Both events sparked global interest in smartphones, and public adoption quickly followed. Still, developers had one major stumbling block–users couldn’t join the party unless they used platform-specific APIs.

This meant developers had to learn Objective-C (iOS), Java (Android), and C# (Windows Mobile) if they wanted to develop apps for these popular mobile platforms (despite Windows Mobile rating a very distant third compared to iOS and Android).

Unfortunately, this issue of platform-specific APIs also brought with it the cost, complications, and headaches of having to plan, create, debug, publish, maintain, and coordinate separate codebases for the same app for each platform.

This was, understandably, not the most attractive proposition for any development team or a client looking to manage their time, resources, and financial expenditure.

Apache Cordova and Adobe PhoneGap

In 2009, an iPhoneDevCamp event in San Francisco provided an opportunity for two developers to start exploring an idea that would change this approach.

Rob Ellis and Brock Whitten began work on a development framework that would allow web developers to create mobile apps by simply packaging HTML5, CSS, and JavaScript code that they had written into native containers that could be published for specific mobile platforms.

This framework eventually morphs into the free, open-source Apache Cordova project and the separate but similar Adobe PhoneGap service.

Note: Note: As of August 2020, Adobe PhoneGap has been retired from service. Sadly, in this industry, today’s hot technology can quickly become tomorrow’s abandoned legacy tool.

Now there was no need for a developer to learn Objective-C, Java, or C# to develop mobile apps. They could stick with standard day-to-day web technologies and package these into native containers instead.

As if this wasn’t groundbreaking enough, developers could also now use one codebase to publish to different platforms. Opportunities for mobile app development were finally accessible to web developers without the burden of learning multiple other languages.

Hybrid apps

Thanks to this innovation, hybrid apps were not only a reality but were now available at a fraction of the cost and time of “traditional” native apps.

Aside from the saved cost and time of not creating and maintaining many separate codebases for the same app, these hybrid app development frameworks also provided developers with a vital tool—a plugin architecture offering a simple but powerful JavaScript API.

This allowed for device functionality such as geolocation, image capture using camera hardware, or address book access integrated directly through JavaScript. This gave hybrid apps a tremendous amount of parity with their native counterparts (although there were still some notable differences in performance at the time, particularly with intensive gaming applications).

In addition, the aesthetics and user experiences, such as a smooth transition from one screen view to the next or a standardized UI could now be handled using different front-end development frameworks, including Onsen UI, Framework 7, jQuery Mobile, Sencha Touch, Kendo UI, or Ionic Framework.

Thus, with a little over a decade since the release of the first iPhone, app development has and continues to evolve at a rapid pace with no signs of slowing any time soon.

As developers, we now have the flexibility and freedom to code for iOS, Android, Windows, or all three platforms using a set of primarily free, open-source tools without having to learn a variety of programming languages in the process. This was impossible to accomplish back in the nascent days of mobile app development.

Ionic is just one of these open-source tools and is the particular app development framework that we will focus our attention on over this course.