Teiesugused lugejad aitavad MUO-d toetada. Kui teete ostu meie saidil olevate linkide abil, võime teenida sidusettevõtte komisjonitasu.

Angular on tugev JavaScripti raamistik üheleheliste rakenduste loomiseks. Google töötas välja tarkvara ja hooldab seda koos ülemaailmsete kaastöölistega.

Sarnaselt Reactiga saate kasutada Angularit mitmesuguste esiotsa rakenduste, sealhulgas veebi-, mobiili- ja töölauasüsteemide loomiseks. Mõned tööstusharud eelistavad Angulari, kuna see on kõikehõlmav ja stabiilne.

Uurime Angulari kohta lisateavet, kloonides GitHubist projekti ja käivitades selle kohapeal.

Kloonimise eeldused

Erinevalt teistest raamistikest on Angulari rakenduse kloonimine ja käitamine lihtne. Kloonite GitHubi projekti. Enne alustamist veenduge, et vastate järgmistele nõuetele:

  • Teil peaks olema installitud Node.js stabiilne versioon. Kui ei, siis õppige kuidas installida Nodejs Ubuntule või installige Nodejs Windowsi.
  • Sa peaksid Git on installitud.
  • Teil peaks olema GitHubi konto.

1. Installige Node Package Manager

instagram viewer

Sõlme paketihaldur (npm) on JavaScripti pakettide tarkvarahoidla. npm-il on CLI (Command Line Interface), mis täidab erinevaid ülesandeid. Saate kasutada CLI-d tarkvara allalaadimiseks, installimiseks ja juurutamiseks.

Kui installite Node.js-i, on sellega kaasas pakett npm. Paketi Node.js ja npm versioonide kontrollimiseks käivitage terminalis järgmine:

Installitud Node.js versiooni kontrollimiseks printige versioon järgmise käsuga:

sõlm -- versioon

Saate npm versiooni kontrollida sama valiku abil:

npm -- versioon

2. Installige Angular CLI

Angular CLI-d saate kasutada erinevate arendusülesannete täitmiseks. Ülesanded hõlmavad rakenduste genereerimist, testimist ja juurutamist. Angular CLI installimiseks käivitage järgmine käsk:

$ npm install -g @nurkne/cli

Angular CLI versiooni kontrollimiseks käivitage käsk:

$ ng versioon

3. Leidke GitHubist projekt

Te kloonite Giphy-replica projekt GitHubist:

Liikuge rohelisele nupule Kood. Rippmenüü kuvamiseks klõpsake sellel. Kopeerige HTTP- või SSH-link. Kumbki neist kahest sobib.

4. Kloonige projekt kohapeal

Esiteks looge kaust ja nimetage see Angular-Clone. Ärge unustage minna kausta järgmise käsuga:

cd Angular-Klooni

Seejärel käivitage git kloon käsk projekti oma kausta kopeerimiseks.

git kloon https://github.com/Reuben-Kipkemboi/Giphy-Replica.git

Järgmisena kontrollige kausta Angular-Clone, et näha, kas kloon Giphy-Replica on sees. Jookse ls kausta sisu kuvamiseks:

ls

Liikuge kausta:

cd Giphy-replica

Siinkohal saate projektifaile kontrollida valitud koodiredaktoris või vaadata neid GitHubi veebiliidese kaudu.

5. Installige npm paketid

Selle käivitamiseks peate installima kõik kloonitud projekti paketid ja sõltuvused. Pakettide installimiseks käivitage:

npm installida

Kui leiate haavatavuse aruandeid, parandage need järgmiselt.

npm auditi parandus

6. Avage projekt brauseris

Nüüd on teil projekti käivitamiseks kõik nõuded, saate selle käivitada ja brauseris avada. Alustage projekti ehitamisest ja teenindamisest:

teenida

Seejärel avage http://localhost: 4200/ projekti vaatamiseks brauseris.

Angular CLI abil saate projekti automaatselt brauseris avada:

$ ng serve -o

See käsk loob rakenduse, käivitab serveri ja jälgib faile värskenduste jaoks.

Peaksite oma brauseris nägema Giphy-Replica veebisaiti:

Miks nurkprojekti kloonida?

Selle asemel, et alustada projekti nullist, saate selle GitHubist kloonida. Avatud lähtekoodiga projekti kloonimine ja selle enda tarbeks muutmine säästab aega projekti nullist alustamisel. Vajadusel saate teha ka kasulikke muudatusi eelnevasse projekti.

Angular, mis valiti 2021. aastal populaarsuselt neljandaks esiotsa raamistikuks, hämmastab iga väljalaskega jätkuvalt. Kaasas on suurepärased paketid, mis toetavad üheleheliste rakenduste arendamist. Kasutage seda suurepärast raamistikku maailmatasemel rakenduste loomiseks.