U sljedećem članku ćemo pogledati Ionic Framework i kako se može instalirati na Ubuntu 20.04. Ovaj okvir će omogućiti korisnicima implementaciju projekata s drugim okvirima, poput Angular. Ionic je kompletni SDK otvorenog koda za razvoj hibridnih mobilnih aplikacija koji su kreirali Max Lynch, Ben Sperry i Adam Bradley iz kompanije Drifty Co. 2013. Originalna verzija objavljena je 2013. godine i izgrađena je na vrhu AngularJS -a i Apache Cordove. Međutim, najnovija verzija je obnovljena kao skup web komponenti, koje omogućuje korisniku da odabere raditi Angular, React ili Vue.js projekte. Takođe dozvoljava upotrebu jonskih komponenti bez ikakvog okvira korisničkog interfejsa.
Jonski pruža alate i usluge za razvoj hibridnih desktop, mobilnih i progresivnih web aplikacija zasnovanih na savremenim praksama i tehnologijama za web razvoj. Za to se mogu koristiti web tehnologije poput CSS, HTML5 i Sass. Pomoću ovog okvira možemo razvijati aplikacije sa web tehnologijama kompatibilnim sa iOS, Android ili samim internetom. Također nudi snažan CLI alat s kojim ćemo moći upravljati i stvarati projekte.
Opće karakteristike Ionic -a
- Ovaj okvir je besplatan i otvorenog koda. Nudi biblioteku alata i komponenti optimiziranog za mobilno sučelje optimiziranih za mobilne uređaje s kojima se stvaraju brze i visoko interaktivne aplikacije.
- Ionic koristi Cordovu, i u novije vrijeme dodaci za pristup funkcijama operativnog sistema domaćina, poput GPS-a, kamere, svjetiljke itd.
- Korisnici mogu izraditi svoje aplikacije, a zatim ih prilagoditi za Android, iOS, Windows, stolna računala (s Electronom) ili moderne preglednike.
- Jonski uključuje pokretne dijelove, tipografiju ili proširivu osnovnu temu.
- Kada se koristi Web komponente, Ionic nudi prilagođene komponente i metode za interakciju s njima. Jedna od tih komponenti, virtualno pomicanje, omogućava korisnicima da se kreću kroz listu hiljada stavki bez utjecaja na performanse. Još jedna komponenta, Tabs, stvara sučelje s karticama koje podržava navigaciju u izvornom stilu i upravljanje statusom povijesti.
- Osim SDK -a, Ionic također nudi usluge koje programeri mogu koristiti za omogućavanje funkcijakao što su implementacije koda ili automatizirane verzije.
- Takođe pruža vlastiti IDE poznat kao Ionic Studio.
- Takođe nudi interfejs za Komandna linija (CLI) za kreiranje projekata. CLI takođe omogućava programerima da dodaju dodatne Cordovine dodatke i pakete, omoguće push obaveštenja, generišu ikone aplikacija, uvodne ekrane i kreiraju izvorne binarne datoteke.
Instalirajte Ionic na Ubuntu 20.04
Instalacija ovog okvira je prilično jednostavna. Za početak je potrebno samo otvoriti terminal (Ctrl + Alt + T) i ažurirajte naše sistemske pakete:
sudo apt update; sudo apt upgrade
Onda hoćemo instalirajte neke potrebne pakete. U istom terminalu morat ćemo koristiti naredbu:
sudo apt install curl gnupg2 wget git
Sljedeći korak će biti instalirajte NodeJS. Ovaj primjer sam testirao s verzijom 14.x. Da biste instalirali ovu verziju, počet ćemo dodavanjem potrebnog spremišta:
curl -sL https://deb.nodesource.com/setup_14.x | sudo bash -
Onda možemo instalar NodeJS izvođenje ove druge naredbe:
sudo apt install nodejs
Ionic -u je potreban Apache Cordova. Treba pojasniti da se radi o skupu API -ja uređaja koji razvojnim programerima mobilnih aplikacija, koristeći JavaScript, omogućuju pristup izvornim funkcijama uređaja, kao što su kamera ili mjerač ubrzanja.
Nakon instaliranja NodeJS -a, možemo instalirajte cordova trčanje:
sudo npm install -g cordova
Na ovom mjestu možemo preći na instalirajte Ionic pomoću npm:
sudo npm i -g @ionic/cli
Nakon instalacije možemo provjerite instaliranu verziju pomoću naredbe:
ionic -v
Primjer aplikacije
Da bismo znali je li instalacija ispravno izvedena, možemo početi stvaranjem malog primjera aplikacije. Da bismo to učinili, samo ćemo morati pokrenite sljedeću naredbu kreirajte primjer:
ionic start
Prilikom izvršavanja ove naredbe morat ćete definirati koju vrstu projekta želite stvoriti. Za ovaj primjer odabrao sam Angular. Osim toga, morat ćete svom projektu dati naziv i odabrati predložak. Sve ovo morate odabrati s ekrana sličnog sljedećem:
Nakon postavljanja, mapa će biti generirana s imenom koje smo dali projektu. Pristupite ovoj mapi da vidite strukturu projekta.
Da budem u stanju pogledajte projekat, u istom terminalu ćemo izvršiti ovu drugu naredbu:
ionic serve --host 0.0.0.0 --port 8000
Ovom naredbom dozvolit ćemo svakom hostu pristup port 8000.
Kad se napuni sve što vam je potrebno, otvorite web preglednik i idite na http://localhost:8000 o http://IP-de-tu-servidor:8000 i vidjet ćete stranicu s primjerom koja je upravo stvorena.
Ionic je moderan okvir koji nam omogućava razvoj aplikacija na više platformi na jednostavan i elegantan način. Može se dobiti više informacija i dokumentacije o njegovoj instalaciji i radu u web stranica projekta.