Lekce 1 - Visual Studio Code - Úvod do editoru zdrojového kódu
Vítejte všichni programátoři v online kurzu editoru zdrojového kódu Visual Studio Code.
V dnešním Visual Studio Code tutoriálu si představíme tento editor zdrojového kódu. Nainstalujeme si ho včetně .NET SDK a rozšíření pro konkrétní jazyk.
Představení Visual Studio Code (VS Code)
Visual Studio Code je editor zdrojového kódu vyvíjený společností Microsoft. Editor běží na Windows, MacOS i Linuxu. Má integrovanou podporu pro JavaScript, TypeScript a Node.js. Nabízí rozmanité množství rozšíření, která jsou zdarma pro další jazyky a modely runtime, jako jsou C#, C++, Java, PHP, .NET nebo Python.
Verze a aktualizace VS Code
VS Code nemá přímo definovanou verzi ve smyslu číselného označení. Místo toho je vyvíjen jako trvalý projekt s pravidelnými aktualizacemi, které vycházejí většinou každé tři až čtyři týdny. Pokud už máme VS Code nainstalovaný, budeme dostávat aktualizace automaticky.
Je nutné mít povolené automatické aktualizace.
Cena a licence VS Code
Visual Studio Code je zdarma dostupný k použití a lze ho stáhnout přímo z oficiálních stránek společnosti Microsoftu. VS Code je poskytován pod licencí MIT, což znamená, že máme právo používat, kopírovat, modifikovat a distribuovat tento software bez omezení.
Některá rozšíření ve VS Code mohou mít odlišné licence, a proto bychom měli vždy kontrolovat licence používaných rozšíření.
Výhody používání VS Code
VS Code má hned několik skvělých vlastností a funkcí, které nám pomohou s psaním kódu. VS Code nám umožňuje snadnou orientaci v projektu, a to jak mezi soubory, tak mezi různými částmi kódu. Dále díky němu můžeme provádět operace na úrovni projektu. VS Code také nabízí pokročilé funkce pro úpravu kódu, jako je zvýraznění syntaxe, automatické doplňování kódu, formátování a rychlé opravy chyb.
VS Code má integrovanou podporu pro verzovací systémy, jako je Git, kde můžeme sledovat změny ve svém kódu, spravovat větve nebo se propojovat s GitHubem. Velikou výhodou je také ladicí nástroj, díky kterému můžeme sledovat hodnoty proměnných, vyhledávat chyby a ladit kód krok za krokem. Poslední velkou výhodou je rozmanitost rozšíření, která nám umožňují přizpůsobit si editor a přidat si podporu pro programovací jazyky, frameworky, balíčky a nástroje.
Rozšíření VS Code
Rozšíření ve VS Code jsou velice podstatná pro usnadnění a plnou podporu určitých programovacích jazyků. Proto si zmíníme několik nejpopulárnějších rozšíření.
Rozšíření pro jazyky
Bez tohoto rozšíření bychom nemohli využívat programovací jazyky, jako je C#, Java, PHP a mnoho dalších jazyků. Instalace těchto rozšíření nám umožní přístup k funkcím, jako je automatické doplňování kódu, statická analýza či ladění.
Rozšíření Prettier
Rozšíření Prettier je dalším užitečným rozšířením, které nám automaticky upravuje kód podle konfigurace a stanovených pravidel. Kód je díky tomu přehlednější a udržuje si stejný styl.
Rozšíření GitLens
Pokud se rozhodneme propojit se s Gitem, rozšíření GitLens bude pro nás rozhodně užitečné. Obsahuje pokročilé informace o verzování, jako je například historie změn kódu včetně zobrazení větvení.
Rozšíření Visual studio IntelliCode
Přidává podporu pro umělou inteligenci, která pomáhá doplňovat kód a nabízí návrhy na základě napsaného kódu.
Rozšíření Live Server
Rozšíření Live Server umožňuje spouštět lokální webový server pro okamžité zobrazení a aktualizaci webových stránek při úpravě kódu. Zmíněná i další užitečná rozšíření si v dalších lekcích ještě více rozebereme a vyzkoušíme si je v praxi.
Stažení a instalace VS Code
Nyní si ukážeme, jak správně stáhneme a nainstalujeme VS Code z oficiálních stránek.
Stažení VS Code
Visual Studio Code stáhneme z oficiálních stránek Visual Studia Code pro odpovídající operační systém:
Instalace VS Code
Po stažení se dostaneme k instalaci. Otevřeme staženou instalační aplikaci a následně:
- Zvolíme angličtinu.
- Potvrdíme podmínky.
- Potvrdíme nebo zvolíme cestu instalace.
- Potvrdíme nebo zvolíme složku pro zástupce programu.
- Zvolíme, aby podporované soubory měly VS Code jako výchozí aplikaci pro spuštění.
Dále už jen klikneme na tlačítko Install. Po úspěšné instalaci klikneme na tlačítko Finish a rovnou si také VS Code spustíme. Pokud jsme udělali všechno správně, ukáže se nám úvodní okno VS Code:
Nastavení VS Code pro .NET a instalace jazyka
Nyní, když máme VS Code nainstalovaný, si ještě stáhneme a nainstalujeme .NET SDK, s nímž budeme pracovat dále. Také si ukážeme, jak nainstalovat rozšíření do VS Code pro nějaký programovací jazyk.
Instalace rozšíření programovacího jazyka
Pro instalaci rozšíření si otevřeme VS Code a klikneme na Extensions.
Do nabídky se dostaneme také klávesovou zkratkou Ctrl + Shift + X.
Poté si vyhledáme oficiální rozšíření námi požadovaného jazyka. To si ukážeme na jazyce C# od společnosti Microsoft a klikneme na tlačítko Install:
Po dokončení instalace se můžeme vrhnout na samotnou instalaci .NET SDK 😀
Instalace .NET SDK
Stáhneme si a nainstalujeme nejnovější verzi .NET SDK pro odpovídající operační systém z oficiálních stránek Microsoftu:
Pokud máme na počítači více uživatelů, je nutné si zkontrolovat, zda máme otevřený správný účet jak v příkazovém řádku, tak i v editoru
Po dokončení instalace si otevřeme příkazový řádek.
V něm zadáme příkaz dotnet --version:
Příkazem jsme si ověřili úspěšnou instalaci.
Možnosti instalací .NET SDK
Nyní se můžeme podívat, jaké všechny projekty můžeme vytvořit
pomocí .NET SDK. Do příkazového řádku zadáme příkaz
dotnet new list. Následně se nám zobrazí seznam projektů,
které můžeme vytvořit:
My si pro správné fungování VS Code a .NET vytvoříme novou konzoli pro VS Code.
Vytvoření konzole pro VS Code
Potřebujeme vytvořit konzoli pro VS Code. V příkazovém řádku zadáme
příkaz dotnet new console -n NewVScodeConsole:
Za parametrem -n jsme určili název naší konzole
NewVScodeConsole.
Použití konzole ve VS Code
Nyní se můžeme přesunout zpátky do VS Code. V menu vybereme Terminal => New Terminal:
Nový terminál můžeme otevřít také pomocí klávesové zkratky Ctrl + Shift + ;.
Po otevření terminálu se přesuneme do naší konzole pomocí příkazu
cd NewVScodeConsole. Následně zadáme příkaz
dotnet run. Zobrazí se nám Hello World:
To by bylo pro dnešní lekci vše.
V příští lekci, Visual Studio Code - První projekt a představení prostředí, si ukážeme, jak založit první projekt, a představíme si prostředí Visual Studio Code.
