17. diel - Git - GitHub Desktop
V minulej lekcii, Git - Grafické používateľské rozhranie Git GUI - Dokončenie, sme dokončili predstavenie grafického používateľského rozhrania Git GUI. Ukázali sme si, ako v ňom zobraziť históriu repositára, vytvoriť tag a ako nahrať náš repositár na vzdialený repositár uložený na GitHube.
V dnešnom Git tutoriále si ukážeme novú aplikáciu GitHub desktop. Táto aplikácia nám umožňuje pracovať s naším kódom pomocou príjemného GUI bez nutnosti pamätania si príkazov a používania príkazového riadka.
Dnešné lekcie počíta s predošlou znalosťou systému Git z minulých tutoriálov. Základy si veľmi stručne popíšeme, hlavné zameranie lekcie je však na práci s grafickým rozhraním.
GitHub Desktop
Najprv si GitHub Desktop nainštalujeme. Potom sa vrhneme na jeho používanie.
V tejto lekcii budeme pracovať s GitHub Desktop pre operačný systém Windows.
Inštalácia a konfigurácia
Z oficiálnych stránok GitHub desktop stiahneme verziu pre operačný systém Windows kliknutím na Download for Windows (64bit):

Inštaláciu spustíme kliknutím na stiahnutý .exe
súbor.
Otvorí sa nasledujúce okno inštalačného procesu:

Počkáme kým sa nezavrie a zobrazí sa nám okno Welcome to GitHub Desktop. Tu sa kliknutím na Sign in to GitHub.com prihlásime do svojho GitHub účtu:

Pokiaľ ešte nemáme vytvorený GitHub účet, vytvoríme ho kliknutím na Create your free account.
Budeme presmerovaní do webového prehliadača, kde nás GitHub bude žiadať o povolenie prepojiť GitHub Dekstop s naším účtom na GitHub:

GitHub účet sme si vytvorili v lekcii Git - Vzdialený repositár - Tvorba a nastavenie repositára
Kliknite na Authorize Desktop. Budeme presmerovaní na stránku povolenie požiadaviek. Prehliadač sa nás spýta, či môže otvoriť aplikáciu GitHub Desktop:

Klikneme na Open GitHubDesktop.exe. Po úspešnom prihlásení sa nám zobrazí okno Configure Git, kde vyplníme svoje meno a email:

Všetko potvrdíme kliknutím na Finish. Zobrazí sa nám úvodná stránka GitHub Desktop:

Otvorenie repositára
Budeme pracovať s naším repositárom mygit
, ktorý sme si
vytvorili v lekcii Git -
Základy.
Pre otvorenie lokálneho repositára mygit
klikneme na
File v hornej lište a zvolíme možnosť Add local
repository:

Alternatívne by sme mohli repositár pridať pretiahnutím jeho umiestnenia do poľa pre súbory:

V zobrazenom dialógovom okne pre vybranie cesty k repositárovi. Zadáme
požadovanú cestu k repositárovi mygit
a potvrdíme Add
repository:

Po potvrdení sa nám otvorí okno s repositárom:

V záložke Current repository vidíme názov
repositára mygit
, ktorý máme momentálne otvorený. V
sekcii Current branch vidíme názov aktuálnej vetvy
main
, v ktorej sa nachádzame:

Editácia dát a vytvorenie commitu
Najprv vykonáme zmenu v dátach v repositári, aby sme si následne mohli ukázať vytvorenie commitu.
Editácia dát
Zmenu v dátach vykonáme v súbore file.md
. Otvoríme si ho v
editore a prepíšeme jeho obsah na New text
. GitHub Desktop
automaticky detekuje vykonané zmeny v repositári a následne sa
aktualizuje:

Alternatívne by sme zmenu v dátach súboru
file.md
mohli vykonať v termináli MinTTY
príkazom
echo "New text" > file.md
.
Vytvorenie commitu
Teraz vytvoríme commit. V ľavom dolnom rohu sa nachádza pole na vytvorenie
commitu. Commit pomenujeme Editing the file.md file
, do správy
pridáme File editing, text transcription
a všetko potvrdíme
tlačidlom Commit to Main:

Novo vytvorený commit vidíme v ľavom dolnom poli:

Commit máme vytvorený 😀 Poďme zmeny poslať na GitHub.
Odoslanie zmien na GitHub
Zmeny odošleme do nášho vzdialeného repositára na GitHube kliknutím na tlačidlo Publish branch:

Teraz si odoslanie do vzdialeného repositára skontrolujeme. V hornej ponuke vyberieme Repository > View on GitHub:

Otvorí sa náš repositár mygit
:

Vidíme, že náš commit Editing the file.md file
do
repositára dorazil 😀
Správa vetiev
Teraz sa pozrieme na postup vytvorenia, premenovania, zlúčenia a nahrania vetvy do vzdialeného repositára.
Vytvorenie vetvy
Kliknutím na Current branch otvoríme zoznam všetkých vetiev. Novú vetvu vytvoríme kliknutím na New branch:

V novo otvorenom okne novú vetvu pomenujeme test
a klikneme na
Create branch:

Po vytvorení vetvy GitHub Desktop automaticky prepne náš pracovný priestor do novo vytvorenej vetvy:

Nahranie vetvy
Aby sme mohli vetvu test
odoslať do vzdialeného repozitára
mygit
, je potrebné vykonať zmeny dát v súbore. Upravme teda
súbor test_file.txt
, ktorému dopíšme nasledujúce čísla:
123456789 987654321 000000000
Alternatívne by sme to mohli vykonať nasledujúcimi príkazmi v termináli
MinTTY
:
git checkout feature echo "123456789" >> test_file.txt echo "987654321" >> test_file.txt echo "000000000" >> test_file.txt
Teraz vytvoríme commit s názvom Adding numbers
a správou
Adding numbers to the test file
:

Teraz už len nahráme vetvu na vzdialený repositár. Klikneme na Publish branch a tým commit odošleme.
Premenovanie vetvy
Premenovanie vetvy si ukážeme na vetve test
, ktorú
premenujeme na feature
. V hornej ponuke zvolíme Branch
> Rename:

V novo otvorenom okne Rename branch zadáme nový názov
feature
a klikneme na Rename test:

Prepínanie vetiev
Poďme si ukázať prepínanie vetiev. Najprv klikneme na Current
branch, čím sa otvorí okno so zoznamom všetkých vetiev. Prepnutie sa
realizuje kliknutím na názov vetvy. Klikneme teda na vetvu
main
:

Zlúčenie vetiev
Postup zlúčenia vetví si ukážeme na zlúčenie vetvy
feature
do vetvy main
. Klikneme na Current
branch a zvolíme možnosť Choose a branch to merge into
main:

Zo zobrazených vetiev vyberieme vetvu, ktorú chceme zlúčiť s vetvou
main
, teda vetvu feature
. Následne klikneme na
šípku vedľa tlačidla Create merge commit:

Otvorí sa nám ponuka, kde máme možnosť vybrať medzi tromi spôsobmi zlúčenia:
- Create a merge commit – Zlúči vetvy a pridá commity z vetvy
feature
do vetvymain
. - Squash and merge – Zlúči commity na vetve
feature
do jedného commitu a zlúči ho s vetvoumain
. - Rebase – Commity z vetvy
feature
prepíše do vetvymain
.
Zvolíme Create a merge commit a zlúčenie potvrdíme kliknutím na Create a merge commit:

Prebehne vlastné zlúčenie vetiev a GitHub Desktop nás vráti späť do hlavnej ponuky, kde uvidíme informáciu o úspešnom zlúčení:

Upravenú vetvu main
nahráme na GitHub kliknutím na
Publish branch:

Skúmanie histórie
Nakoniec si ukážeme správu histórie. Prejdime teda do správy histórie kliknutím na History:

Zobrazí sa história repositára, v ktorej sú zobrazené
jednotlivé commity. Kliknite na commit s názvom
Editing the file.md file
, aby sme si zobrazili jeho detail:

V pravom okne je zobrazené, čo bolo pridané (zeleno) a čo bolo zo súboru odobraté (červeno). Tu tiež vidíme, ktoré súbory sú ovplyvnené daným commitom. Nad výpisom commitu vidíme jeho identifikačné údaje, ako hash, názov a správu:

Pri commite s názvom Added new file, file.md
vidíme tag označený ako Before_merge
.
V budúcej lekcii, Git - Nahranie repositára na GitLab, sa naučíme založiť vzdialený GitLab repozitár a verzovať svoje projekty pomocou základných Git operácií, ktoré nám ponúka IntelliJ IDEA.