Olajšajte težave pri proizvodnji in uvajanju s cevovodom CI/CD, ki poskrbi za zahtevne podrobnosti.

Uvajanje spletnih aplikacij v Firebase Hosting je lahko težava. Vendar pa lahko z uporabo dejanj GitHub poenostavite in racionalizirate postopek uvajanja ter neverjetno enostavno je upravljati delovne tokove uvajanja skozi celotno življenjsko dobo programske opreme projekt.

Z le nekaj preprostimi koraki lahko nastavite delovni tok uvajanja za avtomatizacijo postopka. To vključuje sledenje novim spremembam podružnic in beleženje morebitnih napak. Preberite, če želite izvedeti, kako namestiti aplikacijo React v storitvi gostovanja Firebase.

Kaj je cevovod CI/CD?

Cevovod CI/CD (Continuous Integration/Continuous Delivery) je nabor avtomatiziranih procesov, implementiranih za omogočanje neprekinjene gradnje, testiranja in uvajanja aplikacij.

Preprosto povedano, cevovod CI/CD je vzpostavljen za avtomatizacijo procesov, vključenih v življenjski cikel razvoja programske opreme. To bo vključevalo dejanski razvoj, testiranje, izdaje (beta, alfa in končna izdaja), popravke napak in celo posodobitve funkcij. V bistvu ta postopek omogoča preprosto in hitro pošiljanje kakovostne programske opreme.

instagram viewer

Cevovod CI/CD običajno zajema nekaj stopenj, to vključuje:

  1. Izvorna stopnja: Ta faza zajema dejanski razvoj in vzdrževanje kode aplikacije z orodjem za nadzor različic, kot je Git.
  2. Faza gradnje: Ta korak sestavi izvorno kodo z vsemi njenimi odvisnostmi v izvršljivo obliko.
  3. Preskusna stopnja: Ta stopnja vključuje avtomatizirane teste za preverjanje kakovosti programske opreme. Končni cilj je odkriti in popraviti vse napake. Na tej stopnji lahko izvedete različne vrste preizkusov in ko koda opravi preizkuse, je pripravljena za uporabo.
  4. Razmestitev: ta stopnja avtomatizira postopek razmestitve v proizvodnem okolju.

Cevovod bi moral spremljati vsako fazo, da zagotovi, da ni napak, in da izboljša celoten postopek za prihodnje izdaje.

Kaj so GitHub Actions?

GitHub Actions je funkcija, ki jo ponuja GitHub za avtomatizacijo delovnih procesov uvajanja programske opreme v cevovodih CI/CD. Omogoča definiranje in avtomatizacijo delovnih tokov uvajanja neposredno iz repozitorija GitHub vašega projekta.

GitHub Actions ima več prednosti:

  1. Enostaven za uporabo: GitHub Actions ponuja uporabniku prijazen vmesnik in preprosto sintakso za nastavitev delovnih tokov uvajanja. Z vgrajenim urejevalnikom na GitHubu lahko preprosto in hitro definirate potek dela svojega projekta.
  2. Izvorna integracija: GitHub Actions je del GitHuba, kar olajša nastavitev, upravljanje in sodelovanje pri delovnih tokovih poleg kode vašega projekta.
  3. Prilagodljivo in prilagodljivo: GitHub Actions ponuja prilagodljivo in prilagodljivo platformo, ki zagotavlja, da lahko zgradite delovne tokove, ki ustrezajo vašim posebnim potrebam. Poleg tega podpira več programskih jezikov. To pomeni, da ga lahko uporabljate s katero koli tehnologijo, ki vam je ljubša.

Nastavite projekt Firebase in odjemalca React

Za začetek pojdite na Firebase in se prijavite s svojim Google računom. Na strani s pregledom konzole kliknite Ustvari projekt za nastavitev novega projekta in podajanje imena projekta.

Naslednji, ustvarite aplikacijo React in namestite orodja ukazne vrstice Firebase:

npm install -g firebase-tools

Kodo tega projekta najdete v Repozitorij GitHub.

Prijavite se v Firebase s svojega terminala s poverilnicami računa Firebase.

prijava v firebase: ci

To bo sprožilo tok preverjanja pristnosti Firebase, ki vas bo pozval, da vnesete podatke za prijavo, če še niste prijavljeni. Ko vas Firebase overi, bo natisnil žeton. Kopirajte ta žeton; uporabili ga boste za izvajanje ukazov Firebase v nastavitvi GitHub Actions.

Nazadnje ustvarite produkcijsko pripravljeno različico vaše aplikacije:

npm zaženi gradnjo

Ta ukaz generira potrebne datoteke in sredstva znotraj nove mape 'build' v korenskem imeniku, ki so potrebni za uvedbo aplikacije.

Inicializirajte Firebase v svoji aplikaciji React

Zaženite ta ukaz, da inicializirate Firebase v mapi projekta:

firebase init

Nato potrdite, da želite inicializirati Firebase v svojem projektu, in nadaljujte z izbiro Gostovanje: Konfigurirajte datoteke za gostovanje Firebase in (izbirno) nastavite uvedbe GitHub Actions seznama možnosti.

Določite, da želite uporabiti obstoječi projekt, in izberite ime projekta, ki ste ga prvotno ustvarili na konzoli za razvijalce Firebase.

Nato določite mapo 'build' kot javnosti imenik, izberite št če želite prepisati vse URL-je v možnost /index.html, izberite št do možnosti nastavitve samodejnih gradenj in uvajanj iz GitHuba in na koncu izberite Select ja da prepišete možnost datoteke build/index.html.

Po izvedbi zgornjih sprememb bo CLI ustvaril datoteko firebase.json v korenskem imeniku. Ta datoteka vsebuje vso konfiguracijo gostovanja, ki jo potrebuje potek dela GitHub Actions.

Nazadnje, preden nastavite potek dela GitHub Actions, ustvarite repozitorij na GitHubuin vanj potisnite projektne datoteke.

Nastavitev dejanj GitHub

V repozitoriju vašega projekta na GitHubu izberite nastavitve > Skrivnosti in spremenljivke > Dejanja. Na skrivni strani skladišča vnesite FIREBASE_TOKEN kot ime skrivnosti in prilepite žeton Firebase, ki ste ga kopirali v Skrivnosti polja.

Nastavite potek dela razmestitve

Kliknite zavihek Dejanja v repozitoriju vašega projekta in izberite Konfigurirajte Nodejs potek dela v Neprekinjena integracija razdelek.

Nato preimenujte datoteko v firebase.yml, izbrišite okvirno kodo v urejevalniku in dodajte spodnjo kodo:

# Ta potek dela bo izvedel čisto namestitev odvisnosti vozlišča,
# jih predpomniti/obnoviti, zgraditi vir kodirati in izvajati teste v različnih
# različice vozlišča
# Za več informacij glejte:
# https://docs.github.com/en/actions/automating-builds-and-tests
# /building-and-testing-nodejs
ime: Firebase CI


na:
 potisni:
 podružnice: [ glavna ]
 pull_request:
 podružnice: [ glavna]


službe:
 zgraditi:


 teče naprej: ubuntu-najnovejši


 strategija:
 matrika:
 različica vozlišča: [14.x]

 koraki:
 - uporablja: actions/checkout@v2
 - ime: Uporabi Node.js ${{ matrix.node-version }}
 uporablja: actions/setup-node@v1
 z:
 različica-vozlišča: ${{ matrix.različica-vozlišča }}
 - zaženite: npm install -g npm
 - ime: npm namestite, zgradite in preizkusite
 teči: |
 namestitev npm
 npm zaženi gradnjo
 - ime: Archive Build
 uporablja: actions/upload-artifact@v2
 z:
 ime: graditi
 pot: graditi

 razmesti:
 ime: Razmesti
 potrebe: graditi
 teče naprej: ubuntu-najnovejši
 koraki:
 - uporablja: actions/checkout@v2
 - ime: Download Build
 uporablja: actions/download-artifact@v2
 z:
 ime: graditi
 pot: graditi
 - ime: Razmesti v Firebase
 uporablja: w9jds/firebase-action@master
 z:
 args: razmesti --samo gostovanje
 env:
 FIREBASE_TOKEN: ${{ skrivnosti. FIREBASE_TOKEN }}

Tukaj je razloženih nekaj ključnih lastnosti:

  1. Vklopljeno: Dogodki, ki sprožijo dejanja v tem delovnem toku.
  2. Službe: Določa opravila, ki naj se izvajajo za določeno dejanje. V tem primeru obstajata dve nalogi: izgradnja in uvedba.
  3. Naletna: stroj, na katerem se mora izvajati to dejanje.
  4. Koraki: Določa zaporedje korakov, ki jih mora dejanje izvesti za določeno opravilo.
  5. z: Podaja vse argumente, ki jih zahtevajo dejanja za izvajanje.
  6. Ime: Ime določenega koraka za opravilo.

Na koncu potrdite spremembe, narejene v tej datoteki. GitHub bo samodejno sprožil ta potek dela, zgradil in uvedel aplikacijo React v storitvi gostovanja Firebase. V dnevnikih uvajanja lahko preverite URL aplikacije v živo.

Uvajanje aplikacij z uporabo dejanj GitHub

GitHub Actions zagotavlja poenostavljen pristop uvajanja. Zagotavlja, da lahko aplikacije uvajate dosledno in zanesljivo, ne glede na tehnologijo, v katero jih vgradite.

Poleg tega lahko preprosto prilagodite delovni tok uvajanja z uporabo vgrajenih orodij za uvajanje, da izpolnite svoje specifične potrebe cevovoda CI/CD.