Ionic Native pruža vašoj aplikaciji korištenje nativnih funkcionalnosti mobilnih uređaja, bez toga vaša Ionic aplikacija ne bi bila ništa više od obične web stranice umotane u formu mobilne aplikacije.
Kako je bilo prije? (Ionic 1 & Cordova)
Za vrijeme dok je vladao Ionic 1, koristili smo Cordova pluginove koji su nam također omogućavali korištenje nativnih funkcionalnosti, ali tada je još uvijek vladao mit da oni ne mogu pristupiti svim onim funkcionalnostima kojima može neka nativna mobilna aplikacija. Naravno da je to bilo netočno, ali Ionic/Cordova/PhoneGap developerima se bilo teško snaći jer nije postojalo jedno centralno mjesto koje bi na jednostavan način pružilo pregled svih dostupnih pluginova s detaljnom dokumentacijom. I tada je stigao Ionic Native.
Ionic Native
Ionic Native je stigao kako bi jednom udarcem ubio dvije muhe. Kao prvo na jednom mjestu možete pronaći sve dostupne pluginove, a kao drugo postali su jednostavniji za korištenje. Ukratko, svaki Ionic native plugin omotan je TypeScript dekoratorom koju mu daje podršku za Promise, Observable i Typing. To je posebno korisno kada se zna da većina tih pluginova nije imala tu vrstu podrške. Također, svaki se plugin može koristiti kao modul u vašem TypeScript ili ES6+ projektu.
Ako ste u trenutku kada je došao Ionic Native imali aktivan Ionic1/Angular1 projekt koji koristi ngCordova pluginove vjerujem da ste se već tada oprostili od njih i omogućili im novu mladost prelaskom na Ionic Native. Ako niste možete to učiniti na način da umjesto ngCordova uvezete ionic.native, objavio sam blog post o tome pod naslovom “Što je i čemu služi ngCordova unutar Ionic aplikacije?“. Prilikom prijelaza svakako provjerite dokumentaciju za svaki slučaj, iako bi većina trebala raditi bez ikakvih problema.
Kako se koristi Ionic Native?
Za početak potrebna je instalacija
|
1 |
npm install ionic-native --save |
Za potrebu ovog primjera recimo da želite dodati AdMob, Device i SQLite i da ćete ih sve dodati u home.ts
Instalirate ih naredbom
|
1 |
$ ionic cordova plugin add cordova-plugin-example-name |
I dodate u home.ts
|
1 |
import { AdMob, Device, SQLite, SQLiteObject } from 'ionic-native'; |
Ionic Native 3.x
Ionic Native 3.x stigao je ranije ove godine s podrškom za preko 130 nativnih funkcionalnosti. 3.x donosi drastično smanjenje paketa koda (reduced code bundle size). To se postiže na način da prilikom dodavanja plugina u projekt dodaje samo kod koji je potreban da bi taj plugin radio čime se postiže smanjenje od oko 15% u ukupnoj težini datoteka vezanih uz pluginove.
Druga velika prednost 3.x je mogućnost simuliranja (Plugin Mocking)rada bilo kojeg od 130 pluginova direktno u web pregledniku. Znači ne treba vam niti simulator niti fizički uređaj kako bi testirali određeni Ionic Native 3.x plugin. Ipak, moja preporuka i savjet je da svakako koristite neki fizički mobilni uređaj za testiranje jer on će vam dati pravu sliku onoga što radite i što trebate raditi.
Ionic Native 3.x ne možete koristiti u Ionic/Angular 1.x projektima. Međutim to ne bi trebao biti veliki problem jer imate Ionic Native 2.x
Kako se koristi Ionic Native 3.x?
Za početak potrebna je instalacija
|
1 |
npm install @ionic-native/core --save |
Nakon toga spremni ste za dodavanje pluginova. Za potrebu ovog primjera recimo da želite dodati AdMob, Device i SQLite i da ćete ih sve dodati u home.ts
Instalirate ih naredbom
|
1 2 |
$ ionic cordova plugin add cordova-plugin-example-name $ npm install --save @ionic-native/plugin-example-name |
I dodate u home.ts
|
1 2 3 |
import { AdMob } from '@ionic-native/admob'; import { Device } from '@ionic-native/device'; import { SQLite, SQLiteObject } from '@ionic-native/sqlite'; |
Zaključak
Razlog za ovaj blog post su nekolicina emailova koje sam primio, a koji se tiču nekih mojih tutorijala na ovom blogu koje su posjetitelji s manje ili više uspjeha išli rekonstruirati. Kamen spoticanja bili su pravi Ionic Native pluginovi jer imam seriju starijih blog postova koji koriste Ionic Native, a kasnije seriju blog postova koji koriste Ionic Native 3.x pa bi me posjetitelji znali pitati zašto je to različito tj. nije im bilo jasno jel to jednostavno moj stil ili to tako mora biti.
Kako god bilo nadam se da će ovaj blog post dati odgovor na ta pitanja i riješiti te nedoumice, kako za pitanja koja su mi stizala do sada tako i za pitanja koja će mi tek stići.
