Getting Started
🚀 Getting Started
📥 Installing VS Code
VS Code is downloaded from code.visualstudio.com, with installers for Windows, macOS, and Linux. It's free, and its core (the "Code - OSS" project) is open source under the MIT license — the official Microsoft-branded download adds a few proprietary extras (like telemetry and the Marketplace connection) on top of that open core.
On most systems, a package manager is faster than the website:
These are two entirely different products that happen to share a name and a publisher. Visual Studio is Microsoft's large, long-standing full IDE, historically centered on C#/.NET and C++, Windows-only until relatively recently. VS Code is a lightweight, cross-platform, extension-driven code editor, language-agnostic by design. If a tutorial says "open Visual Studio" and you open VS Code (or vice versa), nothing will make sense — always double-check which one is actually meant.
🎬 First Launch — What You'll See
On first launch, VS Code opens to a Welcome tab — recent-file shortcuts, a "Open Folder" button, and links to customize your theme and install extensions. This is a normal editor tab, not a separate wizard — you can close it like any other tab, and reopen it later from Help → Welcome if you want it back.
🗺️ The UI Tour
Five regions make up almost everything you'll interact with:
Activity Bar
The far-left strip of icons — Explorer, Search, Source Control, Run & Debug, Extensions. Clicking one changes what the Side Bar shows.
Side Bar
The panel next to the Activity Bar — its content is context-sensitive, following whichever Activity Bar icon is selected.
Editor Groups
The main area where files are actually open — can be split into multiple groups, side by side or stacked.
Panel
The bottom area — Terminal, Output, Debug Console, and Problems all live here as tabs.
Status Bar
The thin strip along the very bottom — git branch, language mode, line/column position, and error/warning counts.
The Explorer (the first Activity Bar icon, usually selected by default) shows your currently open folder's file tree in the Side Bar — this is the view you'll spend the most time in. The Source Control icon shows a small badge with a number whenever there are uncommitted git changes, a useful at-a-glance signal even before opening it (Chapter 7 covers this in depth).
📂 Opening a Folder vs. a File
VS Code is built around projects, not individual files. File → Open Folder (not just "Open File") is the normal way to start working — once a folder is open, the Explorer shows its full tree, search (Chapter 3) covers every file in it, and git integration (Chapter 7) picks up its repository automatically. Opening a single loose file works too, but you lose all of that project-wide context.
Where VS Code Sits: Plain Editor vs. Full IDE
| Type | Examples | Characteristic |
|---|---|---|
| Plain text editor | Notepad, gedit | Opens files, edits text — no project awareness, no language intelligence |
| VS Code | — | Project-aware, with language intelligence (autocomplete, error-checking, debugging) added through extensions rather than built in for every language at once |
| Full IDE | Visual Studio, a JetBrains IDE (IntelliJ, PyCharm...) | Deep, language-specific tooling built directly into the product, heavier to install and run |
This "extension-driven middle ground" is VS Code's whole identity — a fast, general-purpose core, made as deep as any single project needs through the extensions covered in Chapter 4.
💻 Coding Challenges
Exercise 1: Install & Identify
Install VS Code, launch it, and open any folder on your machine via File → Open Folder. Identify all five UI regions from this chapter (Activity Bar, Side Bar, Editor Groups, Panel, Status Bar) and note one specific thing you see in each.
Exercise 2: Split the Editor
Open two different files from your folder side by side in two Editor Groups, then open and close the integrated terminal (Panel) at least once.
Exercise 3: Status Bar Investigation
With a file open, click its language-mode indicator in the Status Bar and note what options appear. Then click the line/column indicator and use it to jump to a specific line number.
🎯 What's Next
Next chapter: The Command Palette & Quick Open — Ctrl+Shift+P, Ctrl+P, and keyboard-first navigation.