Palengvinkite gamybos ir diegimo bėdas su CI / CD vamzdynu, kuris rūpinasi daug pastangų reikalaujančiomis detalėmis.

Žiniatinklio programų diegimas „Firebase Hosting“ gali sukelti problemų. Tačiau naudodami „GitHub“ veiksmus galite supaprastinti ir supaprastinti diegimo procesą ir padaryti neįtikėtinai lengva valdyti diegimo eigą per visą programinės įrangos naudojimo laiką projektą.

Atlikę vos kelis paprastus veiksmus, galite nustatyti diegimo darbo eigą, kad procesas būtų automatizuotas. Tai apima naujų filialų pakeitimų stebėjimą ir klaidų registravimą. Skaitykite toliau, kad sužinotumėte, kaip įdiegti „React“ programą „Firebase“ prieglobos paslaugoje.

Kas yra CI / CD vamzdynas?

CI/CD (Continuous Integration/Continuous Delivery) dujotiekis yra automatizuotų procesų rinkinys, įdiegtas tam, kad būtų galima nuolat kurti, testuoti ir diegti programas.

Paprasčiau tariant, yra sukurtas CI/CD vamzdynas, skirtas automatizuoti procesus, susijusius su programinės įrangos kūrimo gyvavimo ciklu. Tai apims tikrąjį kūrimą, testavimą, leidimus (beta, alfa ir galutinį leidimą), klaidų pataisymus ir net funkcijų atnaujinimus. Iš esmės šis procesas leidžia lengvai ir greitai išsiųsti kokybišką programinę įrangą.

instagram viewer

CI / CD vamzdynas paprastai apima keletą etapų, įskaitant:

  1. Šaltinio etapas: šis etapas apima faktinį programos kodo kūrimą ir priežiūrą naudojant versijos valdymo įrankį, pvz., Git.
  2. Sukūrimo etapas: šis veiksmas sujungia šaltinio kodą su visomis jo priklausomybėmis į vykdomąjį formatą.
  3. Bandymo etapas: į šį etapą įtraukti automatiniai testai, skirti patvirtinti programinės įrangos kokybę. Galutinis tikslas yra aptikti ir ištaisyti visas klaidas. Šiame etape galite atlikti įvairių tipų testus, o kai kodas išlaikė testus, jis bus paruoštas naudoti.
  4. Diegimas: šis etapas automatizuoja diegimo procesą gamybos aplinkoje.

Dujotiekis turėtų stebėti kiekvieną etapą, kad būtų užtikrinta, jog nėra klaidų, ir patobulinti visą procesą būsimiems leidimams.

Kas yra „GitHub“ veiksmai?

„GitHub Actions“ yra „GitHub“ teikiama funkcija, skirta automatizuoti programinės įrangos diegimo darbo eigos procesus CI / CD vamzdynuose. Tai leidžia apibrėžti ir automatizuoti diegimo darbo eigas tiesiai iš jūsų projekto GitHub saugyklos.

„GitHub Actions“ turi keletą privalumų:

  1. Lengva naudoti: „GitHub Actions“ suteikia patogią sąsają ir paprastą sintaksę, skirtą diegimo darbo eigoms nustatyti. Galite lengvai ir greitai apibrėžti savo projekto darbo eigą naudodami integruotą „GitHub“ redaktorių.
  2. Vietinis integravimas: „GitHub Actions“ yra „GitHub“ dalis, todėl lengva nustatyti, tvarkyti ir bendradarbiauti atliekant darbo eigas kartu su projekto kodu.
  3. Lankstus ir pritaikomas: „GitHub Actions“ suteikia lanksčią ir tinkinamą platformą, kuri užtikrina, kad galite kurti darbo eigas, atitinkančias jūsų konkrečius poreikius. Be to, jis palaiko kelias programavimo kalbas. Tai reiškia, kad galite jį naudoti su bet kokia jūsų pageidaujama technologija.

Nustatykite „Firebase“ projektą ir „React Client“.

Norėdami pradėti, eikite į Firebase ir prisijunkite naudodami „Google“ paskyrą. Konsolės apžvalgos puslapyje spustelėkite Sukurti projektą sukurti naują projektą ir nurodyti projekto pavadinimą.

Kitas, sukurti „React“ programą ir įdiekite „Firebase“ komandų eilutės įrankius:

npm install -g firebase-tools

Šio projekto kodą galite rasti jame GitHub saugykla.

Prisijunkite prie „Firebase“ iš savo terminalo naudodami „Firebase“ paskyros kredencialus.

firebase prisijungimas: ci

Tai suaktyvins „Firebase“ autentifikavimo procesą, kuris paragins įvesti prisijungimo duomenis, jei dar nesate prisijungę. Kai „Firebase“ patvirtins jūsų tapatybę, ji išspausdins prieigos raktą. Nukopijuokite šį žetoną; naudosite jį „Firebase“ komandoms paleisti „GitHub Actions“ sąrankoje.

Galiausiai sukurkite gamybai paruoštą programos versiją:

npm paleisti statyti

Ši komanda sugeneruoja reikalingus failus ir išteklius naujame šakninio katalogo aplanke „build“, reikalingus programai įdiegti.

Inicijuokite „Firebase“ savo „React“ programoje

Vykdykite šią komandą, kad inicijuotų Firebase projekto aplanke:

firebase init

Tada patvirtinkite, kad norite inicijuoti „Firebase“ savo projekte, tada pasirinkite Priegloba: sukonfigūruokite „Firebase“ prieglobos failus ir (pasirinktinai) nustatykite „GitHub Action“ diegimusiš parinkčių sąrašo.

Nurodykite, kad norite naudoti esamą projektą, ir pasirinkite projekto pavadinimą, kurį iš pradžių sukūrėte „Firebase“ kūrėjo pulte.

Tada nurodykite „build“ aplanką kaip viešas katalogą, pasirinkite Nr norėdami perrašyti visus URL į /index.html parinktį, pasirinkite Nr į parinktį nustatyti automatinius kūrimus ir diegimus iš „GitHub“ ir galiausiai „Select“. Taip norėdami perrašyti failo build/index.html parinktį.

Atlikus pirmiau nurodytus pakeitimus, CLI šakniniame kataloge sukurs failą firebase.json. Šiame faile yra visa prieglobos konfigūracija, kurios reikės „GitHub Actions“ darbo eigai.

Galiausiai, prieš nustatydami „GitHub Actions“ darbo eigą, sukurti saugyklą „GitHub“.ir perkelkite į jį projekto failus.

„GitHub“ veiksmų nustatymas

Savo projekto saugykloje „GitHub“ pasirinkite Nustatymai > Paslaptys ir kintamieji > Veiksmai. Slaptame saugyklos puslapyje įveskite FIREBASE_TOKEN kaip paslapties pavadinimą ir įklijuokite į „Firebase“ prieigos raktą, kurį nukopijavote Paslaptys laukai.

Nustatykite diegimo darbo eigą

Spustelėkite skirtuką Veiksmai savo projekto saugykloje ir pasirinkite Konfigūruokite „Nodejs“. darbo eiga Nuolatinė integracija skyrius.

Tada pervardykite failo pavadinimą į firebase.yml, ištrinkite pagrindinį kodą redaktoriuje ir pridėkite kodą toliau:

# Ši darbo eiga atliks švarų mazgų priklausomybių diegimą,
# talpykloje / atkurti juos, sukurti šaltinis kodą ir paleiskite testus įvairiose srityse
# mazgo versijos
# Daugiau informacijos rasite:
# https://docs.github.com/en/actions/automating-builds-and-tests
# /building-and-testing-nodejs
pavadinimas: Firebase CI


ant:
 stumti:
 filialai: [ pagrindinis ]
 pull_request:
 filialai: [ pagrindinis]


darbai:
 statyti:


 veikia: ubuntu-latest


 strategija:
 matrica:
 mazgo versija: [14.x]

 žingsniai:
 - naudoja: action/checkout@v2
 - pavadinimas: naudokite Node.js ${{ matrix.node-version }}
 naudoja: action/setup-node@v1
 su:
 mazgo versija: ${{ matrica.node-version }}
 - paleisti: npm install -g npm
 - pavadinimas: npm įdiegti, kurti ir išbandyti
 paleisti: |
 npm diegimas
 npm paleisti statyti
 - pavadinimas: Archyvas
 naudoja: action/upload-artifact@v2
 su:
 pavadinimas: statyti
 kelias: statyti

 dislokuoti:
 pavadinimas: Deploy
 poreikiai: statyti
 veikia: ubuntu-latest
 žingsniai:
 - naudoja: action/checkout@v2
 - pavadinimas: Atsisiųskite „Build“.
 naudoja: action/download-artifact@v2
 su:
 pavadinimas: statyti
 kelias: statyti
 - pavadinimas: Diekite Firebase
 naudoja: w9jds/firebase-action@master
 su:
 args: deploy --only hosting
 env:
 FIREBASE_TOKEN: ${{ paslapčių. FIREBASE_TOKEN }}

Štai keletas pagrindinių savybių, paaiškintų:

  1. Įjungta: įvykiai, suaktyvinantys šios darbo eigos veiksmus.
  2. Darbai: nurodo užduotis, kurias turi vykdyti tam tikras veiksmas. Šiuo atveju yra du darbai: kurti ir diegti.
  3. Paleidžiamas: mašina, kurioje turi būti atliktas šis veiksmas.
  4. Žingsniai: apibrėžia veiksmų seką, kurią reikia atlikti tam tikram darbui.
  5. Su: Nurodo visus argumentus, kurių reikia veiksmams vykdyti.
  6. vardas: konkretaus darbo žingsnio pavadinimas.

Galiausiai patvirtinkite šiame faile atliktus pakeitimus. „GitHub“ automatiškai suaktyvins šią darbo eigą, sukurdamas ir įdiegdamas „React“ programą „Firebase“ prieglobos paslaugoje. Diegimo žurnaluose galite patikrinti programos tiesioginį URL.

Programų diegimas naudojant „GitHub“ veiksmus

„GitHub Actions“ siūlo supaprastintą diegimo metodą. Tai užtikrina, kad galite nuosekliai ir patikimai diegti programas, neatsižvelgiant į technologiją, kurioje jas kuriate.

Be to, galite lengvai pritaikyti diegimo darbo eigą naudodami įmontuotus diegimo įrankius, kad atitiktų jūsų konkrečius CI / CD dujotiekio poreikius.