Övning – Skapa och köra ett grundläggande arbetsflöde

Slutförd

Viktigt!

Du behöver en egen Azure-prenumeration för att utföra den här övningen, och avgifter kan tillkomma. Om du inte redan har en Azure-prenumeration kan du skapa ett kostnadsfritt konto innan du börjar.

Du vill automatisera distributionen av uppdateringar till leksaksföretagets webbplats. Som ett första steg skapar du ett grundläggande arbetsflöde i GitHub Actions.

I den här övningen kommer du att:

• Skapa ett GitHub-konto och en lagringsplats.
• Skapa ett grundläggande arbetsflöde.
• Kör ditt grundläggande arbetsflöde.

Skapa en lagringsplats i GitHub

1. I en webbläsare går du till GitHub. Logga in med ditt GitHub-konto eller skapa ett nytt konto om du inte har något.

2. Välj plusikonen (+) längst upp till höger i fönstret och välj sedan Ny lagringsplats.

   

3. Ange information om den nya lagringsplatsen:

   • Ägare: Välj ditt GitHub-användarnamn på den nedrullningsbara menyn. I skärmbilden mygithubuser är lagringsplatsens ägares GitHub-kontonamn. Du använder ditt kontonamn senare i den här modulen.
   • Lagringsplatsnamn: Ange ett beskrivande men kort namn. I den här modulen använder du toy-website-workflow.
   • Beskrivning: Inkludera en beskrivning som hjälper andra att förstå lagringsplatsens syfte.
   • Privat: Du kan använda GitHub för att skapa offentliga och privata lagringsplatser. Skapa en privat lagringsplats eftersom endast personer i organisationen ska ha åtkomst till din leksakswebbplatss filer. Du kan ge åtkomst till andra senare.

   När du är klar bör lagringsplatsens konfiguration se ut som följande skärmbild:

   

4. Välj Create repository (Skapa lagringsplats).

Klona lagringsplatsen

Klona lagringsplatsen i Visual Studio Code.

1. På lagringsplatsen väljer du kopieringsknappen för att kopiera URL:en till Git-lagringsplatsen.

   

2. Öppna Visual Studio Code.

3. Öppna ett Terminalfönster i Visual Studio Code genom att välja Terminal>Ny terminal. Fönstret öppnas vanligtvis längst ned på skärmen.

4. Navigera i terminalen till den katalog där du vill klona GitHub-lagringsplatsen på den lokala datorn. Om du till exempel vill klona lagringsplatsen till mappen toy-website-workflow kör du följande kommando:

   cd toy-website-workflow
   

5. Skriv git clone och klistra sedan in url:en som du kopierade tidigare, vilket ser ut ungefär så här:

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

   Du får en varning om att du klonade en tom lagringsplats. Du kan ignorera meddelandet.

6. Det här är första gången du använder den här lagringsplatsen, så du kan uppmanas att logga in.

   I Windows skriver du 1 för att autentisera med hjälp av en webbläsare och väljer Retur.

   På macOS väljer du Auktorisera.

7. Ett webbläsarfönster öppnas. Du kan behöva logga in på GitHub igen. Välj Auktorisera.

8. Öppna Visual Studio Code igen i lagringsplatsens mapp genom att köra följande kommando:

   code -r toy-website-workflow
   

Dricks

Du kan också redigera dina GitHub Actions-arbetsflödesdefinitioner med hjälp av GitHub-webbanvändargränssnittet. När du öppnar en arbetsflödesdefinition hjälper GitHub dig med YAML-filsyntax och indrag och tillhandahåller exempelkodfragment för de åtgärder som du kanske vill använda. I den här modulen arbetar du med definitionsfilen i Visual Studio Code, men du kan utforska GitHub-redigeraren för att se hur den fungerar.

Skapa en YAML-arbetsflödesdefinition

Nu när du har skapat och klonat lagringsplatsen är du redo att skapa en grundläggande arbetsflödesdefinition.

1. Öppna Utforskaren i Visual Studio Code.

2. Skapa en ny mapp med namnet .github i roten i mappstrukturen för leksakswebbplatsarbetsflödet.

   Kommentar

   Se till att du inkluderar perioden i början av mappnamnet. Detta indikerar att det här är en dold mapp, och GitHub kräver perioden för GitHub Actions för att identifiera arbetsflödesdefinitionen.

3. I .github-mappen skapar du en annan mapp med namnet workflows.

4. I mappen arbetsflöden skapar du en ny fil med namnet workflow.yml.

   

5. Kopiera följande arbetsflödesdefinition till filen:

   name: deploy-toy-website
   
   on: [workflow_dispatch]
   
   jobs:
     say-hello:
       runs-on: ubuntu-latest
       steps:
         - name: 'placeholder step'
           run: echo "Hello world!"
   

6. Spara filen.

7. Checka in och skicka filen till din GitHub-lagringsplats med följande kommandon:

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

Dricks

Visual Studio Code hjälper dig med indraget för YAML-filen. Håll utkik efter vågiga rader som indikerar syntaxfel eller välj Visa>problem om du vill visa en lista över problem i filen.

Kör arbetsflödet

Du har skapat en arbetsflödesdefinition. GitHub Actions identifierar automatiskt arbetsflödesfilen eftersom den finns i katalogen .github/workflows .

1. Gå till lagringsplatsen i webbläsaren. Du kan behöva uppdatera sidan för att se dina ändringar.

2. Välj fliken Åtgärder.

   

3. Välj arbetsflödet deploy-toy-website .

   

4. Välj listrutan Kör arbetsflöde och välj sedan knappen Kör arbetsflöde.

   

5. Arbetsflödet börjar köras. Det kan ta en stund och du kan uppdatera sidan, men den bör uppdateras automatiskt och visa en i kö eller körning eller till och med redan slutförd arbetsflödeskörning.

   

   Observera att körningsstatusen ursprungligen visas som I kö. Det kan ta lite tid innan arbetsflödet startas. Jobbet läggs till i en kö för en löpare, och när en löpare är tillgänglig tilldelar GitHub Actions löparen och startar jobbet. Jobbstatusen blir sedan Kör.

   Varje arbetsflödeskörning innehåller en identifierare. Du kan använda den här identifieraren när du behöver referera till arbetsflödeskörningen och för att hitta en specifik arbetsflödeskörning.

Verifiera arbetsflödeskörningen

1. När arbetsflödeskörningen startar väljer du deploy-toy-website för att visa körningens information. Uppdatera sidan tills jobbstatusen visar Lyckades.

   

   Observera också att sidan innehåller en identifierare för Git-incheckningen som körningen använde. Incheckningens identifierare anger vilken version av lagringsplatsens innehåll som arbetsflödet använde.

2. I listan över jobb väljer du say-hello.

   

3. Jobbinformationssidan visas, som visar loggen för de steg som arbetsflödet körde åt dig. Observera att platshållarsteget ingår.

   

   Observera att listan innehåller steg som du inte angav. De här stegen skapas automatiskt av GitHub Actions.

4. Välj platshållarsteg.

   

   Loggarna för det här steget innehåller innehållet i kommandot som det angavs i ditt arbetsflödes YAML-fil och hello world! -texten som skriptet släppte ut.

Länka arbetsflödeskörning till en incheckning

Det är bra att förstå hur du korsreferensar en arbetsflödeskörning till incheckningen av körningen. Genom att länka arbetsflödeskörning till en incheckning kan du spåra historiken för dina distributioner och diagnostisera problem.

1. Välj Sammanfattning för att återgå till körningssammanfattningen.

2. Välj incheckningsidentifieraren. GitHub visar information om incheckningen som utlöste arbetsflödeskörningen.