Az Önhöz hasonló olvasók támogatják a MUO-t. Amikor a webhelyünkön található linkek használatával vásárol, társult jutalékot kaphatunk.

Az Angular egy robusztus JavaScript-keretrendszer egyoldalas alkalmazások készítéséhez. A Google fejlesztette ki a szoftvert, és világszerte közreműködőkkel karbantartja.

A Reacthoz hasonlóan az Angular segítségével számos előtér-alkalmazást hozhat létre, beleértve a webes, mobil- és asztali rendszereket. Egyes iparágak előnyben részesítik az Angular-t, mert átfogó és stabil.

Tudjon meg többet az Angularról: klónozzon egy projektet a GitHubról, és futtassa helyileg.

A klónozás előfeltételei

Más keretrendszerekkel ellentétben az Angular alkalmazás klónozása és futtatása egyszerű. Ön egy GitHub projektet klónoz. Mielőtt elkezdené, győződjön meg arról, hogy megfelel a következő követelményeknek:

  • A Node.js stabil verziójának telepítve kell lennie. Ha nem, tanulj hogyan telepítsem a Nodejs-t Ubuntu-ra vagy telepítse a Nodejs-t Windowsra.
  • Neked kellene telepítve van a Git.
  • GitHub-fiókkal kell rendelkeznie.
instagram viewer

1. Telepítse a Node Package Managert

Node Package Manager (npm) egy szoftvertár a JavaScript-csomagokhoz. Az npm rendelkezik egy CLI-vel (Command Line Interface), amely különféle feladatokat hajt végre. A CLI segítségével letölthet, telepíthet és telepíthet szoftvereket.

A Node.js telepítésekor egy npm csomagot kap. A Node.js és npm csomagverziók ellenőrzéséhez futtassa a következőt a terminálon:

A Node.js telepített verziójának ellenőrzéséhez nyomtassa ki a verziót a következő paranccsal:

csomópont --változat

Az npm verzióját ugyanezzel az opcióval ellenőrizheti:

npm --változat 

2. Telepítse az Angular CLI-t

Az Angular CLI segítségével különféle fejlesztési feladatokat hajthat végre. A feladatok közé tartozik az alkalmazások generálása, a tesztelés és a telepítés. Az Angular CLI telepítéséhez futtassa a következő parancsot:

$ npm telepítés -g @szögletes/cli

Az Angular CLI verziójának ellenőrzéséhez futtassa a parancsot:

$ ng verzió

3. Keressen egy projektet a GitHubon

klónozni fogod a Giphy-Replica projekt a GitHubból:

Navigáljon a zöld feliratú gombra Kód. Kattintson rá a legördülő lista megjelenítéséhez. Másolja ki a HTTP vagy az SSH hivatkozást. A kettő közül bármelyik megteszi.

4. A projekt helyi klónozása

Először hozzon létre egy mappát, és nevezze el Angular-Clone-nak. Ne felejtsen el a mappába menni a következő paranccsal:

cd Angular-Klón

Ezután futtassa a git klón parancsot a projekt mappába másolásához.

git klón https://github.com/Reuben-Kipkemboi/Giphy-Replica.git

Ezután ellenőrizze az Angular-Clone mappát, és ellenőrizze, hogy a Giphy-Replica klón benne van-e. Fuss ls a mappa tartalmának megjelenítéséhez:

ls

Navigáljon a mappához:

CD Giphy-Replica

Ezen a ponton megtekintheti a projektfájlokat egy választott kódszerkesztőben, vagy megtekintheti őket a GitHub webes felületén keresztül.

5. Telepítse az npm csomagokat

A futtatáshoz telepítenie kell a klónozott projekt összes csomagját és függőségét. A csomagok telepítéséhez futtassa:

npm telepítés

Ha sebezhetőségi jelentésekkel találkozik, javítsa ki őket az alábbiakkal:

npm audit javítás

6. Nyissa meg a projektet egy böngészőben

Most már minden feltétele megvan a projekt futtatásához, futtathatja és megnyithatja egy böngészőben. Kezdje a projekt felépítésével és kiszolgálásával:

ng szolgálni

Ezután nyissa meg http://localhost: 4200/ böngészőben a projekt megtekintéséhez.

Az Angular CLI segítségével automatikusan megnyithatja a projektet egy böngészőben:

$ ng szolgál -o

Ez a parancs létrehozza az alkalmazást, elindítja a kiszolgálót, és figyeli a fájlokat frissítésekért.

A böngészőben látnia kell a Giphy-Replica webhelyet:

Miért kell egy Angular Projectet klónozni?

Ahelyett, hogy a semmiből kezdene egy projektet, klónozhat egyet a GitHubból. Egy nyílt forráskódú projekt klónozása és saját használatra történő módosítása időt takarít meg a projekt elölről történő elindításával szemben. Bármilyen hasznos változtatást vissza is adhat az upstream projekthez, ha releváns.

A 2021-ben a negyedik legnépszerűbb front-end keretrendszernek megszavazott Angular minden kiadásával továbbra is lenyűgöz. Remek csomagokkal érkezik, amelyek támogatják az egyoldalas alkalmazások fejlesztését. Használja ezt a kiváló keretrendszert világszínvonalú alkalmazások létrehozásához.