Dejanja GitHub kot CI/CD za spletno mesto na statičnem generatorju in straneh GitHub

Dejanja GitHub kot CI/CD za spletno mesto na statičnem generatorju in straneh GitHub

Ko sem malo prebrskal Habr, sem bil presenečen, da je bilo objavljenih zelo malo člankov na temo funkcije GitHub (beta) - Dejanja.

Zdi se, da je takšno podcenjevanje mogoče razložiti z dejstvom, da je funkcionalnost še vedno v fazi testiranja, čeprav »beta«. Je pa uporabna funkcija beta, ki omogoča uporabo tega orodja v zasebnih repozitorijih. O delu s to tehnologijo bom govoril v tem članku.

Prazgodovina

Če začnemo po vrsti, potem verjetno velja omeniti, da sem moral v procesu iskanja hitre, priročne, enostavne in brezplačne možnosti za shranjevanje osebne spletne strani »O meni« preživeti več noči in prečesati številne članke.

Nekateri izberejo gostovanje, drugi strežnik v oblaku, tisti, ki ne želijo razumeti dela, interakcije in plačila za vse to, pa imajo radi nalaganje statičnih spletnih mest v repozitorij, saj je zdaj to mogoče storiti tako na GitHubu kot GitLabu.

Seveda je to osebna izbira vsakega.

Moja zadnja izbira so bile strani GitHub.

O straneh

Kdo ne ve gh-pages - gre za možnost shranjevanja dokumentacije v obliki spletne strani in je na voljo brezplačno, poleg dokumentacije pa se predlaga tudi hramba osebnih spletnih strani. To funkcionalnost omogoča GitHub vsem uporabnikom in je na voljo v nastavitvah repozitorija.

Repozitorij projekta uporablja vejo gh-pages, za uporabniško mesto - ločeno skladišče z imenom username.github.io z viri mesta v master podružnica.

Vidite lahko več v dokumentaciji, vendar naj opozorim, da je GitHub presenetljivo velikodušen, ko vsakomur omogoča povezavo lastne domene s takim mestom tako, da preprosto doda datoteko CNAME z imenom domene in nastavitvijo DNS vašega ponudnika domene na strežnikih GitHub.

Prepričan sem, da je tukaj veliko člankov o tem, kako razviti takšno spletno mesto, zato ne bom več o tem.

Pojav težave

Težava je bila v tem, da je pri uporabi statičnega generatorja treba napisati dodatne skripte in uporabiti knjižnice za poenostavitev postopka generiranja strani in njihovega nalaganja v repozitorij. Preprosto, če vire shranjujete v ločenem zasebnem repozitoriju, potem je bilo vsakič, ko pride do kakršnih koli sprememb na spletnem mestu, potrebno razmestiti lokalno okolje za kasnejšo generacijo statičnih strani in objavo v glavnem repozitoriju spletnega mesta.

Obstaja obilje statični generatorji in vsi imajo isti problem. Ta dejanja vzamejo preveč časa in truda ter navsezadnje upočasnijo delo na spletnem mestu, zlasti po več migracijah iz OS v OS ali incidentih z izgubo podatkov na trdih diskih (tako je bilo v mojem primeru).

Ravno pred kratkim je bil v pojavnem obvestilu na spletnem mestu ali v glasilu GitHub opažen na novo zgrajen CI/CD, ki je omogočil izvedbo teh dejanj z minimalnim naporom.

O generatorjih statičnih strani

Tej podtočki ne bom posvečal posebne pozornosti, bom pa delil nekaj tez, do katerih sem prišel med izbiro in uporabo naslednjega:

1) izberite generator, ki ustreza vašemu programskemu jeziku ali tistega, ki je čim bolj jasen. Na to idejo sem prišel v času, ko sem moral tudi sam dodati nekaj funkcionalnosti za delovanje strani, dodati bergle za njeno večjo stabilnost in avtomatizacijo. Poleg tega je to dober razlog, da sami napišete dodatno funkcionalnost v obliki vtičnikov;

2) kateri generator izbrati je osebna izbira, vendar je vredno upoštevati, da morate za prvo potopitev v delo funkcionalnosti GitHub Pages najprej namestiti Jekyll. Na srečo vam omogoča ustvarjanje spletnega mesta iz virov neposredno v skladišču (To bom ponovil po svoji izbiri).

Moja izbira generatorja temelji na prvi točki. Pelican ki je napisan v Pythonu je zlahka nadomestil Jekylla, ki mi je tuj (uporabljal sem ga skoraj eno leto). Posledično tudi ustvarjanje in urejanje člankov ter delo na spletni strani daje dodatno izkušnjo v meni zanimivem jeziku.

__

Izjava o težavah

Glavna naloga bo napisati skript (pravzaprav konfiguracijsko datoteko), ki bo samodejno ustvaril statične strani iz zasebnega repozitorija. Rešitev bo vključevala funkcionalnost virtualnega okolja. Skript bo sam dodal že pripravljene strani v javno skladišče.

Orodja za rešitev

Orodja, s katerimi bomo rešili težavo:

  • GitHub dejanja;
  • Python 3.7;
  • pelikan;
  • Git;
  • Strani GitHub.

Rešitev

Torej, ko smo se malo seznanili z dokumentacijo in razumeli, kako so napisani skripti za dejanja, je postalo jasno, da bo ta mehanizem popolnoma rešil nastalo težavo. V času pisanja se morate za uporabo te funkcije naročiti. za beta testiranje!

Dejanja GitHub kot CI/CD za spletno mesto na statičnem generatorju in straneh GitHub
Opis nove funkcionalnosti samega Githuba

Pisanje skripta za dejanja se začne z ustvarjanjem imenovane datoteke v mapi .github in njeno podmapo workflows. To lahko storite ročno ali v urejevalniku na zavihku Dejanja na strani skladišča.

Dejanja GitHub kot CI/CD za spletno mesto na statičnem generatorju in straneh GitHub
Primer praznega skriptnega obrazca

Na kratko bom komentiral obrazec

name: CI    # название скрипта: будет отображаться во вкладке Actions

on: [push]  # действие, по которому запускается данный скрипт

jobs:       # роботы, которые будут выполняться
  build:    # сборка, которая..

    runs-on: ubuntu-latest      # ..будет запущена на основе этого образа

    steps:              # шаги которые будут проделаны после запуска образа
    - uses: actions/checkout@v1     # переход в самую актуальную ветку
    - name: Run a one-line script   # имя работы номер 1
      run: echo Hello, world!       # суть работы номер 1 (bash-команда записана в одну строку)
    - name: Run a multi-line script   # имя работы номер 2
      run: |                    # суть работы номер 2 (многострочная)
        echo Add other actions to build,
        echo test, and deploy your project.

Napišimo svoje na podlagi predloge:

0) Prav tako lahko pustite ime "CI". To je stvar okusa.

1) Nato morate izbrati dejanje/sprožilec, ki bo zagnal skript, v našem primeru je to običajen pritisk nove objave v repozitorij.

on:
  push

2) Za primer bomo pustili tudi sliko, na podlagi katere se bo skript zagnal, saj je Ubuntu kar zadovoljen s potrebno funkcionalnostjo. Gledati razpoložljiva orodja postane jasno, da je to lahko katera koli potrebna ali preprosto priročna slika (ali vsebnik Docker, ki temelji na njej).

  build:
    runs-on: ubuntu-latest

3) V korakih bomo najprej vzpostavili okolje za pripravo na glavno delo.

3.1) pojdite v vejo, ki jo potrebujemo (standardni korak checkout):

- uses: actions/checkout@v1

3.2) namestite Python:

    - name: Set up Python
      uses: actions/setup-python@v1
      with:
        python-version: 3.7

3.3) namestite odvisnosti našega generatorja:

    - name: Install dependencies
      run: |
          python -m pip install --upgrade pip
          pip install -r requirements.txt

3.4) ustvarite imenik, v katerem bodo ustvarjene strani spletnega mesta:

   - name: Make output folder
      run: mkdir output

4) Da bi bilo delo na spletnem mestu konsistentno, namreč, da ne bi izbrisali prejšnjih sprememb in da bi lahko dodajali spremembe v repozitorij spletnega mesta brez konfliktov, bo naslednji korak vsakokratno kloniranje repozitorija spletnega mesta:

   - name: Clone master branch
      run: git clone "https://${{ secrets.ACCESS_TOKEN }}@github.com/${GITHUB_ACTOR}/${GITHUB_ACTOR}.github.io.git" --branch master --single-branch ./output

Ta korak pokliče sistemske spremenljivke:

  • spremenljivka GITHUB_ACTOR GitHub se namesti sam in to je uporabniško ime, po krivdi katerega je bil zagnan ta skript;
  • spremenljivka secrets.ACCESS_TOKEN to se ustvari žeton za upravljanje Githuba, ga lahko posredujemo kot spremenljivko okolja, tako da ga nastavimo v zavihku Secrets naše nastavitve skladišča. Upoštevajte, da nam bo žeton med generiranjem zagotovljen enkrat, do njega ne bo več dostopa. Kot tudi vrednosti predmetov Secrets.

5) Nadaljujmo z ustvarjanjem naših strani:

   - name: Generate static pages
      run: pelican content -o output -s publishconf.py

Parametri, posredovani generatorju, so odgovorni za imenik, kamor bodo poslane ustvarjene datoteke (-o output) in konfiguracijsko datoteko, ki jo uporabljamo za ustvarjanje (-s publishconf.py; O pristopu k ločevanju lokalne konfiguracije in konfiguracije za objavo lahko preberete v dokumentaciji Pelican).

Naj vas spomnim, kaj je v naši mapi output Repozitorij spletnega mesta je že kloniran.

6) Nastavimo git in indeksiramo spremenjene datoteke:

    - name: Set git config and add changes
      run: |
          git config --global user.email "${GITHUB_ACTOR}@https://users.noreply.github.com/"
          git config --global user.name "${GITHUB_ACTOR}"
          git add --all
      working-directory: ./output

Na tej točki se uporabi že znana spremenljivka in navede se delovni imenik, v katerem bodo zagnani ukazi iz tega koraka. Ukaz za prehod v delovni imenik bi sicer izgledal takole - cd output.

7) Ustvarimo sporočilo o potrditvi, potrdimo spremembe in jih potisnimo v repozitorij. Tako da potrditev ni zaman in zato ne povzroči napake v bashu (izhodni rezultat ni 0) — najprej preverimo, ali je sploh potrebno nekaj zavezati in potisniti. Za to uporabimo ukaz git diff-index --quiet --cached HEAD -- ki bo izšel na terminalu 0 če ni sprememb glede na prejšnjo različico spletnega mesta in 1 obstajajo takšne spremembe. Nato obdelamo rezultat tega ukaza. Tako bomo v informacijo o izvajanju skripte beležili uporabne informacije o stanju strani v tej fazi, namesto da bi se samodejno zrušila in nam pošiljala poročilo o sesutju skripte.

Ta dejanja izvajamo tudi v našem imeniku s pripravljenimi stranmi.

   - name: Push and send notification
      run: |
          COMMIT_MESSAGE="Update pages on $(date +'%Y-%m-%d %H:%M:%S')"
          git diff-index --quiet --cached HEAD -- && echo "No changes!" && exit 0 || echo $COMMIT_MESSAGE
          # Only if repo have changes
          git commit -m "${COMMIT_MESSAGE}"
          git push https://${{ secrets.ACCESS_TOKEN }}@github.com/${GITHUB_ACTOR}/${GITHUB_ACTOR}.github.io.git master
      working-directory: ./output

Rezultat

Posledično vam tak skript omogoča, da ne razmišljate o ustvarjanju statičnih strani. Z dodajanjem sprememb neposredno v zasebni repozitorij, bodisi z delom z git iz katerega koli sistema ali ustvarjanjem datoteke prek spletnega vmesnika GitHub, bo Actions naredil vse sam. Če se skript nepričakovano zruši, bo na vaš e-poštni naslov poslano obvestilo.

Polna koda

Pustil bom svojo delovno različico, v kateri zadnji korak doda pošiljanje obvestila, da je bila objava potisnjena v glavno skladišče.

Uporabljajo se zgoraj opisane skrivnosti, kjer se doda žeton bota in ID uporabnika, kateremu je treba poslati sporočilo.

name: Push content to the user's GitHub pages repository

on:
  push

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
    - uses: actions/checkout@v1
    - name: Set up Python
      uses: actions/setup-python@v1
      with:
        python-version: 3.7
    - name: Install dependencies
      run: |
          python -m pip install --upgrade pip
          pip install -r requirements.txt
    - name: Make output folder
      run: mkdir output
    - name: Clone master branch
      run: git clone "https://${{ secrets.ACCESS_TOKEN }}@github.com/${GITHUB_ACTOR}/${GITHUB_ACTOR}.github.io.git" --branch master --single-branch ./output
    - name: Generate static pages
      run: pelican content -o output -s publishconf.py
    - name: Set git config and add changes
      run: |
          git config --global user.email "${GITHUB_ACTOR}@https://users.noreply.github.com/"
          git config --global user.name "${GITHUB_ACTOR}"
          git add --all
      working-directory: ./output
    - name: Push and send notification
      run: |
          COMMIT_MESSAGE="Update pages on $(date +'%Y-%m-%d %H:%M:%S')"
          git diff-index --quiet --cached HEAD -- && echo "No changes!" && exit 0 || echo $COMMIT_MESSAGE
          git commit -m "${COMMIT_MESSAGE}"
          git push https://${{ secrets.ACCESS_TOKEN }}@github.com/${GITHUB_ACTOR}/${GITHUB_ACTOR}.github.io.git master
          curl "https://api.telegram.org/bot${{ secrets.BOT_TOKEN }}/sendMessage?text=$COMMIT_MESSAGE %0ALook at ${GITHUB_ACTOR}.github.io %0ARepository%3A github.com/${GITHUB_ACTOR}/${GITHUB_ACTOR}.github.io&chat_id=${{ secrets.ADMIN_ID }}"
      working-directory: ./output

Galerija slik:

Dejanja GitHub kot CI/CD za spletno mesto na statičnem generatorju in straneh GitHub
Rezultat enega od izvajanj, prikazanih na zavihku Dejanja izvornega repozitorija

Dejanja GitHub kot CI/CD za spletno mesto na statičnem generatorju in straneh GitHub
Sporočilo bota o dokončanju skripta

Uporabne povezave

Razumevanje dejanj
Sintaksa dejanj
Seznam sprožilcev
Možnosti za virtualna okolja
Strani Github
Seznam statičnih generatorjev

Vir: www.habr.com

Dodaj komentar