Gyakorlat – Alapszintű munkafolyamat létrehozása és futtatása

Befejeződött

Fontos

Ennek a gyakorlatnak az elvégzéséhez saját Azure-előfizetés szükséges, amely költségekkel járhat. Ha még nem rendelkezik Azure-előfizetéssel, első lépésként hozzon létre egy ingyenes fiókot.

Szeretné automatizálni a frissítések üzembe helyezését a toy cég webhelyén. Első lépésként egy alapszintű munkafolyamatot fog létrehozni a GitHub Actionsben.

Ebben a gyakorlatban a következőket fogja végrehajtani:

  • Hozzon létre egy GitHub-fiókot és -adattárat.
  • Hozzon létre egy alapszintű munkafolyamatot.
  • Hajtsa végre az alapszintű munkafolyamatot.

Adattár létrehozása a GitHubon

  1. Egy böngészőben nyissa meg a GitHubot. Jelentkezzen be a GitHub-fiókjával, vagy hozzon létre egy új fiókot, ha nem rendelkezik ilyen fiókkal.

  2. Válassza az ablak jobb felső sarkában található plusz (+) ikont, majd válassza az Új adattár lehetőséget.

    Screenshot of the GitHub interface that shows the menu for creating a new repository.

  3. Adja meg az új adattár részleteit:

    • Tulajdonos: Válassza ki a GitHub-felhasználónevet a legördülő menüből. A képernyőképen mygithubuser az adattár tulajdonosának GitHub-fiókneve látható. A fiók nevét a modul későbbi részében fogja használni.
    • Adattár neve: Adjon meg egy értelmes, de rövid nevet. Ehhez a modulhoz használja a következőt toy-website-workflow: .
    • Leírás: Adjon meg egy leírást, amely segít másoknak megérteni az adattár célját.
    • Privát: A GitHub használatával nyilvános és privát adattárakat hozhat létre. Hozzon létre egy privát adattárat, mert csak a szervezeten belüli személyek férhetnek hozzá a felhasználói webhely fájljaihoz. Később hozzáférést adhat másoknak.

    Miután végzett, az adattár konfigurációjának az alábbi képernyőképhez hasonlóan kell kinéznie:

    Screenshot of the GitHub interface showing the configuration for the repository to create.

  4. Válassza a Create repository (Adattár létrehozása) gombot.

A tárház klónozása

A Visual Studio Code-ban klónozza az adattárat.

  1. Az adattár oldalán válassza a Másolás gombot az URL-cím Git-adattárba való másolásához.

    Screenshot of the GitHub interface showing the new empty repository, with the repository URL copy button highlighted.

  2. Nyissa meg a Visual Studio Code-ot.

  3. Nyisson meg egy Visual Studio Code-terminálablakot az Új terminál terminál>kiválasztásával. Az ablak általában a képernyő alján nyílik meg.

  4. Lépjen a terminálon arra a könyvtárra, ahol klónozni szeretné a GitHub-adattárat a helyi számítógépen. Ha például a játékwebhely-munkafolyamat mappába szeretné klónozni az adattárat, futtassa a következő parancsot:

    cd toy-website-workflow
    
  5. Írja be git clone , majd illessze be a korábban másolt URL-címet, amely így néz ki:

    git clone https://github.com/mygithubuser/toy-website-workflow
    

    Figyelmeztetést kap, hogy klónozott egy üres adattárat. Figyelmen kívül hagyhatja az üzenetet.

  6. Ez az első alkalom, hogy ezt az adattárat használja, ezért előfordulhat, hogy a rendszer kérni fogja a bejelentkezést.

    Windows rendszeren írja be az 1 értéket a webböngészővel történő hitelesítéshez, majd válassza az Enter lehetőséget.

    MacOS rendszeren válassza az Engedélyezés lehetőséget.

  7. Megnyílik egy böngészőablak. Előfordulhat, hogy újra be kell jelentkeznie a GitHubra. Válassza az Engedélyezés lehetőséget.

  8. Nyissa meg újra a Visual Studio Code-ot az adattár mappájában az alábbi parancs futtatásával:

    code -r toy-website-workflow
    

Tipp.

A GitHub Actions munkafolyamat-definícióit a GitHub webes felhasználói felületén is szerkesztheti. Amikor megnyit egy munkafolyamat-definíciót, a GitHub segít a YAML-fájl szintaxisában és behúzásában, és példakódrészleteket biztosít a használni kívánt műveletekhez. Ebben a modulban a Visual Studio Code definíciós fájljával fog dolgozni, de a GitHub-szerkesztőt is megismerheti, hogy hogyan működik.

YAML-munkafolyamat-definíció létrehozása

Most, hogy létrehozta és klónozta az adattárat, készen áll egy alapszintű munkafolyamat-definíció létrehozására.

  1. Nyissa meg az Explorert a Visual Studio Code-ban.

  2. A toy-website-workflow mappastruktúra gyökerében hozzon létre egy .github nevű új mappát.

    Feljegyzés

    Ügyeljen arra, hogy a mappanév elején szerepeljen az időszak. Ez azt jelzi, hogy ez egy rejtett mappa, és a GitHub megköveteli, hogy a GitHub Actions észlelje a munkafolyamat-definíciót.

  3. A .github mappában hozzon létre egy másik, munkafolyamatnak nevezett mappát.

  4. A munkafolyamatok mappában hozzon létre egy workflow.yml nevű új fájlt.

    Screenshot of the Visual Studio Code Explorer, with the .github/workflows folder and the workflow.yml file shown.

  5. Másolja a következő munkafolyamat-definíciót a fájlba:

    name: deploy-toy-website
    
    on: [workflow_dispatch]
    
    jobs:
      say-hello:
        runs-on: ubuntu-latest
        steps:
          - name: 'placeholder step'
            run: echo "Hello world!"
    
  6. Mentse a fájlt.

  7. Véglegesítse és küldje le a fájlt a GitHub-adattárba az alábbi parancsokkal:

    git add .
    git commit -m "Add initial workflow definition"
    git push
    

Tipp.

A Visual Studio Code segít a YAML-fájl behúzásában. Keresse meg a szintaxishibákat jelző hullámos sorokat, vagy válassza a Problémák megtekintése>lehetőséget a fájlban található problémák listájának megtekintéséhez.

A munkafolyamat futtatása

Létrehozott egy munkafolyamat-definíciót. A GitHub Actions automatikusan észleli a munkafolyamat-fájlt, mert az a .github/workflows könyvtárban található.

  1. A böngészőben keresse meg az adattárat. Előfordulhat, hogy frissítenie kell a lapot a módosítások megtekintéséhez.

  2. Válassza a Műveletek lapot.

    Screenshot of the GitHub interface showing the repository page, and the Actions tab highlighted.

  3. Válassza ki a üzembe helyezési-toy-website munkafolyamatot.

    Screenshot of the GitHub interface showing the Actions tab, with the deploy-toy-website workflow selected.

  4. Válassza a Munkafolyamat futtatása legördülő menüt, majd a Munkafolyamat futtatása gombot.

    Screenshot of the GitHub interface showing the Actions tab, with the Run workflow dropdown and button selected.

  5. A munkafolyamat elkezd futni. Eltarthat néhány pillanatig, és frissítheti a lapot, de automatikusan frissítenie kell, és meg kell jelennie egy várólistán lévő vagy futó vagy akár már befejezett munkafolyamat-futtatásnak.

    Screenshot of the GitHub interface showing the Actions tab, with one workflow running.

    Figyelje meg, hogy a futtatás állapota kezdetben üzenetsorként jelenik meg. A munkafolyamat elindítása eltarthat egy ideig. A feladat hozzá lesz adva egy futó várólistájához, és amint egy futó elérhető, a GitHub Actions hozzárendeli a futót, és elindítja a feladatot. A feladat állapota ezután végrehajtóvá válik.

    Minden munkafolyamat-futtatás tartalmaz egy azonosítót. Ezt az azonosítót akkor használhatja, ha a munkafolyamat-futtatásra kell hivatkoznia, és segíthet megtalálni egy adott munkafolyamat-futtatásokat.

A munkafolyamat futtatásának ellenőrzése

  1. A munkafolyamat futtatásakor válassza a deploy-toy-website lehetőséget a futtatás részleteinek megtekintéséhez. Frissítse a lapot, amíg a feladat állapota meg nem jelenik a Siker gombra.

    Screenshot of the GitHub interface showing the details of the workflow run, with the status and commit identifier highlighted.

    Figyelje meg azt is, hogy az oldal tartalmaz egy azonosítót a futtatás által használt Git-véglegesítéshez. A véglegesítés azonosítója az adattárban használt tartalom azon verzióját jelzi, amelyet a munkafolyamat használt.

  2. A feladatok listájában válassza a "hello" lehetőséget.

    Screenshot of the GitHub interface showing the run details menu, with the say-hello job highlighted.

  3. Megjelenik a feladatinformációs oldal, amely a munkafolyamat által futtatott lépések naplóját jeleníti meg. Figyelje meg, hogy a helyőrző lépés is benne van.

    Screenshot of the GitHub interface showing the workflow run log, with the placeholder step highlighted.

    Figyelje meg, hogy a lista olyan lépéseket tartalmaz, amelyeket nem adott meg. Ezeket a lépéseket a GitHub Actions automatikusan létrehozza.

  4. Válassza ki a helyőrző lépést.

    Screenshot of the GitHub interface showing the workflow run log, with the placeholder step log shown.

    A lépés naplói tartalmazzák a parancs tartalmát a munkafolyamat YAML-fájljában megadott módon, valamint a szkript által kibocsátott Hello world! szöveget.

Érdemes megérteni, hogyan hivatkozhat kereszthivatkozást egy munkafolyamat futtatására a futtatott futtatás véglegesítéséhez. A munkafolyamat-végrehajtás véglegesítéshez való csatolásával nyomon követheti az üzemelő példányok előzményeit, és diagnosztizálhatja a problémákat.

  1. Válassza az Összegzés lehetőséget a futtatási összegzéshez való visszatéréshez.

  2. Válassza ki a véglegesítés azonosítót. A GitHub megjeleníti a munkafolyamat futtatását kiváltó véglegesítés részleteit.