Atvieglojiet ražošanas un izvietošanas problēmas, izmantojot CI/CD konveijeru, kas rūpējas par darbietilpīgām detaļām.

Tīmekļa lietojumprogrammu izvietošana pakalpojumā Firebase Hosting var radīt grūtības. Tomēr, izmantojot GitHub darbības, varat vienkāršot un racionalizēt izvietošanas procesu un padarīt tas ir neticami viegli pārvaldīt izvietošanas darbplūsmas visā programmatūras darbības laikā projektu.

Veicot tikai dažas vienkāršas darbības, varat iestatīt izvietošanas darbplūsmu, lai automatizētu procesu. Tas ietver jaunu izmaiņu izsekošanu filiālēs un kļūdu reģistrēšanu. Lasiet tālāk, lai uzzinātu, kā Firebase mitināšanas pakalpojumā izvietot React lietojumprogrammu.

Kas ir CI/CD cauruļvads?

CI/CD (Continuous Integration/Continuous Delivery) konveijers ir automatizētu procesu kopums, kas ieviests, lai nodrošinātu nepārtrauktu lietojumprogrammu izveidi, testēšanu un izvietošanu.

Vienkārši sakot, ir izveidots CI/CD konveijers, lai automatizētu programmatūras izstrādes dzīves ciklā iesaistītos procesus. Tas ietvers faktisko izstrādi, testēšanu, laidienus (beta, alfa un galīgo versiju), kļūdu labojumus un pat funkciju atjauninājumus. Būtībā šis process ļauj viegli un ātri nosūtīt kvalitatīvu programmatūru.

instagram viewer

CI/CD konveijeram parasti ir vairāki posmi, tostarp:

  1. Avota posms: šī fāze aptver faktisko lietojumprogrammas koda izstrādi un uzturēšanu, izmantojot versiju kontroles rīku, piemēram, Git.
  2. Būvēšanas posms: šajā darbībā avota kods ar visām tā atkarībām tiek apkopots izpildāmā formātā.
  3. Testa posms: šajā posmā ir iekļauti automatizēti testi, lai apstiprinātu programmatūras kvalitāti. Gala mērķis ir atklāt un labot visas kļūdas. Šajā posmā varat veikt dažāda veida pārbaudes, un, kad kods ir izturējis testus, tas ir gatavs izvietošanai.
  4. Izvietošana: šis posms automatizē izvietošanas procesu ražošanas vidē.

Konveijeram ir jāuzrauga katrs posms, lai nodrošinātu, ka nav kļūdu, un lai uzlabotu visu procesu turpmākajām izlaidēm.

Kas ir GitHub darbības?

GitHub Actions ir GitHub nodrošinātā funkcija, lai automatizētu programmatūras izvietošanas darbplūsmas procesus CI/CD konveijeros. Tas ļauj definēt un automatizēt izvietošanas darbplūsmas tieši no jūsu projekta GitHub repozitorija.

GitHub Actions ir vairākas priekšrocības:

  1. Viegli lietojams: GitHub Actions nodrošina lietotājam draudzīgu saskarni un vienkāršu sintaksi izvietošanas darbplūsmu iestatīšanai. Varat viegli un ātri definēt projekta darbplūsmas, izmantojot GitHub iebūvēto redaktoru.
  2. Vietējā integrācija: GitHub Actions ir daļa no GitHub, kas ļauj ērti iestatīt, pārvaldīt un sadarboties darbplūsmās kopā ar jūsu projekta kodu.
  3. Elastīga un pielāgojama: GitHub Actions nodrošina elastīgu un pielāgojamu platformu, kas nodrošina, ka varat izveidot darbplūsmas, kas atbilst jūsu īpašajām vajadzībām. Turklāt tas atbalsta vairākas programmēšanas valodas. Tas nozīmē, ka varat to izmantot ar jebkuru vēlamo tehnoloģiju.

Iestatiet Firebase projektu un React Client

Lai sāktu, dodieties uz Firebase un pierakstieties ar savu Google kontu. Konsoles pārskata lapā noklikšķiniet uz Izveidot projektu lai izveidotu jaunu projektu un norādītu projekta nosaukumu.

Nākamais, izveidot React lietojumprogrammu un instalējiet Firebase komandrindas rīkus:

npm install -g firebase-tools

Jūs varat atrast šī projekta kodu tajā GitHub repozitorijs.

Piesakieties Firebase no sava termināļa, izmantojot Firebase konta akreditācijas datus.

firebase pieteikšanās: ci

Tas aktivizēs Firebase autentifikācijas plūsmu, kas liks ievadīt pieteikšanās informāciju, ja vēl neesat pieteicies. Kad Firebase jūs autentificēs, tas izdrukās pilnvaru. Kopēt šo marķieri; jūs to izmantosit, lai palaistu Firebase komandas savā GitHub Actions iestatījumā.

Visbeidzot, izveidojiet ražošanai gatavu lietojumprogrammas versiju.

npm palaist veidot

Šī komanda ģenerē nepieciešamos failus un līdzekļus jaunā saknes direktorija “build” mapē, kas nepieciešami lietojumprogrammas izvietošanai.

Inicializējiet Firebase savā React lietojumprogrammā

Palaidiet šo komandu, lai projekta mapē inicializētu Firebase:

firebase init

Pēc tam apstipriniet, ka vēlaties inicializēt Firebase savā projektā, un turpiniet un atlasiet Hostings: konfigurējiet failus Firebase mitināšanai un (pēc izvēles) iestatiet GitHub darbības izvietošanuno opciju saraksta.

Norādiet, ka vēlaties izmantot esošu projektu, un atlasiet projekta nosaukumu, ko sākotnēji izveidojāt Firebase izstrādātāja konsolē.

Pēc tam norādiet mapi “build” kā publiski direktoriju, izvēlieties lai pārrakstītu visus URL uz opciju /index.html, atlasiet uz iespēju iestatīt automātiskās izveides un izvietošanas no GitHub, un visbeidzot, Select lai pārrakstītu faila build/index.html opciju.

Pēc iepriekš minēto izmaiņu veikšanas CLI saknes direktorijā izveidos failu firebase.json. Šajā failā ir visa mitināšanas konfigurācija, kas būs nepieciešama GitHub Actions darbplūsmai.

Visbeidzot, pirms GitHub Actions darbplūsmas iestatīšanas, izveidojiet repozitoriju vietnē GitHub, un virziet uz to projekta failus.

GitHub darbību iestatīšana

Projekta krātuvē GitHub atlasiet Iestatījumi > Noslēpumi un mainīgie > Darbības. Repozitorija slepenajā lapā ievadiet FIREBASE_TOKEN kā noslēpuma nosaukumu un ielīmējiet Firebase pilnvarā, ko nokopējāt Noslēpumi lauki.

Iestatiet izvietošanas darbplūsmu

Noklikšķiniet uz cilnes Darbības sava projekta repozitorijā un atlasiet Konfigurējiet Nodejs darbplūsma sadaļā Nepārtraukta integrācija sadaļā.

Pēc tam pārdēvējiet faila nosaukumu uz firebase.yml, izdzēsiet redaktora standarta kodu un pievienojiet tālāk norādīto kodu:

# Šī darbplūsma veiks tīru mezglu atkarību instalēšanu,
# saglabājiet tos kešatmiņā/atjaunojiet, izveidojiet avots kodu un palaidiet testus dažādās
# mezgla versijas
# Papildinformāciju skatiet:
# https://docs.github.com/en/actions/automating-builds-and-tests
# /building-and-testing-nodejs

nosaukums: Firebase CI

uz:
push:
filiāles: [ galvenais ]
pull_request:
filiāles: [ galvenā]

darbavietas:
būvēt:

darbojas: ubuntu-latest

stratēģija:
matrica:
mezgla versija: [14.x]

soļi:
- izmanto: action/checkout@v2
- nosaukums: izmantojiet Node.js ${{ matrix.node-version }}
izmanto: action/setup-node@v1
ar:
mezgla versija: ${{ matrix.node-version }}
- palaist: npm install -g npm
- nosaukums: npm instalējiet, izveidojiet un pārbaudiet
palaist: |
npm instalēšana
npm palaist veidot
- nosaukums: Arhīvs Build
izmanto: action/upload-artifact@v2
ar:
nosaukums: būvēt
ceļš: būvēt

izvietot:
nosaukums: Izvietot
vajadzības: būvēt
darbojas: ubuntu-latest

soļi:
- izmanto: action/checkout@v2
- nosaukums: Lejupielādēt Build
izmanto: action/download-artifact@v2
ar:
nosaukums: būvēt
ceļš: būvēt
- nosaukums: Izvietot platformā Firebase
izmanto: w9jds/firebase-action@master
ar:
args: izvietot -- tikai hostings
env:
FIREBASE_TOKEN: ${{ noslēpumi. FIREBASE_TOKEN }}

Šeit ir izskaidrotas dažas no galvenajām īpašībām:

  1. Ieslēgts: notikumi, kas aktivizē darbības šajā darbplūsmā.
  2. Darbavietas: norāda darbus, kas jāpalaiž konkrētai darbībai. Šajā gadījumā ir divi darbi: izveidot un izvietot.
  3. Uzskrien: mašīna, kurā šī darbība jāveic.
  4. Soļi: definē darbību secību, kas jāveic konkrētam darbam.
  5. Ar: norāda visus argumentus, kas nepieciešami darbībām, kas jāveic.
  6. Vārds: konkrēta darba soļa nosaukums.

Visbeidzot, veiciet šajā failā veiktās izmaiņas. GitHub automātiski aktivizēs šo darbplūsmu, izveidojot un izvietojot React lietojumprogrammu Firebase mitināšanas pakalpojumā. Lietojumprogrammas tiešo URL varat pārbaudīt izvietošanas žurnālos.

Lietojumprogrammu izvietošana, izmantojot GitHub darbības

GitHub Actions nodrošina racionalizētu izvietošanas pieeju. Tas nodrošina, ka varat izvietot lietojumprogrammas konsekventi un uzticami neatkarīgi no tehnoloģijas, kurā tās tiek veidotas.

Turklāt jūs varat viegli pielāgot izvietošanas darbplūsmu, izmantojot iebūvētos izvietošanas rīkus, lai atbilstu jūsu īpašajām CI/CD konveijera vajadzībām.