Transcription

Witam bardzo serdecznie, z tej strony Artur Chmaro, a w tym odcinku chciałbym pokazać Ci bardzo fajne narzędzie, jakim jest GitHub Actions. GitHub Actions, jak sama nazwa wskazuje, są to akcje, które możemy wykonać z naszego repozytorium, które hostujemy w platformie GitHub. No i co to mogą być za akcje? Jest tutaj bardzo wiele różnych pomysłów, przede wszystkim w momencie, kiedy wypychasz swój kod do swojego repozytorium, no to możemy sobie jakieś rzeczy zautomatyzować, możemy np. wykonać testy, możemy zbudować nową wersję naszej aplikacji, możemy wysłać jakieś powiadomienie do członków zespołu, możemy odpalić jakieś narzędzie, które analizuje kod i na tej podstawie dzieje się coś dalej. Więc jest to naprawdę bardzo potężne narzędzie, które możecie sobie skonfigurować już dzisiaj w swoim repozytorium GitHub. Tutaj macie też na stronie oficjalnej różne przykłady, możecie sobie tutaj dodawać jakieś labelki do pull requestów, możecie w momencie, kiedy wypchniecie swój kod, zdeployować go do jakiejś zewnętrznej usługi, więc tutaj jest bardzo dużo różnych możliwości. W dzisiejszym odcinku, żeby tutaj nie było tak teoretycznie, żeby nie było, że sobie tutaj tylko się mądrze do kamery, to oczywiście Wam pokażę taką dosyć prostą integrację z GitHub Actions, a mianowicie zrobimy sobie deploy mojej aplikacji zrobionej z użyciem Next.js. Więc w momencie, kiedy wypchnę kod do brancza staging, chciałbym, żeby GitHub Action w tle połączył się z moim serwerem VPS i wykonał kilka różnych poleceń z użyciem terminala SSH. Myślę, że jest to dosyć fajne rozwiązanie, bo może Wam się przydać nie tylko w aplikacjach Next.js, ale generalnie w wielu różnych aplikacjach, w wielu różnych sytuacjach, w momencie, kiedy jest nowy kod, no to trzeba coś zrobić na jakimś serwerze, trzeba wykonać jakieś polecenie, trzeba zaciągnąć jakieś zmiany, więc myślę, że jest to całkiem taki niezły przykład, żebyście zobaczyli w ogóle, jak się dodaje takie akcje do Waszego repozytorium, jak sobie skonfigurować sekrety, bo oczywiście w momencie, kiedy łączymy się z jakimś zewnętrznym serwisem, no to często musimy mieć jakiś token, który da nam dostęp do tego serwera. I to oczywiście za chwileczkę wszystko Wam pokażę, jak możecie zrobić. Oczywiście, jeżeli macie jakieś pytania do GitHub Actions, albo macie jakieś pomysły na filmiki, które mógłbym dla Was nagrać, to oczywiście zachęcam do sekcji komentarzy niżej. Wrzucajcie tam swoje pomysły i pytania, a ja w następnych materiałach dotyczących GitHub Actions postaram się na to wszystko odpowiedzieć. Tymczasem nie przedłużam i przeskakujemy już do kodu i pokażę Wam, jak zrobić taką prostą integrację, jak po prostu sobie skonfigurować deploy na serwer VPS. Więc zaczniemy sobie od zerknięcia do dokumentacji, bo oczywiście nie pamiętam tutaj wszystkiego na pamięć, jak każdy dobry deweloper, wchodzę teraz do dokumentacji i czytam po prostu to, co musimy tutaj zrobić. Więc przede wszystkim, żeby podpiąć sobie taki workflow, czyli taki jakby przepis na nasz GitHub Action, bo oczywiście GitHub musi wiedzieć, jakie akcje i kiedy konkretnie może wykonać w naszym imieniu ten właśnie automat, który wykonuje te akcje. I to oczywiście zapisujemy w formie specjalnego pliku YAML. I tutaj taki plik musimy dodać sobie w naszym projekcie do folderu GitHub i później do folderu workflows. Teraz wejdę do projektu i utworzę folder GitHub. Tutaj utworzymy plik staging-deploy.yaml i w takim oto tutaj pliku możemy już wpisywać nasz przepis na nasz GitHub Action. I oczywiście musimy tutaj podać parę różnych rzeczy, żeby GitHub Action wiedział, co mamy tutaj do roboty. Oczywiście zaczniemy od tego, że sobie nazwiemy ten konkretny workflow, nazwiemy sobie go na przykład staging-deploy. No i teraz musimy też podać sobie dokładnie informacje, kiedy chcemy dany workflow wykonać. Na ten moment wykonamy go tylko w sytuacji, gdy ktoś faktycznie manualnie sobie tego zażyczy, no bo po prostu przetestujemy na początek, czy w ogóle ten deploy w jakiś tam sposób zadziała. Więc tutaj wtedy możemy się posłużyć on workflow dispatch. I oczywiście to wszystko macie dokładnie, możecie sobie zobaczyć w dokumentacji. Tutaj to wszystko jest wyszczególnione. Oczywiście macie możliwość odpalania sobie tego workflow dispatch w opcji manualnej i możecie sobie przekazywać tutaj nawet parametry, co czasami jest całkiem przydatne, no bo możemy chcieć wykonać daną akcję na przykład z jakąś nazwą, chcemy przekazać jakiś adres IP, chcemy przekazać jakiś parametr, więc oczywiście wtedy używamy tej opcji workflow dispatch i mamy możliwość przekazania różnych inputów. Natomiast w tym prostym przykładzie na razie sobie zrobimy po prostu możliwość odpalenia manualnie naszej akcji. Natomiast tutaj macie też możliwość zrobienia bardziej zaawansowanych rzeczy, możecie też sobie na przykład zaplanować wykonanie danej akcji na przykład każdego dnia o godzinie 3 nad ranem albo co pół godziny. Tutaj też nie ma problemu, żeby robić takie automatyzacje, które się odpalają w sposób cykliczny. To już oczywiście zależy od tego, co konkretnie chcecie zautomatyzować, co konkretnie chcecie zrobić. No i tutaj my zrobimy sobie połączenie z serwerem VPS z użyciem SSH, więc możemy to zrobić najprościej z użyciem GitHub Marketplace, ponieważ tutaj mamy już różne gotowce. Zobaczcie, macie tu jakieś akcje typu Upload a Build Artifact, macie Setup Node.js Environment, więc tutaj jest bardzo dużo różnych rzeczy. Oczywiście nie sposób jest, żebym w takim krótkim filmiku wszystko Wam tutaj pokazał, więc zaczniemy po prostu od prostego przykładu, który myślę, że da Wam jakieś takie po prostu spojrzenie, jak w ogóle to narzędzie działa. Skorzystam sobie z tej konkretnej akcji, bo jestem tutaj taki cwaniak, że po prostu wcześniej przed nagraniem sobie po prostu sprawdziłem to i przetestowałem, więc tutaj oczywiście wybiorę taką sprawdzoną wtyczkę, ale oczywiście jak Wy chcecie skorzystać z innej, nie ma żadnego problemu. Tutaj ważne jest to, że ja chcę wykonać kilka komend, no bo po prostu chcę się zalogować na mój serwer przez SSH i tam wykonać kilka poleceń. Chcę wejść do odkreślonego folderu, chcę tam zaciągnąć sobie najnowsze pliki z Gita, no i później chcę oczywiście przebudować Nexta i zresetować serwer, który po prostu odpala tę moją aplikację w tle. No i mamy skopiowany nasz Build, tutaj bardzo ważny atrybut, w którym możemy wyznaczyć, w jakim środowisku chcemy odpalić naszą akcję. I to jest bardzo ważne, ponieważ czasami jest potrzeba, żeby na przykład skorzystać z GitHub Action i na przykład przetestować coś w środowisku macOS, albo Windows, albo Linux. I tutaj w zasadzie nie ma problemu, żeby skorzystać z tych trzech usług. Natomiast tutaj w naszym przypadku odpalamy sobie to po prostu na kontenerze Ubuntu Latest. I tutaj mamy różne stepy. I tutaj możemy sobie nazwać ten Build na przykład Build and Deploy. I tutaj mamy różne kroki, które chcemy sobie wykonać. I w tym konkretnym przypadku chcemy sobie wykonać różnego rodzaju polecenia, czyli sobie po prostu wpiszemy Multiple SSH Commands. Tutaj mamy nazwę tej wtyczki, tego gotowego rozwiązania z marketplace'u githubowego, czyli tutaj w ten sposób się nazywa ta akcja, czyli aprbloy.shaction. Tutaj musimy przekazać sobie różnego rodzaju parametry. Więc przede wszystkim ta wtyczka musi wiedzieć, do jakiego hosta chcemy się połączyć, z użyciem jakiego użytkownika chcemy się połączyć, na jaki port. No i musimy też przekazać hasło. Ale tu w tym konkretnym przypadku skonfigurujemy sobie dostęp nie z użyciem hasła, ale z użyciem klucza prywatnego, który za chwileczkę sobie oczywiście skonfigurujemy i wprowadzimy do githuba, tak żeby github wiedział jak go użyć. No i tutaj jeszcze dodatkowa uwaga jest taka, że nie chcemy wykonać jednego polecenia, ale chcemy sobie wykonać kilka poleceń, a konkretnie chcemy już tutaj na naszym serwerze wejść sobie po prostu do konkretnego folderu. Te oczywiście polecenia już po zalogowaniu przez ten github action na naszym serwerze, te polecenia zostaną tam wykonane. Czyli normalnie ja jako deweloper musiałbym wejść na ten serwer, wejść do konkretnego folderu i na przykład zarządzać pobranie najnowszych plików albo wykonanie jakiejś komendy, wykonanie jakiegoś programu. Natomiast tutaj github action ma informację, że chce żeby się on zalogował w moim imieniu na serwer i tam wykonał szereg różnych poleceń. Więc teraz sobie to zapiszemy no i spróbujemy to wrzucić do naszego githuba. I oczywiście w tym celu musimy sobie to zakomitować. Po wypchnięciu tego kodu do githuba możemy sobie wejść na aplikację webową no i zobaczyć po prostu czy tutaj w tej zakładce actions, czy ta konkretna akcja się pojawiła. I po odświeżeniu strony widzimy już, że mamy tutaj nie tą standardową stronę, tylko mamy już tutaj pokazany konkretny workflow. Więc mamy tutaj, możemy sobie na niego kliknąć no i na razie nie mamy żadnych odpaleń tego workflow. Oczywiście tutaj możemy sobie go kliknąć, jednak teraz muszę Wam powiedzieć o bardzo ważnej rzeczy, jaką jest właśnie sekret, ponieważ zobaczcie github zaciąga sobie sekrety z pewnego miejsca. No i to miejsce to jest po prostu ustawienia naszego projektu albo naszej organizacji, ponieważ możemy sobie konfigurować sekrety zarówno dla danego repozytorium, jak i dla danego projektu. I można to zrobić bardzo prosto, wystarczy sobie wejść w ustawienia settings no i tutaj mamy zakładkę secrets. I teraz w momencie, kiedy mam nazwany sekret staging host, to sobie do niego po prostu podaję IP mojej maszyny, do której się chcę połączyć. Więc tutaj akurat Wam IP nie pokażę, żebyście nie hakowali mojego serwera, natomiast Wam szybko pokażę, jak można sobie skonfigurować na przykład klucz, ponieważ oczywiście tutaj, żeby github action był w stanie się połączyć z naszym serwerem, no to musi dojść do uwierzytelnienia i to zrobimy bardzo szybko. Wejdę teraz sobie z mojej maszyny lokalnej na mój serwerek. Teraz wejdę sobie do folderu ssh i tutaj widzicie, że mam kilka różnych kluczy. No i teraz sobie wygeneruję nowy klucz, podaję nazwę new github action bez dodatkowego hasła i teraz mogę sobie wylistować ten klucz prywatny new github action i możemy sobie ten kluczyk ładnie skopiować i wstawić go sobie do naszego sekretu. Oczywiście u Was wcześniej tutaj nie będzie żadnych sekretów, więc musicie je tworzyć i je odpowiednio nazywać. Czyli jeżeli macie na przykład staging podkreślenia key, no to ten sekret zostanie podstawiony tutaj w te miejsce przez ten konkretny plugin. Więc wejdziemy sobie teraz tutaj i po prostu wkleimy sobie ten private key. Tutaj w tym momencie mamy już podstawiony ten klucz prywatny w te miejsce. Teraz oczywiście pozostaje nam jeszcze skonfigurować ten serwer ssh, tak żeby on reagował na ten konkretny klucz, więc w tym celu sobie po prostu wylistuję teraz szybko klucz publiczny i sobie go dopiszę do kluczy zautoryzowanych, tak żeby po prostu dać dostęp do tego serwera z użyciem tego klucza prywatnego. I to oczywiście robimy sobie dopisując kolejną linijkę do pliku authorized keys i tutaj sobie możemy wcisnąć ten nowy klucz. Zapisujemy ten plik, ssh, agent, tutaj jeszcze się upewnię, że agent ssh w tle działa, więc teraz już powinienem móc mieć możliwość odpalenia tą konkretną github akcję, więc spróbujemy to zrobić. Wchodzę w actions, staging deploy i teraz odpalimy sobie z użyciem brancza master, więc możemy sobie teraz zrobić run workflow. I widzicie, że pojawił się nowy workflow, który teraz się odpalił. Oczywiście Wasze akcje w tle, no chwilę to zajmuje, żeby dana akcja wystartowała. Oczywiście ona musi się zdeployować. No i tutaj popełniłem pierwszy błąd, ponieważ oczywiście mamy sekrety skonfigurowane z prefiksem staging, a ja oczywiście z pośpiechu tutaj wpisałem staging, po prostu host bez prefiksu, więc teraz to szybko naprawię i odpalamy naszą akcję jeszcze raz. Tutaj możemy sobie podglądnąć, co się dzieje w tle. Na początek jest tutaj zaciągane do naszego kontenera, który się odpala na serwerach githuba ta wtyczka, z którą mamy z marketplace'u, czyli ten appleboy ssh action, a w tle już widzicie, że jest odpalany mój konkretny kod. I tutaj bardzo ciekawa rzecz się dzieje, ponieważ przez to, że użytkownik mój jest sekretem, to tutaj od razu mamy parę fajnych rzeczy. Przede wszystkim te sekrety są podstawiane do tego naszego kodu w workflow i nie są one widoczne dla innych, ale też w logach te właśnie rzeczy, które są sekretem, automatycznie przez githuba są zagwiazdkowane, więc nawet jeżeli używacie tutaj jakichś haseł czy jakichś tokenów, no to w tle one zawsze github je sobie podstawi, ale użytkownik czy w logach, czy po prostu w kodzie tego workflow tego nie widzi. No i widzicie, że tutaj po chwili mamy ładnego loga, że się tutaj ta moja aplikacja w tle zdeployowała. Mamy też tutaj oczywiście ładny ptaszek, że nasza akcja się wykonała prawidłowo. No to teraz jeszcze sobie zmodyfikujemy ten kod, żeby on odpalał się automatycznie, no bo po co nam akcja, którą musimy i tak manualnie odpalić. Oczywiście też to ma pewnego rodzaju zalety, no bo możemy sobie po prostu deployować naszą aplikację bez wchodzenia na serwer VPS, co w zasadzie jest pewną wygodą, bo możemy to zrobić nawet z telefonu, ale teraz zrobimy sobie pewną modyfikację, a mianowicie dodamy sobie dodatkowy warunek, kiedy chcemy wykonać tę prostą akcję. Więc chcemy ją wykonać nie tylko w momencie, kiedy ktoś manualnie sobie tutaj kliknie, ale też chcemy ją wykonać w momencie, kiedy mamy push, kiedy mamy wypchnięcie nowego kodu na branczę. I tutaj też oczywiście możecie sobie wypisać tę branczę. Ja zrobię sobie branż po prostu staging, więc w momencie, kiedy ja albo kolega zrobi jakieś zmiany i chce je automatycznie zobaczyć na serwerze, to wystarczy, że po prostu wrzuci najnowszy kod i wypchnie go nawet z forcem na branż staging, a w tle po prostu zostanie odpalona ta nasza akcja. I zobaczcie, teraz wypchnę kod z brancza staging i zobaczymy, czy nasz GitHub Action zostanie automatycznie wykonany. I wchodzimy w zakładkę actions i widzicie, że ta konkretna akcja została wykonana przeze mnie, więc nie jest ona manualnie odpalona, tylko została ona wywołana przez to automatyczne wypchnięcie. Oczywiście tutaj ten workflow, który Wam pokazuję, on jest tutaj taki, nazwijmy to, bardzo prosty, jednak nie chciałem tutaj wchodzić aż w takie szczegóły, bo chciałem Wam po prostu powiedzieć w paru zdaniach, czym jest GitHub Action i po chwili po prostu Wam pokazać, jak możecie szybko go użyć. Oczywiście jest tutaj wiele rzeczy do poprawy, zaciąganie tego kodu nie jest idealne, ponieważ zawsze je zaciągam z brancza master, tymczasem czasami moglibyśmy oczekiwać, żeby to było podane jako parametr albo żeby to było brane na przykład zawsze z brancza staging, no bo w końcu jest to deploy stagingu, więc tutaj oczywiście wiem, że parę rzeczy można sobie tutaj poprawić, ale nie o to chodzi w tym filmiku. Także to wszystko, co przygotowałem dla Was, jeżeli macie jakieś pytania, jeżeli macie jakieś pomysły, inspiracje do nakręcenia kolejnych materiałów związanych z GitHub Action, to oczywiście zachęcam do sekcji komentarzy. Tymczasem dziękuję bardzo za uwagę i pozdrawiam serdecznie.