Knowing where everything lives makes the rest of VS Code discoverable instead of overwhelming.
VS Code works best when you open a folder (your project root), not single files: File > Open Folder, or from a terminal code . (on macOS, install the code command via the Command Palette: "Shell Command: Install 'code' command in PATH"). The folder becomes your workspace, and search, Git, tasks and settings apply to it.
The window has five areas:
- The activity bar on the far left switches views: Explorer (
Ctrl+Shift+E), Search, Source Control (Ctrl+Shift+G), Run and Debug, Extensions (Ctrl+Shift+X). - The side bar shows the selected view, such as the file tree.
Ctrl+Btoggles it. - The editor area holds tabs and can be split into editor groups side by side with
Ctrl+\. - The panel at the bottom holds the Terminal, Problems, Output and Debug Console.
Ctrl+Jtoggles it. - The status bar shows the Git branch, errors and warnings, line/column, indentation, encoding and the language mode; each item is clickable.
Shortcuts here use Windows/Linux keys; on macOS use Cmd for Ctrl in most of them.
Single-clicking a file opens it in preview mode (italic tab title) that gets replaced by the next file you click; double-click or start editing to keep it open. Ctrl+Tab cycles open editors.
Example
# from a terminal
code . # open the current folder as a workspace
code -g src/app.ts:42 # open a file at line 42 (--goto)
code --diff old.json new.json # side-by-side diff
code --new-window ~/notes
# inside VS Code
# Ctrl+B toggle side bar Ctrl+J toggle panel
# Ctrl+\ split editor Ctrl+Tab cycle open editors
# Ctrl+Shift+E Explorer Ctrl+Shift+X ExtensionsRemember
- Open folders (code .), not loose files
- Activity bar picks the side bar view; Ctrl+B and Ctrl+J toggle side bar and panel
- Italic tab = preview; double-click to keep it open
Watch out for
- Opening a parent directory with many projects; Git, search and settings then target the wrong root.