Akcie GitHub ako CI/CD pre stránku statického generátora a stránky GitHub

Akcie GitHub ako CI/CD pre stránku statického generátora a stránky GitHub

Po troche prehľadania Habra ma prekvapilo, že na tému funkcie GitHub (beta) – Actions bolo publikovaných veľmi málo článkov.

Zdá sa, že takéto podhodnotenie možno vysvetliť skutočnosťou, že funkčnosť je stále v testovaní, aj keď „beta“. Je to však užitočná funkcia beta, ktorá umožňuje použitie tohto nástroja v súkromných úložiskách. Práve o práci s touto technológiou budem hovoriť v tomto článku.

pravek

Ak začneme po poriadku, tak asi stojí za zmienku, že v procese hľadania rýchlej, pohodlnej, jednoduchej a bezplatnej možnosti uloženia osobného webu „O mne“ som musel stráviť niekoľko nocí a prehrabávať sa množstvom článkov.

Niektorí ľudia si vyberú hosting, iní cloudový server a tí, ktorí nechcú rozumieť práci, interakcii a plateniu za toto všetko, ako nahrávanie statických stránok do úložiska, pretože teraz to možno urobiť na GitHub aj GitLab.

Samozrejme, toto je každého osobná voľba.

Moja posledná voľba bola GitHub Pages.

O stránkach

Kto nevie gh-pages - ide o možnosť uchovávania dokumentácie vo forme webovej stránky a je poskytovaná bezplatne a okrem dokumentácie sa navrhuje aj ukladanie osobných webových stránok. Túto funkcionalitu poskytuje GitHub všetkým používateľom a je dostupná v nastaveniach úložiska.

Úložisko projektu používa pobočku gh-pages, pre používateľskú stránku - samostatné úložisko s názvom username.github.io so zdrojmi stránok v master pobočka.

Viac podrobností nájdete v dokumentácii, ale dovoľte mi poznamenať, že GitHub je prekvapivo veľkorysý v tom, že umožňuje komukoľvek prepojiť svoju vlastnú doménu s takouto stránkou jednoduchým pridaním súboru CNAME s názvom domény a nastavením DNS vášho poskytovateľa domény na serveroch GitHub.

Som si istý, že je tu veľa článkov o tom, ako vytvoriť takúto stránku, takže o tom nebudem ďalej hovoriť.

Vznikajúci problém

Problémom bolo, že pri použití statického generátora je potrebné písať ďalšie skripty a využívať knižnice na zjednodušenie procesu generovania stránok a ich načítavania do úložiska. Jednoducho, ak si zdroje ukladáte do samostatného súkromného úložiska, tak pri každej zmene na stránke bolo potrebné nasadiť lokálne prostredie pre následné generovanie statických stránok a publikovanie v hlavnom úložisku webu.

Je tam hojnosť statické generátory a všetci majú rovnaký problém. Tieto akcie si vyžadujú príliš veľa času a úsilia a v konečnom dôsledku spomaľujú prácu na lokalite, najmä po niekoľkých migráciách z OS na OS alebo po incidentoch so stratou údajov na pevných diskoch. (tak to bolo v mojom prípade).

Len nedávno, buď vo vyskakovacom upozornení na webovej stránke alebo v bulletine od GitHub, bolo zaznamenané novovybudované CI/CD, ktoré umožnilo vykonávať tieto akcie s minimálnym úsilím.

O generátoroch statických stránok

Nebudem venovať osobitnú pozornosť tejto podpoložke, ale podelím sa o niekoľko téz, ku ktorým som dospel pri výbere a používaní nasledujúcich:

1) vyberte si generátor, ktorý vyhovuje vášmu programovaciemu jazyku, alebo taký, ktorý je čo najprehľadnejší. K tejto myšlienke som prišiel v čase, keď som sám musel pridať nejakú funkcionalitu, aby stránka fungovala, pridať barličky pre jej väčšiu stabilitu a automatizáciu. Okrem toho je to dobrý dôvod na to, aby ste si sami napísali ďalšie funkcie vo forme pluginov;

2) ktorý generátor si vybrať je osobná voľba, ale stojí za zváženie, že na prvé ponorenie do práce s funkcionalitou GitHub Pages musíte najprv nainštalovať Jekyll. Našťastie umožňuje vygenerovať webovú stránku zo zdrojov priamo v úložisku (Zopakujem to pri mojom výbere).

Môj výber generátora je založený na prvom bode. pelikán ktorý je napísaný v Pythone ľahko nahradil Jekyll, ktorý je mi cudzí (používal som ho skoro rok). Výsledkom je, že aj tvorba a úprava článkov a práca na webovej stránke prináša ďalšie skúsenosti v jazyku, ktorý je pre mňa zaujímavý.

__

Vyhlásenie o probléme

Hlavnou úlohou bude napísať skript (v skutočnosti konfiguračný súbor), ktorý by automaticky generoval statické stránky zo súkromného úložiska. Riešenie bude zahŕňať funkcionalitu virtuálneho prostredia. Samotný skript pridá hotové stránky do verejného úložiska.

Nástroje na riešenie

Nástroje, ktoré použijeme na vyriešenie problému:

  • akcie GitHub;
  • Python 3.7;
  • Pelikán;
  • Git;
  • stránky GitHub.

Riešenie

Takže po tom, čo sme sa trochu zoznámili s dokumentáciou a pochopili, ako sa píšu skripty pre akcie, bolo jasné, že tento mechanizmus úplne vyrieši vzniknutý problém. V čase písania tohto článku sa musíte prihlásiť na používanie tejto funkcie. na beta testovanie!

Akcie GitHub ako CI/CD pre stránku statického generátora a stránky GitHub
Popis novej funkcionality samotným Githubom

Písanie skriptu Actions začína vytvorením pomenovaného súboru v priečinku .github a jeho podpriečinok workflows. Môžete to urobiť manuálne alebo z editora na karte Akcie na stránke úložiska.

Akcie GitHub ako CI/CD pre stránku statického generátora a stránky GitHub
Príklad prázdneho formulára skriptu

Stručne sa vyjadrím k forme

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.

Napíšme si vlastné na základe šablóny:

0) Môžete tiež ponechať názov „CI“. Je to vec vkusu.

1) Ďalej musíte vybrať akciu/spúšťač, ktorý spustí skript, v našom prípade ide o zvyčajné zatlačenie nového odovzdania do úložiska.

on:
  push

2) Ako príklad necháme aj obrázok, na základe ktorého sa skript spustí, keďže Ubuntu je s potrebnou funkcionalitou celkom spokojné. Pozerajúc sa na dostupné nástroje je jasné, že to môže byť akýkoľvek potrebný alebo jednoducho pohodlný obrázok (alebo na ňom založený kontajner Docker).

  build:
    runs-on: ubuntu-latest

3) V krokoch najskôr nastavíme prostredie na prípravu na hlavnú prácu.

3.1) prejdite na pobočku, ktorú potrebujeme (štandardný krok checkout):

- uses: actions/checkout@v1

3.2) nainštalujte Python:

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

3.3) nainštalujte závislosti nášho generátora:

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

3.4) vytvorte adresár, v ktorom sa budú generovať stránky lokality:

   - name: Make output folder
      run: mkdir output

4) Aby práca na stránke bola konzistentná, teda aby sa neodstránili predchádzajúce zmeny a aby bolo možné pridávať zmeny do úložiska lokality bez konfliktov, ďalším krokom bude zakaždým naklonovať úložisko lokality:

   - 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

Tento krok volá systémové premenné:

  • premenlivý GITHUB_ACTOR GitHub sa nainštaluje sám a toto je používateľské meno, vinou ktorého bol tento skript spustený;
  • premenlivý secrets.ACCESS_TOKEN toto sa generuje token pre správu Github, môžeme ju odovzdať ako premennú prostredia nastavením v záložke Secrets nastavenia nášho úložiska. Upozorňujeme, že počas generovania nám bude token poskytnutý raz, ďalší prístup k nemu už nebude. Rovnako ako hodnoty položiek Secrets.

5) Prejdime ku generovaniu našich stránok:

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

Parametre odovzdané generátoru sú zodpovedné za adresár, kam sa budú odosielať vygenerované súbory (-o output) a konfiguračný súbor, ktorý používame na generovanie (-s publishconf.py; O prístupe k oddeleniu lokálnej konfigurácie a konfigurácie na zverejnenie si môžete prečítať v dokumentácii Pelican).

Dovoľte mi pripomenúť vám, čo je v našom priečinku output Úložisko stránok už bolo naklonované.

6) Nastavíme git a indexujeme naše zmenené súbory:

    - 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

V tomto bode sa použije už známa premenná a je uvedený pracovný adresár, v ktorom sa budú spúšťať príkazy z tohto kroku. Príkaz na prechod do pracovného adresára by inak vyzeral - cd output.

7) Vygenerujme správu o odovzdaní, odovzdajme zmeny a vložme ich do úložiska. Aby nebolo odovzdanie márne, a preto nevyvolalo chybu v bash (výstupný výsledok nie je 0) — najprv skontrolujme, či je vôbec potrebné niečo zaväzovať a tlačiť. Na to použijeme príkaz git diff-index --quiet --cached HEAD -- ktorý bude výstupom na terminál 0 ak nenastali žiadne zmeny oproti predchádzajúcej verzii stránky a 1 sú také zmeny. Potom spracujeme výsledok tohto príkazu. Do informácie o vykonaní skriptu teda zaznamenáme užitočné informácie o stave stránky v tejto fáze, namiesto toho, aby automaticky spadla a poslala nám správu o páde skriptu.

Tieto akcie vykonávame aj v našom adresári s pripravenými stránkami.

   - 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

Výsledok

Výsledkom je, že takýto skript vám umožňuje nemyslieť na vytváranie statických stránok. Pridaním zmien priamo do súkromného úložiska, či už prácou s git z akéhokoľvek systému alebo vytvorením súboru cez webové rozhranie GitHub, urobí Actions všetko sám. Ak skript neočakávane zlyhá, na váš e-mail sa odošle upozornenie.

Úplný kód

Opustím svoju pracovnú verziu, do ktorej sa v poslednom kroku pridáva odoslanie upozornenia, že odovzdanie bolo odoslané do hlavného úložiska.

Používajú sa vyššie opísané tajomstvá, kde sa pridá token bota a ID používateľa, ktorému je potrebné správu odoslať.

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

Obrázky

Akcie GitHub ako CI/CD pre stránku statického generátora a stránky GitHub
Výsledok jedného zo spustení zobrazených na karte Akcie zdrojového úložiska

Akcie GitHub ako CI/CD pre stránku statického generátora a stránky GitHub
Správa od robota o dokončení skriptu

Užitočné odkazy

Pochopenie akcií
Syntax akcií
Zoznam spúšťačov
Možnosti pre virtuálne prostredia
Stránky Github
Zoznam statických generátorov

Zdroj: hab.com

Pridať komentár