Cvičení – nasdílení změny prostřednictvím kanálu

Dokončeno

V této lekci si procvičíte kompletní pracovní postup kódu tím, že nasdílíte malou změnu na web Space Game na GitHub.

Mara dostala úkol změnit nějaký text na domovské stránce webu Index.cshtml. V této lekci budete pokračovat.

Pojďme se krátce podívat na postup dokončení úkolu:

  • Synchronizujte místní úložiště s nejnovější větví main na GitHubu.
  • Vytvořte větev pro uložení změn.
  • Proveďte potřebné změny kódu a ověřte je místně.
  • Nasdílejte větev do GitHubu.
  • Sloučte všechny nedávné změny z větve main na GitHubu do místní pracovní větve a ověřte, že vaše změny stále fungují.
  • Nahrajte všechny zbývající změny, sledujte sestavení aplikace pomocí Azure Pipelines a odešlete váš pull request.

Načtení nejnovější hlavní větve

V předchozí lekci jste vytvořili žádost o přijetí změn a sloučili jste větev code-workflow do větve na GitHubu main . Teď potřebujete přijmout změny z větve main zpět do své místní větve.

Příkaz git pull načte nejnovější kód ze vzdáleného úložiště a sloučí ho do vašeho místního úložiště. Díky tomu víte, že pracujete s nejnovějším základem kódu.

  1. V terminálu spusťte git checkout main přepnutí do main větve:

    git checkout main
    
  2. Pokud chcete stáhnout nejnovější změny, spusťte tento git pull příkaz:

    git pull origin main
    

    Můžete zobrazit seznam změněných souborů. Jako volitelný krok můžete otevřít soubor azure-pipelines.yml a ověřit, že obsahuje úplnou konfiguraci sestavení.

    Vzpomeňte si, že úložiště Git, ve kterém členové týmu spolupracují (například na GitHubu), se nazývá vzdálené. Tady origin určuje vaše úložiště na GitHubu.

    Později načtete počáteční kód z úložiště Microsoft GitHub, označovaného jako upstream.

Sestavení a spuštění webové aplikace

Abyste měli jistotu, že máte funkční kopii pro spuštění změn, sestavte a spusťte webovou aplikaci místně.

  1. V editoru Visual Studio Code přejděte do okna terminálu a spuštěním následujícího dotnet build příkazu sestavte aplikaci:

    dotnet build --configuration Release
    
  2. Spuštěním následujícího dotnet run příkazu spusťte aplikaci:

    dotnet run --configuration Release --no-build --project Tailspin.SpaceGame.Web
    

    Návod

    Pokud se v prohlížeči zobrazí chyba související s ochranou osobních údajů nebo chybou certifikátu, pomocí kombinace kláves Ctrl+C v terminálu zastavte spuštěnou aplikaci.

    Po zobrazení výzvy spusťte dotnet dev-certs https --trust a vyberte Ano nebo další informace najdete v tomto blogovém příspěvku .

    Jakmile počítač důvěřuje vašemu místnímu certifikátu SSL, spusťte dotnet run příkaz podruhé a přejděte na http://localhost:5000 novou kartu prohlížeče, abyste viděli spuštěnou aplikaci.

Ověřte, že je aplikace spuštěná.

Ve vývojovém režimu je web Space Game nakonfigurovaný tak, aby běžel na portu 5000.

Na nové kartě prohlížeče přejděte k http://localhost:5000 zobrazení spuštěné aplikace.

Měli byste vidět toto:

Snímek obrazovky webu Space Game spuštěného ve webovém prohlížeči

Na stránce můžete vyzkoušet prvky, včetně tabulky výsledků. Když vyberete jméno hráče, zobrazí se podrobnosti o tomto hráči.

Až budete hotovi, vraťte se do okna terminálu a stisknutím ctrl+C zastavte spuštěnou aplikaci.

Vytvoření větve pro funkci

V této části vytvoříte větev Gitu, abyste mohli pracovat se soubory, aniž by to ovlivnilo ostatní uživatele. Ostatní dokonce ani nebudou vědět, že na těchto souborech pracujete, dokud jejich změny nenasdílíte do vzdáleného úložiště.

Pokud chcete vytvořit větev, použijte git checkout příkaz a pojmenujte větev stejně jako v předchozí části.

Při vytváření větve je vhodné dodržovat zásady vytváření názvů. Pokud je například větev určená pro práci na nové funkci, můžete použít formát feature/<branch-name>. Pro opravu chyby můžete použít formát bugfix/<bug-number>. V tomto příkladu bude feature/home-page-textnázev vaší větve .

V terminálu spusťte následující git checkout příkaz:

git checkout -B feature/home-page-text

Stejně jako předtím feature/home-page-text je založená na main větvi.

Provedení změn a jejich místní otestování

  1. V editoru Visual Studio Code otevřete index.cshtml v adresáři Tailspin.SpaceGame.Web/Views/Home .

  2. Vyhledejte tento text v horní části stránky:

    <p>An example site for learning</p>
    

    Návod

    Visual Studio Code také nabízí snadný způsob, jak hledat text v souborech. Pokud chcete získat přístup k podoknu hledání, vyberte ikonu lupy v bočním podokně.

  3. Nahraďte text v předchozím kroku následujícím textem s chybným typem a pak soubor uložte:

    <p>Welcome to the oficial Space Game site!</p>
    

    Všimněte si, že slovo "oficial" je záměrně nesprávně napsané. Tuto chybu vyřešíme později v tomto modulu.

  4. Spuštěním následujícího dotnet build příkazu v terminálu sestavte aplikaci:

    dotnet build --configuration Release
    
  5. Spuštěním následujícího dotnet run příkazu spusťte aplikaci:

    dotnet run --configuration Release --no-build --project Tailspin.SpaceGame.Web
    
  6. Na nové kartě prohlížeče přejděte na http://localhost:5000 spuštěnou aplikaci.

    Vidíte, že domovská stránka obsahuje aktualizovaný text.

    Snímek obrazovky webu Space Game s aktualizovaným textem Text obsahuje pravopisnou chybu.

    Až budete hotovi, vraťte se do okna terminálu a stisknutím kombinace kláves Ctrl+C zastavte spuštěnou aplikaci.

Potvrzení a nasdílení větve

Tady připravíte změny souboru Index.cshtml, potvrdíte změnu do větve a nasdílíte větev do GitHubu.

  1. Spusťte kontrolu a zkontrolujte git status , jestli ve vaší větvi nejsou nepotvrzené změny:

    git status
    

    Uvidíte, že index.cshtml byl změněn. Stejně jako předtím je dalším krokem ověření, že Git sleduje tento soubor, který se nazývá příprava souboru.

  2. Spusťte následující git add příkaz k přípravě Index.cshtml:

    git add Tailspin.SpaceGame.Web/Views/Home/Index.cshtml
    
  3. Spuštěním následujícího git commit příkazu potvrďte fázovaný soubor do feature/home-page-text větve:

    git commit -m "Improve the text at the top of the home page"
    
  4. Spuštěním tohoto git push příkazu nasdílejte nebo nahrajte větev do úložiště na GitHubu feature/home-page-text :

    git push origin feature/home-page-text
    
  5. Stejně jako předtím můžete svou větev vyhledat na GitHubu z rozevíracího seznamu větve.

    Snímek obrazovky GitHubu zobrazující novou větev

Sledujte, jak Azure Pipelines sestaví aplikaci

Azure Pipelines stejně jako dříve při nasdílení změn do GitHubu automaticky zařadí do fronty sestavení.

Jako volitelný krok sledujte sestavení, jak prochází kanálem, a ověřte, že sestavení proběhne úspěšně.

Synchronizace všech změn v hlavní větvi

Zatímco jste pracovali na funkci, mohly se změny ve vzdálené main větvi provést. Než vytvoříte žádost o přijetí změn, je běžné získat nejnovější verzi ze vzdálené main větve.

Uděláte to tak, že nejdřív přejdete na main větev nebo na tuto větev přepnete. Poté sloučíte vzdálenou větev main s místní větev main.

Pak se podívejte na větev funkce a pak větev funkcí sloučíte s větví main.

Pojďme si teď tento proces vyzkoušet.

  1. V terminálu spusťte tento git checkout příkaz a podívejte se na main větev:

    git checkout main
    
  2. Pokud chcete stáhnout nejnovější změny ve vzdálené main větvi a tyto změny sloučit do místní main větve, spusťte tento git pull příkaz:

    git pull origin main
    

    Vzhledem k tomu, že nikdo ve vaší větvi ve skutečnosti main neprodá žádné změny, následující příkaz vám řekne, že všechno už je aktuální.

    From https://github.com/username/mslearn-tailspin-spacegame-web
     * branch            main     -> FETCH_HEAD
    Already up to date.
    
  3. Pokud si chcete prohlédnout větev funkcí, spusťte git checkout:

    git checkout feature/home-page-text
    
  4. Sloučit větev funkce s main:

    git merge main
    

    Opět platí, že nikdo ve vaší větvi ve skutečnosti main neprodá žádné změny, vidíte, že všechno je stále aktuální.

    Already up to date.
    

    Pokud jste provedli začlenění jakýchkoli změn, měli byste aplikaci otestovat znovu, abyste měli jistotu, že všechno pořád funguje.

Opětovné nasdílení místní větve

Po začlenění změn ze vzdáleného úložiště do vaší místní větve funkce je třeba podruhé nasdílet vaši místní větev zpět do vzdáleného úložiště.

I když jste nezačlenili žádné změny ze vzdáleného úložiště, pojďme si tento proces vyzkoušet, abychom viděli, co se stane.

  1. Spuštěním tohoto git push příkazu nasdílejte změny do GitHubu:

    git push origin feature/home-page-text
    

    Odpověď opět říká, že už jste aktuální, protože nebyly provedeny žádné změny.

    Everything up-to-date
    

Odeslání žádosti o přijetí změn

V této části odešlete žádost o přijetí změn stejně jako dříve.

  1. V prohlížeči se přihlaste k GitHubu.

  2. Přejděte do svého úložiště mslearn-tailspin-spacegame-web .

  3. V rozevíracím seznamu vyberte svoji feature/home-page-text větev.

  4. Pokud chcete zahájit žádost o přijetí změn, vyberte Možnost Přispívat a pak Otevřít žádost o přijetí změn.

  5. Ujistěte se, že základní rozevírací seznam určuje vaše úložiště, nikoli úložiště Microsoftu.

    Snímek obrazovky GitHubu s potvrzením, že větev je možné sloučit

    Důležité

    Tento krok je opět důležitý, protože nemůžete sloučit změny do úložiště Microsoftu.

    Pokud pracujete přímo s vlastním úložištěm a nepoužíváte fork, vybere se vaše větev main automaticky.

  6. Zadejte název a popis žádosti o přijetí změn.

    • Název: Vylepšení textu v horní části domovské stránky
    • Popis: Dostal(a) nejnovější text domovské stránky od produktového týmu.
  7. Pokud chcete žádost o přijetí změn dokončit, vyberte Vytvořit žádost o přijetí změn.

    Tímto krokem se nesloučí žádný kód. Ostatním říká, že máte změny, které navrhujete ke sloučení.

    Zobrazí se okno žádosti o přijetí změn. Stejně jako předtím aktivuje žádost o přijetí změn Službu Azure Pipelines, která ve výchozím nastavení sestaví vaši aplikaci.

  8. Volitelně můžete vybrat odkaz Podrobnosti nebo přejít do svého projektu na Azure DevOps a sledovat spuštění pipeline.

  9. Po dokončení sestavení se vraťte k žádosti o přijetí změn na GitHubu.

  10. Vyberte Sloučit pull request a pak vyberte Potvrdit sloučení.

  11. Vyberte Odstranit větev, abyste odstranili větev z GitHubufeature/home-page-text.