VS Code: Pracujeme s Gitem

VS Code obsahuje povedený integrovaný modul pro správu zdrojových kódů – Git. Dnes si ukážeme, jak podporu pro Git nastavit. Nastavení si předvedeme s účty na GitHub a Visual Studio Team Services, které patří mezi nejpopulárnější a jsou zdarma.
Nálepky:
Poznámka: Cílem tohoto článku není seznámit čtenáře se základní koncepcí nástroje Git ani motivací pro verzovací systém zdrojových kódů. Pokud je pro vás Git úplně nové téma, využijte prosím možnost přihlásit se na workshop. Více info najdete na konci článku.
Co budeme potřebovat
- Nejnovější verzi VS Code
- Git pro váš operační systém
- Aktivní repozitář na GitHubu nebo Visual Studio Online
Připomínám základní rozdíl mezi online účtem zdarma na GitHubu a VSTS:
- repozitář na GitHubu je veřejně dostupný pro čtení.
- VSTS je soukromý repozitář.
Online repozitář
Pokud ještě nemáte repozitář nebo účet na VSTS, zde je jednoduchý průvodce.
Důležitá poznámka pro VSTS – Repozitář musí mít nastavený Git jako správce zdrojových kódů.
Přehledný popis založení repozitáře na GitHubu.
Je několik způsobů interakce s online Git repozitářem. Vybírám způsob, který se mi zdá nejjednodušší. Pro přístup k repozitářům budeme používat protokol https, tzn. pro naše účely nepotřebujeme žádné SSH klíče.
Ačkoli pro přístup k repozitářům můžeme použít uživatelské heslo, bezpečnější postup je použít tzv. personal access tokeny. Personal access token slouží jako alternativní heslo s omezeným přístupem k účtu.
Jak získat přistupový token na GitHubu
Po přihlášení do GitHub účtu klikneme pod profilovou ikonou na položku Settings.
V levém menu vybereme záložku Personal Access Tokens. Pomocí tlačítka Generate new token vygenerujeme nový token. Vybereme všechna oprávnění v sekci repo.
Token je potřeba si zkopírovat, jakmile okno prohlížeče zavřete, token již není možné zobrazit.
Jak získat přistupový token ve Visual Studio Online
Po přihlášení do Visual Studio Online klikneme na jméno přihlášeného uživatele a vybereme My Profile. Z výběru záložek vlevo vybereme Security. Hned první položka se jmenuje Personal Access Tokens. Pomocí tlačítka Add přidáme nový token. Platnost ponecháme dle libosti. Po vypršení platnosti bude potřeba si vygenerovat token nový.
Takto vypadá hodnota tokenu:45ff41f3c5f89b1b575d137159d12d7f3e3f44b2
Konfigurace Gitu
Nyní na svém systému spustíme příkazovou řádku, v případě Windows Git Bash.
Nakonfigurujeme Windows Credentials Store pro uložení git hesla:
git config --global credential.helper wincred
V Ubuntu můžeme využít gnome credential store:
git config --global credential.helper gnome-keyring
Pro Mac OSX použijeme příkaz:
git config --global credential.helper cache
Nastavení je možno zkontrolovat v globálním konfiguračním souboru gitu
cat ~/.gitconfig
Měli bychom vidět sekci:
[credential]
helper = wincred
Nyní trochu teorie, abychom pouze nekopírovali příkazy. K čemu slouží credential store?
Credential store bezpečně uloží naše přihlašovací údaje v zašifrované podobě. Přístup k nim má pouze přihlášený uživatel v aktivní relaci.
Díky tomu personal access tokeny nejsou viditelné v souborovém systému.
Uvedené credential store plní stejnou funkci pro odlišné operační systémy.
Pokud váš operační systém nemá k dispozici credential store, je možné nechat personal access token uložený ve filesystému jako plain text.
git config --global credential.helper store
Nyní si „naklonujeme“ repozitář. Znamená to že vytvoříme lokální kopiii repozitáře. V mém případě reprezentuje aws-scripting-guy
název účtu a vs_code_demo
název repozitáře.
Příkaz je možné po vytvoření nového repozitáře zkopírovat z okna.
ve VSTS:
git clone https://aws-scripting-guy.visualstudio.com/DefaultCollection/_git/vs_code_demo
pro GitHub:
git clone https://github.com/aws-scripting-guy/vs_code_demo.git
Přesuneme se do nově vytvořeného adresáře:
cd vs_code_demo
Přidáme první soubor do repozitáře, potvrdíme prvni commit a odeslání do online repozitáře:
echo "my first file in repo" > VSCodeGit.txt
git add VSCodeGit.txt
git commit -m "Moje první VSCode Git demo"
git push
Zadáme naše přihlašovací jméno a personal access token, který jsme si zkopírovali jako heslo.
První commit byl tímto učiněn a zároveň přihlašovací jméno a personal access token byly uloženy ve Windows Credentials Store.

Přihlašovací jméno a personal access token jsou bezpečně uloženy ve Windows Credentials Store
Tímto je nastavení Gitu pro fungování ve VS Code hotové. Každá další operace nad repozitářem již pracuje s automatickým ověřením pomocí nastaveného git credential store.
Práce s Gitem ve VS Code
V stále otevřené příkazové řádce můžeme spustit VS Code: code .
Opustíme příkazovou řádku a přejdeme do editoru VS Code.
V levém panelu otevřeme náš nově vytvořený soubor a přidáme do něj libovolný text, v mém případě:
my first commit from VS Code
Jakmile soubor uložíme, rozsvítí se nám ikona Gitu s novým počtem změn v repozitáři.
Klikneme na ikonu.
V sloupci CHANGES vidíme konkrétní soubory které se změnili. VS Code nám barevně zvýrazní provedené změny, takže můžeme soubory srovnávat se starší verzí.
Pokud jsme se změnou spokojeni, do pole Message napíšeme komentář k provedené změně a potvrdíme.
V tuto chvíli je změna zapsaná v lokálním repozitáři.
Z menu se znakem tří teček vybereme příkaz Sync.
Názvosloví
Uvádím zde vysvětlivky pro několik základních příkazů v prostředí git
:
git add
– přidá soubor/cestu ke sledování gitem
git commit
– akceptuje změny v souboru
git push
– odešle akceptované změny do vzdáleného repozitáře
git pull
– stáhne změny z vzdáleného repozitáře
git status
– zobrazí aktivní položky, akceptované změny, sledované soubory
git clone
– vytvoří lokální kopii ze vzdáleného repozitáře
Obsáhlá a dobře zpracovaná dokumentace:
https://git-scm.com/book/en/v2/Git-Basics-Getting-a-Git-Repository
Několik rad na závěr
Úspěšný zápis do repozitáře můžeme zkontrolovat pomocí možnosti Show Output v menu pod třemi tečkami.
Jelikož každý repozitář popisuje podsložka .git
, je nutné ve VS Code otevírat složky, nikoliv pouze jednotlivé soubory.
Složky můžeme ve Windows otevírat také pomocí kontextové nabídky „Open in Visual Studio Code“.
Pokud se nám stane že omylem něco commitneme, můžeme commit vrátit pomocí funkce Undo Last Commit.
Workshop
Pokud pro vás platí alespoň jeden z těchto bodů:
- Nejste (zatím) programátoři a Git je pro vás nové téma
- Chtěli byste se dozvědět, k čemu je užitečné používat správce zdrojových kódů jako je Git
- Ztrácíte se v názvosloví
- Zajímá vás, co vám může nabídnout nový editor VS Code
- Chcete slyšet naše zkušenosti z praxe, jak a proč to všechno používáme
- Máte další otázky
Přijďte na workshop „Visual Studio Code, Powershell a Git pro administrátory“, který organizujeme s kolegou Štěpánem 26 února.
Díky za článek. Stručný, ale to hlavní jest obsaženo. Žádná zbytečná omáčka kolem. Velmi užitečné.