The Official Ionic Blog

Build amazing native and progressive web apps with HTML5

ionic-native-header

The very best mobile apps take full advantage of the amazing features available to them natively on iOS and Android devices. Whether that’s taking pictures, connecting to devices through bluetooth, using the accelerometer, or authenticating with finger scanning, apps need to do it all.

One of the biggest myths about Cordova/PhoneGap is that it can’t access the same native SDK features that a pure native app can. It’s patently untrue, but it’s such a common misconception that we’ve invested quite a bit of energy into projects and documentation to show Ionic developers that they have the full power of the Native SDKs at their fingertips.

One of the reasons this misconception might exist is a lack of a central repository for all the available native plugins that Ionic/Cordova/PhoneGap developers can throw into their project. It’s hard to know what’s available when plugins are scattered about and only available through tedious digging through npm and GitHub repos.

Say hello to Ionic Native

A few months ago, we launched Ionic Native both to solve the problem of finding the right native Cordova plugins your app needs and to make them easier to use and more consistent in their APIs. To that end, Ionic Native wraps each supported plugin with simple TypeScript decorators that add Promise, Observable, and Typing support to plugins that rarely support them by default. Additionally, Ionic Native makes each plugin available as a module that can be imported in any standard TypeScript or ES6+ project, and each plugin is given a consistent API and naming convention to avoid having to find your plugin instance on window or navigator or some other custom namespace.

To top it off, Ionic Native comes with some nice debugging features to help you quickly figure out when a plugin was used but was not installed, or when Cordova is not available:

Screenshot 2016-07-26 13.31.19

Today, we’re excited to announce the latest version of the project, Ionic Native 1.3.9. Huge thanks to Ibrahim Hadeed, who has become defacto maintainer of the project, for making this release happen. With his help, the project has grown from a meager 10 plugins to nearly 75 at today’s count. Both ngCordova and Ionic Native became major community efforts, and we are so thankful for Ibrahim’s awesome work on this project.

Moving on from ngCordova

For those in the community that have used our similar project for Angular 1, ngCordova, it’s now time to say good bye to that project. As of Ionic Native 1.3.0, Angular 1 is now supported out of the box, with practically identical service and API names as ngCordova. Plugin support is now on par or better than ngCordova, and we’re baking Ionic Native by default into all new Ionic 2 projects, so usage should be much higher than with ngCordova. Additionally, ngCordova was bound to Angular 1, and Ionic Native is framework agnostic.

To start using Ionic Native in Ionic 1 projects, include the bundle file in the latest release, and change your import from ngCordova to ionic.native. Many calls should Just Work, but take a look at the docs to see what needs to be changed. You’ll need to prefix each Class name with $cordova before injecting and calling it. For example: $cordovaCamera.

Looking Ahead

One of the expressed goals of PhoneGap was to become irrelevant, to treat native functionality as if it was just a regular Web API, and then remove the native code as Web APIs caught up. As native functionality continues to proliferate, it’s becoming clear that web browsers have a lot of work to do to catch up to the same functionality available to native mobile app developers. Projects like PhoneGap and Cordova are more important than ever, as they continue to enable rapid and quality app development through web technologies we all love, while still offering the same native SDKs that app developers need.

Our goal at Ionic is to continue to foster this incredible ecosystem through curation projects like Ionic Native, but also through development of our own Cordova plugins, like our new Deeplinking plugin.

We hope you enjoy Ionic Native and find it useful. Let us know what you think and, if you like it, send us some star power over at the Ionic Native GitHub repo. Also, take a look at the new Ionic Native Docs for a full sampling of all the native magic available.

giphy (1)

  • http://javebratt.com Jorge Vergara

    I love Ionic Native, just used it last weekend to build an app with Social Sharing, got it working in under 5 minutes, very easy to use 🙂

  • Tom McLellan

    Awesome! While building in Ionic 1 it was easy to lose a lot of time troubleshooting cordova plugins and library dependencies across different platforms – hopefully Ionic Native will make it easier. As Ionic 2 becomes a top framework for progressive web apps, there may be a lot of scenarios where the user experience has to be different depending on whether there’s a browser edition of the Ionic Native / cordova plugin. Hopefully we’ll see more browser implementations of Ionic Native plugins.

  • eric

    can it really work on ionic 1 without typescript?

    • yesimahuman

      Yes, the bundled version is just vanilla JS.

  • Sun

    How about performance vs ngCordova?

    • yesimahuman

      Performance should be slightly better due to the lack of the ng1 promise and digest overhead. Not a major factor though

  • http://tinyurl.com/owboe32 Amit Yadav

    I have already started using and its away better and easy to undertand

  • Phani Kumar

    Good, so if I add a type script will it add right plug in for both iOS and Android version?

  • theefer

    Awesome milestone teached! Thanks!

  • http://mithsoft.in Nikhil Jauhari

    Ionic is really magical and now IonicNative, First time I
    ‘m loving any technology like this.

  • Chirag thaker

    Is ionic native is only for ionic v2 ??

    • yesimahuman

      No, it works for Ionic 1 and Angular 1. See the note about ngCordova above

  • Sergio Fiorotti

    BIRL!

  • veeco

    I’m new with ionic.. so with ionic native, we don’t need cordova anymore ?

  • hossam radi

    how can get current place using ionic native plugin