U prethodnom tekstu smo pokušali da objasnimo prednosti razvoja hibridnih mobilnih aplikacija kada je potrebno da mobilno rešenje funkcioniše na više platformi. Pored toga što je sam razvoj neuporedivo brži i jeftiniji, mnogo je više softverskih inženjera koji vladaju veštinama potrebnim za programiranje u HTML5 tehnologijama. U ovom nastavku pažnju ćemo posvetiti alatima i bibliotekama koje koristi Atamagai tim kada razvija hibridne mobilne aplikacije.
Šta je potrebno
Za razvoj hibridnih mobilnih aplikacija, pored standardnih alata i frejmvorka za razvoj HTML5 front-end rešenja, potrebne su vam još tri komponente:
- UI biblioteka sposobna da oponaša korisničko okruženje native mobilnih aplikacija
- Način da pristupite sistemskim funkcijama uređaja, na primer kontaktima ili GPS-u
- Alat za kompajliranje web aplikacije u native kod
UI biblioteka
U početku smo za prvu namenu koristili Sencha Touch biblioteku, ali se ona, zbog specifične organizacije, ispostavila kao suviše teška za brzo ovladavanje od strane manje iskusnih programera i u nekim delovima suviše zatvorena.
Zbog toga smo početkom 2014. godine, dok je još uvek bio u Alpha verziji, prešli na Ionic Framework, što se ispostavilo kao odlična odluka jer je to danas jedna od najzastupljenijih biblioteka za razvoj mobilnih web aplikacija. Ionic kao osnovu koristi Angular JS frejmvork, iza koga stoji Google, i koji je jedan od najpopularnijih JavaScript frejmvorka. Na to su nadograđene komponente korisničkog okruženja koje uključuju gotovo sve kontrole i elemente koji se mogu koristiti u mobilnim aplikacijama – od zaglavlja i toolbarova, preko sistema navigacije i različitih lista, do modalnih prozora, loadera i elemenata formi za unos podataka. Komponente se sastoje od JavaScript, HTML i CSS koda, a tu su i mnoge pomoćne funkcije koje značajno olakšavaju rad.
Dodatna prednost je što se u novijim verzijama Ionica gotovo sve kontrole mogu podesiti tako da se automatski prilagode platformi na kojoj se prikazuju. Tako će se, na primer, tabovi na iOS-u pojaviti u dnu ekrana, dok će na Androidu biti odmah ispod zaglavlja. Čak je i ugrađeni set ikonica prilagodljiv tako da se većina njih na odgovarajućem operativnom sistemu prikazuje u skladu sa standardima platforme.
Ionic je u međuvremenu razvio i paletu pratećih alata koji ubrzavaju rad i olakšavaju testiranje – od CLI (comand line interface) konzole, do Ionic View mobilne aplikacije koja testiranje na različitim telefonima pretvara u jednostavno i prijatno iskustvo. Tu je i Ionic Lab koji obezbeđuje brži pregled rezultata dok razvijate program i automatizovano instaliranje dodataka za komunikaciju sa operativnim sistemom uređaja.
Alat za kompajliranje
Kao alat za kompajliranje koristimo Apache Cordova sistem. Cordova, ranije poznata kao PhoneGap (u međuvremenu kupljen od strane Adobea i pretvoren u komercijalni servis koji kao osnovu koristi Cordova bilbioteku), pored toga što omogućuje prevođenje web aplikacije u native code, obezbeđuje i funkcije za komunikaciju sa sistemskim komponentama direktno iz JavaScripta, o čemu ću govoriti nešto kasnije.
Prevođenje u native aplikaciju praktično znači da će biti kreirana mobilna aplikacija za konkretnu platformu, koja se sastoji od web browsera u koji se onda učitava vaša hibridna web aplikacija. Naravno, stvar je nešto kompleksnija i sadrži i neke dodatne korake, poput prevođenja konfiguracionog fajla web aplikacije u manifeste mobilnih operativnih sistema. U svakom slučaju, rezultat je aplikacija koju možete da postavite na bilo koji repozitorijum aplikacija, bilo da je to Apple App Store ili Google Play Store. Mi smo bez problema postavljali naše hibridne mobilne aplikacije i na druge sisteme, poput Amazonovog ili ruskog Yandexa.
Sistemske funkcije
Cordova obezbeđuje i treću komponentu – način da iz JavaScript koda pristupate resursima uređaja. To praktično znači da na raspolaganje dobijate API pomoću koga iz web aplikacije možete da pozovete listu kontakata, očitate GPS koordinate, pokrenete fotografisanje kamerom telefona, postavite notifikaciju u zaglavlje operativnog sistema ili bedž na ikonicu aplikacije itd.
Svaka pojedinačna funkcionalnost omogućena je u obliku Cordova plugina, pri čemu se radi o otvorenom standardu tako da i nezavisni proizvođači mogu da kreiraju besplate dodatke za veoma specifične namene. Jedan od primera sa kojim imamo iskustva je komunikacija sa iBeacon proximity tehnologijama. Ionic je takođe razvio svoj set komponenti koje koriste Cordova plugine i prevode njihov specifičan kod u veoma lako upotrebljive Angular JS direktive.
Zaključak
Malo je funkcionalnosti mobilnih platformi koje danas ne možete da implementirate kroz hibridne mobilne web aplikacije korišćenjem pomenutih biblioteka i alata. Pri tome će samo izuzetno iskusno oko primetiti bilo kakvu razliku u izgledu i ponašanju ovakvih aplikacija u odnosu na one koje su namenski pisane kao “native” programski kod. Čak i tamo gde postoje razlike, one su minimalne i zanemarive, tako da zaista retko opravdavaju dodatno ulaganje vremena i novca u native razvoj. Zbog toga očekujem da hibridne mobilne web aplikacije u vremenu koje sledi postanu još popularnije.