Topolearn

Learn VS Code

Extensible code editor with built-in Git, terminal and debugger

14 lessons · 3 hours · 4 levels · covers VS Code 1.103

Visual Studio Code is a free, cross-platform code editor from Microsoft with IntelliSense, an integrated terminal, Git support and a debugger, extended by a huge marketplace of language and tool extensions. It is the most widely used editor among developers, and knowing it well removes a lot of daily friction.

Sign in free to track progressOfficial docs ↗

Before you start

VS Code builds on these; the tree links to the exact lessons you need.

GitEssentials level

How deep do you want to go?

1. EssentialsRead and write simple code, do the everyday basics4 lessons · 33 min in total
2. PracticalUse it productively at work, with the usual idioms8 lessons · 1 hour in total
3. AdvancedThe less common features, performance and trade-offs11 lessons · 2 hours in total
4. ExpertInternals and the edge cases experts know14 lessons · 3 hours in total

The VS Code tree

VS CodeThe interface and opening foldersThe interface andopening foldersCommand Palette and Quick OpenCommand Paletteand Quick OpenMulti-cursor editing and IntelliSenseMulti-cursor editingand IntelliSenseSearch and code navigationSearch and codenavigationGit in VS CodeGit in VS CodeThe integrated terminalThe integratedterminalUser and workspace settingsUser and workspacesettingsExtensions and recommendationsExtensions andrecommendationsStaging and committingStaging andcommittingInspecting changes: status and diffInspecting changes:status and diffSharing work: push and pullSharing work: pushand pull
Essentials and Practical shown (8 of 14 lessons); the full list is below. Click a lesson to read it.

All 14 lessons, in order

Getting around

  1. The interface and opening folders · Essentials · 7 min

    Open a project folder, and learn the activity bar, side bar, editor groups, panel and status bar.

  2. Command Palette and Quick Open · Essentials · 6 min

    Ctrl+Shift+P runs any command by name; Ctrl+P opens files by fuzzy name, and prefixes like @, : and > change what it searches.

Editing and navigation

  1. Multi-cursor editing and IntelliSense · Essentials · 10 min

    Edit several places at once with multiple cursors, move and copy lines, comment and format code, and use IntelliSense and quick fixes.

  2. Search and code navigation · Essentials · 10 min

    Search across files with regex and filters, and jump through code with go to definition, references, symbols and back navigation.

Git and the terminal

  1. Git in VS Code · Practical · 12 min

    Stage, commit, diff, branch, sync and resolve merge conflicts from the Source Control view, built on your Git knowledge.

  2. The integrated terminal · Practical · 8 min

    Run shells inside VS Code with Ctrl+`, split and name terminals, pick shell profiles and use shell integration features.

Settings and extensions

  1. User and workspace settings · Practical · 10 min

    Configure VS Code in the Settings UI or settings.json, at user or workspace level, with per-language overrides.

  2. Extensions and recommendations · Practical · 9 min

    Install language support, linters and tools from the Marketplace, manage them per workspace and recommend them to your team.

  3. Keybindings, snippets and profiles · Advanced · 12 min

    Rebind keys with when clauses in keybindings.json, write your own snippets with tab stops, and switch setups with profiles and Settings Sync.

Debugging and tasks

  1. Debugging with breakpoints and launch.json · Advanced · 15 min

    Start the debugger with F5, set breakpoints, logpoints and conditions, inspect variables, and configure launches in launch.json.

  2. Tasks and problem matchers · Advanced · 10 min

    Define build, test and lint commands in tasks.json, run them with shortcuts and turn their output into clickable problems.

Remote work and internals

  1. Remote development: SSH, containers, WSL · Expert · 15 min

    Run VS Code's backend on a server, in a container or in WSL while the UI stays local, and define reproducible dev environments with devcontainer.json.

  2. Architecture: extension host, LSP and DAP · Expert · 12 min

    VS Code runs extensions in a separate extension host process and talks to language servers and debuggers over open protocols.

  3. Writing your own extension · Expert · 15 min

    Scaffold an extension with yo code, contribute commands in package.json, use the vscode API in TypeScript and test it in the Extension Development Host.