Developer Essentials

Setting Up VS Code for Development

A powerful editor, tailored to your workflow.

Visual Studio Code is the most popular code editor among developers. It's free, lightweight (under 200 MB), and runs on Windows, macOS, and Linux. With thousands of extensions and built-in Git support, it's the perfect starting point for any developer.

Download & Install

VS Code is available for all major platforms. Pick yours and get started in minutes.

Windows

Download the .exe installer. Supports Windows 10/11. Auto-updates enabled by default.

macOS

Download the .dmg file or install via Homebrew with `brew install --cask visual-studio-code`.

Linux

Available as .deb, .rpm, or Snap package. Supports Ubuntu, Fedora, Debian, and more.

Go to download page

Setup in 5 steps

From download to productive coding environment:

1

Download & install

Go to code.visualstudio.com and download VS Code for your OS. Installation takes less than a minute.

2

Install essential extensions

Open the Extensions panel (Ctrl+Shift+X) and install language support, linters, and formatters for your stack.

3

Configure settings

Open Settings (Ctrl+,) and customize font size, theme, tab size, auto-save, and formatting preferences.

4

Set up Git integration

VS Code has built-in Git support. Open a folder with a Git repo and you can stage, commit, and push directly from the editor.

5

Enable Settings Sync

Sign in with GitHub or Microsoft account to sync your settings, extensions, and keybindings across all your devices.

Understanding the interface

Get to know the key areas of the VS Code window:

Activity Bar

The vertical bar on the far left. Switch between Explorer, Search, Source Control, Extensions, and more.

Side Bar

Shows the content of the selected view — file tree, search results, or Git changes.

Editor Area

The main area where you edit files. Supports split views, tabs, and side-by-side diff.

Integrated Terminal

Open a terminal inside VS Code (Ctrl+`). Run commands without leaving the editor.

Status Bar

Bottom bar showing branch name, errors/warnings, language mode, and encoding.

Command Palette

Access any command with Ctrl+Shift+P. The single most powerful feature of VS Code.

Must-have extensions

The extensions every developer should install first:

Code Quality

ESLint

Catch JavaScript/TypeScript errors and enforce code style in real time.

Prettier

Auto-format your code on save. Supports JS, TS, CSS, HTML, JSON, and more.

Productivity

GitLens

See who changed each line, explore Git history, and compare branches visually.

Live Server

Launch a local dev server with live reload for static HTML/CSS/JS files.

Path Intellisense

Autocomplete file paths as you type import statements.

AI & Assistance

GitHub Copilot

AI-powered code suggestions as you type. Free tier available.

Error Lens

Highlight errors and warnings inline, right next to the problematic code.

Appearance

One Dark Pro

Popular dark theme inspired by Atom's iconic color scheme.

Material Icon Theme

Distinctive file and folder icons for better visual navigation.

Keyboard shortcuts to master

These shortcuts will dramatically speed up your workflow:

  • Ctrl + Shift + POpen Command Palette — access any command
  • Ctrl + PQuick Open — jump to any file by name
  • Ctrl + `Toggle integrated terminal
  • Ctrl + BToggle sidebar visibility
  • Ctrl + DSelect next occurrence of current word
  • Alt + Up/DownMove current line up or down
  • Ctrl + Shift + KDelete entire line
  • Ctrl + /Toggle line comment
  • Ctrl + Shift + FSearch across all files in project
  • F12Go to definition of a symbol

On macOS, replace Ctrl with Cmd.

Essential configuration

Recommended settings to add to your settings.json:

settings.json
{
  "editor.fontSize": 14,
  "editor.tabSize": 2,
  "editor.formatOnSave": true,
  "editor.minimap.enabled": false,
  "editor.wordWrap": "on",
  "editor.bracketPairColorization.enabled": true,
  "files.autoSave": "afterDelay",
  "files.autoSaveDelay": 1000,
  "terminal.integrated.fontSize": 13,
  "workbench.colorTheme": "One Dark Pro"
}

Open settings.json via Command Palette: type 'Preferences: Open User Settings (JSON)'.

Pro tips

Level up your VS Code experience:

  • 1Use multi-cursor editing (Ctrl+Alt+Up/Down) to edit multiple lines at once.
  • 2Install the 'Settings Sync' feature to keep your setup consistent across machines.
  • 3Use workspace settings (.vscode/settings.json) for project-specific configuration.
  • 4Pin frequently used tabs so they don't get lost in a sea of open files.
  • 5Use Ctrl+Shift+E to quickly focus the file explorer from anywhere.
  • 6Try Zen Mode (Ctrl+K Z) for distraction-free coding sessions.

Frequently asked questions

Is VS Code really free?

Yes. VS Code is completely free and open-source, developed by Microsoft. No license required.

How big is VS Code?

The download is under 200 MB, and the total disk footprint is less than 500 MB.

Can I use VS Code for any programming language?

Yes. VS Code supports virtually every language through extensions — Python, Java, C++, Go, Rust, Ruby, PHP, and many more.

Does VS Code have built-in Git support?

Yes. VS Code includes Git integration out of the box. You can stage, commit, push, pull, and view diffs without any extensions.

How do I update VS Code?

VS Code auto-updates by default. You can also manually check via Help > Check for Updates (Windows/Linux) or Code > Check for Updates (macOS).

Back to Developer Essentials