I den neste artikkelen skal vi ta en titt på Ionic Framework, og hvordan det kan installeres på Ubuntu 20.04. Dette rammeverket lar brukerne implementere prosjekter med andre rammer som Angular. Ionic er en full åpen kildekode SDK for hybrid mobilapputvikling skapt av Drifty Co s Max Lynch, Ben Sperry og Adam Bradley i 2013. Den originale versjonen ble utgitt i 2013 og bygget på toppen av AngularJS og Apache Cordova. Den siste versjonen ble imidlertid gjenoppbygd som et sett med webkomponenter, som lar brukeren velge å gjøre Angular-, React- eller Vue.js -prosjekter. Det tillater også bruk av ioniske komponenter uten rammeverk for brukergrensesnitt.
ionic tilbyr verktøy og tjenester for å utvikle hybrid desktop, mobile og progressive webapplikasjoner basert på moderne webutviklingspraksis og teknologier. For dette kan webteknologier som CSS, HTML5 og Sass brukes. Med dette rammeverket kan vi utvikle applikasjoner med webteknologier som er kompatible med iOS, Android eller selve nettet. Det tilbyr også et kraftig CLI -verktøy som vi vil kunne administrere og lage prosjekter med.
Generelle egenskaper ved Ionic
- Dette rammeverket er gratis og åpen kildekode. Det tilbyr et bibliotek med mobiloptimaliserte brukergrensesnittverktøy og komponenter for å lage raske og svært interaktive applikasjoner.
- Ionic bruker Cordova, og mer nylig plug-ins for å få tilgang til vertsoperativsystemfunksjoner som GPS, kamera, lommelykt, etc.
- Brukere kan lage applikasjonene sine og deretter tilpasse dem for Android, iOS, Windows, desktop (med elektron) eller moderne nettlesere.
- ionic inkluderer bevegelige komponenter, typografi eller et utvidbart grunntema.
- Ved bruk Nettkomponenter, Ionic tilbyr tilpassede komponenter og metoder for å samhandle med dem. En av disse komponentene, virtuell rulling, lar brukerne bla gjennom en liste over tusenvis av elementer uten ytelsespåvirkning. En annen komponent, Tabs, oppretter et grensesnitt med faner som støtter navigasjon i naturlig stil og historikkstatusbehandling.
- I tillegg til SDK, tilbyr Ionic også tjenester som utviklere kan bruke for å aktivere funksjonerfor eksempel kodeimplementeringer eller automatiserte builds.
- Også tilbyr sin egen IDE kjent som Ionic Studio.
- Det tilbyr også et grensesnitt av Kommandolinje (CLI) for å lage prosjekter. CLI lar utviklere også legge til flere Cordova -plugins og -pakker, aktivere push -varsler, generere appikoner, sprutskjermbilder og lage native binære filer.
Installer Ionic på Ubuntu 20.04
Installasjonen av dette rammeverket er ganske enkel. For å starte trenger vi bare å åpne en terminal (Ctrl + Alt + T) og oppdater systempakker:
sudo apt update; sudo apt upgrade
Så vil vi installer noen nødvendige pakker. I den samme terminalen må vi bruke kommandoen:
sudo apt install curl gnupg2 wget git
Det neste trinnet blir installer NodeJS. Dette eksemplet har jeg testet med versjonen 14.x. For å installere denne versjonen, Vi starter med å legge til det nødvendige depotet:
curl -sL https://deb.nodesource.com/setup_14.x | sudo bash -
Da kan vi installere NodeJS kjører denne andre kommandoen:
sudo apt install nodejs
Ionic krever Apache Cordova. Det bør presiseres at dette er et sett med enhets -APIer som lar utvikleren av mobile applikasjoner, ved hjelp av JavaScript, få tilgang til enhetens funksjoner, for eksempel kameraet eller akselerometeret.
Etter å ha installert NodeJS, kan vi installere cordova løping:
sudo npm install -g cordova
På dette tidspunktet kan vi gå videre til installere Ionic ved hjelp av npm:
sudo npm i -g @ionic/cli
Etter installasjonen kan vi sjekk installert versjon med kommando:
ionic -v
Et eksempel på applikasjon
For å vite om installasjonen er utført riktig, kan vi starte med å lage et lite eksempelprogram. For å gjøre dette må vi bare kjør følgende kommando, opprett eksemplet:
ionic start
Når du kjører denne kommandoen du må definere hvilken type prosjekt du vil lage. For dette eksemplet har jeg valgt Angular. I tillegg må du gi prosjektet et navn og velge malen. Alt dette må du velge fra en skjerm som ligner på følgende:
Etter oppsett, en mappe vil bli generert med navnet vi har gitt til prosjektet. Gå til denne mappen for å se prosjektstrukturen.
For å kunne se prosjektet, i den samme terminalen skal vi utføre denne andre kommandoen:
ionic serve --host 0.0.0.0 --port 8000
Med denne kommandoen vi vil gi enhver vert tilgang til port 8000.
Når alt du trenger er lastet, åpne nettleseren din og gå til http://localhost:8000 o http://IP-de-tu-servidor:8000 og du vil se eksempelsiden som nettopp ble opprettet.
Ionic er et moderne rammeverk som lar oss utvikle applikasjoner på tvers av plattformer på en enkel og elegant måte. Det kan fås mer informasjon og dokumentasjon om installasjon og drift i prosjektnettsted.