Share
Så du har hørt om ionisk og du lurer på hvordan du kommer i gang? I denne opplæringen lærer du hvordan du oppretter et ionisk utviklingsmiljø på datamaskinen din, samt hvordan du oppretter et ionisk prosjekt.
Vel, gratulerer, hvis du ser denne artikkelen via en datamaskin, har du en av de viktigste forutsetningene for å utvikle ioniske apps: du vil kreve en fysisk PC (PC) for å gjøre det. Dette kan være en datamaskin som kjører Windows, Mac eller Linux.
Siden vi bygger ioniske apps ved hjelp av webteknologier, må du også installere webutviklingsverktøy. Dette inkluderer en nettleser (helst Google Chrome) for å kjøre og feilsøke appene våre, og en tekstredigerer (for eksempel Sublime, Atom eller Visual Studio Code) for å skrive og redigere koden vår. Hvis du er ny til utvikling, vil jeg anbefale Visual Studio Code som det er vanlig og gratis.
Med disse grunnleggende kravene installert på datamaskinen din, la oss fortsette og installere avhengighetene vi trenger for å bygge ioniske apps.
Dessverre er det ingen enkelt installasjonspakke som automatisk installerer et ionisk utviklingsmiljø på datamaskinen. Uavhengig av operativsystemet, må du installere hver av de nødvendige avhengighetene manuelt. Så la oss gå videre og begynne å sette opp vårt ioniske utviklingsmiljø.
Den første avhengigheten vi trenger å installere er Node.js, som er et JavaScript-rammeverk på serversiden. Vi vil bruke Node.js for sin nodepakkeadministrator (npm), som gjør at vi kan installere alle pakkene og verktøyene vi trenger for våre prosjekter. Vi vil også bruke Node.js til å kjøre en utviklingsservertjeneste som lar oss forhåndsvise apper i nettleseren.
Ionisk anbefaler at når du installerer Node.js, bør du velge den nyeste Long Term Support (LTS) versjonen. I mitt tilfelle, som du ser ovenfor, er det versjon 8.9.1 LTS. Ionisk anbefaler bruk av LTS-versjoner som de er mer stabile.
Så bare last ned LTS-versjonen, gå gjennom installasjonsinstruksjonene, og når installasjonen er ferdig, vil du være klar til å fortsette med neste trinn.
Med Node.js installert, er du nå klar til å installere Cordova og Ionic. Her kan ting bli litt vanskelig for noen, spesielt de som aldri har jobbet med Command Line Interface (CLI) før. Det kan alle se litt skremmende i starten, og du kan føle deg som om du kommer til å ende opp med å bryte noe på din elskede datamaskin! Vel, du vil ikke, så bare slapp av og prøv å følge med.
På Mac og Linux, søk etter Terminal, som er CLI vi skal bruke for å installere Cordova og Ionic. På Windows, søk etter kommandoprompt. Dette tilsvarer Terminal på en Windows-PC.
Med Terminal åpnet på Mac eller Linux, skriv inn følgende kommando og kjør den ved å trykke Tast inn på tastaturet ditt.
sudo npm installere -g cordova ionic
Deretter kan du bli bedt om å skrive inn et passord. Hvis det er tilfelle, skriv inn passordet du bruker til å logge på datamaskinen og trykk Tast inn en gang til.
Fra kommandoprompt på Windows skriver du inn følgende kommando og kjører den ved å trykke Tast inn på tastaturet ditt.
npm installere -g cordova ionic
Som du kanskje har lagt merke til, bruker vi Node Package Manager (npm) for å installere både Ionic og Cordova ovenfor, så det er av største viktighet å installere Node.js først! Du har kanskje også lagt merke til at på Mac og Linux bruker vi sudo foran kommandoen vår. Dette er nødvendig for å tillate installasjon av ionisk og Cordova globalt på disse systemene.
Installasjonsprosessen kan ta noen minutter, avhengig av Internett-tilkoblingen din, men når det er gjort, bør du se noe slikt:
Cool, så med ionisk og Cordova vellykket installert, la oss gå videre til neste avsnitt og installere tilleggsprogramvare vi trenger for å kunne bygge våre iOS- og Android-apper fra våre ioniske prosjekter.
Du trenger ikke nødvendigvis å installere disse programvareverktøyene akkurat nå; Du kan fortsette å bygge ioniske apps ved hjelp av webteknologier vi diskuterte tidligere. Så vær så snill å hoppe over denne delen hvis du er glad for å bare hoppe rett inn og lage ditt første ioniske prosjekt.
Men hvis du vil kjøre appene dine på en ekte mobilenhet som en Android-telefon eller iPhone, må du til slutt installere plattformspesifikke verktøy for disse plattformene. Vi vil se nærmere på å utvikle for Android og iOS-enheter i fremtidige opplæringsprogrammer.
Hvis du vil kunne kompilere Android-apper fra ditt ioniske prosjekt, må du først installere Java Development Kit (JDK) 8 eller senere. Gå til JDK-nettstedet, godta lisensavtalen, og velg det aktuelle nedlastingsalternativet basert på operativsystemet. Følg deretter installeringsinstruksjonene.
Etter at du har installert JDK, må du også installere Android Studio, Android IDE (integrert utviklingsmiljø).
Med disse to pakkene installert, kan du kompilere og pakke en Android-app fra ditt ioniske prosjekt.
Å bygge iOS-apper fra dine ioniske prosjekter er bare mulig på en Mac OS-datamaskin, dessverre, noe som betyr at du ikke kan kompilere eller bygge iOS-apper fra en datamaskin som kjører Windows eller Linux. (Selv om du kan kode appen nå på en Windows-datamaskin, og senere bygge den for iOS fra en Mac.)
For å kompilere iOS-apper på Mac OS, må du installere Xcode. Bare gå over til AppStore på din Mac og søk etter Xcode. Dette er en gratis nedlasting.
Etter at du har installert Xcode, må du også installere ekstra kommandolinjeverktøy for Xcode. For å gjøre dette, åpne Terminal og kjør følgende kommando.
xcode-select - installer
Dette vil installere tilleggsverktøy Cordova vil bruke til å bygge iOS-prosjektene dine.
For å kunne bygge iOS-prosjektene fra kommandolinjen, må du også kjøre følgende kommando.
sudo npm installer -g ios-distribuere
Med alt satt opp, er du klar til å bygge iOS-apper fra dine ioniske prosjekter.
Ionic bruker kommandolinjen - og spesielt den joniske CLI, som ble installert automatisk under oppsettprosessen - for å lage, teste og bygge dine joniske applikasjoner. Så har motet igjen å åpne Terminal eller Command Prompt (avhengig av operativsystemet).
Et raskt råd før vi fortsetter: Lær å omfavne det joniske CLI-verktøyet. Det har nå blitt offisielt din nye venn, så lær å elske den!
Det første vi må gjøre er å spesifisere hvor vi vil lagre vårt ioniske prosjekt. Med denne øvelsen skal vi bare lagre det på skrivebordet vårt. Så naviger til skrivebordet med følgende kommando.
CD Desktop
Vi har noen alternativer for typen jonisk applikasjon vi ønsker å lage, og disse kategoriseres som joniske prosjektmaler. For nybegynnere finnes tre typer maler: a Blank mal, a Tabs mal og a sidemeny mal. Vi bruker tabulatemalen i dette eksemplet, så la oss gå videre og opprett vårt prosjekt.
Vi skal ringe til vårt ioniske prosjekt DemoApp. Så for å lage vårt DemoApp-prosjekt ved hjelp av fanemalen og lagre den på skrivebordet, må vi kjøre følgende kommando i CLI.
ioniske start DemoApp-faner
Denne kommandoen tar litt tid å kjøre etter hvert som den laster ned alle prosjektmallpakker og applikasjonsavhengigheter. Under installasjonen kan du bli spurt om du vil installere gratis Ionic Pro SDK og koble appen din. Svar Nei og trykk Tast inn igjen for å fortsette installasjonen. Når installasjonen er fullført, bør du se noe slikt:
Gratulerer! Du har vellykket opprettet ditt første ioniske prosjekt.
Når prosjektoppsettet er ferdig, er vi nå klar til å se vår joniske applikasjon. For å gjøre det, naviger til din nyopprettede prosjektmappe via CLI ved å kjøre cd ./DemoApp og en gang i denne mappen kjører heller ionisk servering eller ionisk laboratorium.
ionisk servering og ionisk laboratorium er ikoniske CLI-kommandoer som vil kompilere søknaden din og starte en lokal dev-server, slik at du kan se din joniske applikasjon inne i en nettleser på datamaskinen din.
I bildet ovenfor har jeg kjørt ionisk laboratorium kommandoen, og som du kan se, kan jeg se mitt joniske prosjekt kompilert som en webapp. Vi har fortsatt ikke klart å kompilere det som en opprinnelig applikasjon, men det vil vi gjøre i senere opplæringsprogrammer.
Jeg husker at da jeg begynte å utvikle ioniske apps, var det veldig forvirrende først, spesielt å gjøre mye av det første arbeidet via CLI. Som noen som ikke var vant til å jobbe med CLI i det hele tatt, var dette en skummelt reise for meg - så jeg kan forestille meg hvordan noen av dere kanskje føler seg der ute. Mitt råd til deg er å omfavne det - du vil bli mer komfortabel og vant til det mens du går, og ikke bekymre deg, du vil ikke bryte noe på din elskede datamaskin!
Vi har dekket mye bakken i dette innlegget, men med denne kunnskapen er du over en av de største hindringene for å kode ioniske apps. Hold deg oppdatert på neste innlegg i denne serien!
Inntil da, sjekk ut noen av våre andre flotte innlegg om koding av joniske apps, eller prøv et av våre omfattende videokurser på jonisk apputvikling!
Accentsconagua