VS Code Installation & Extensions

Install Visual Studio Code and essential extensions

15-20 minutes
Beginner
Cross-platform

Prerequisites

Before you begin:

  • • Administrator access to your system
  • • Internet connection for downloading VS Code
  • • At least 1GB of available disk space
  • • Windows 10+, macOS 10.15+, or Linux

Installation Steps

Windows Installation

Step 1: Download VS Code

  1. Visit the official VS Code website: code.visualstudio.com
  2. Click "Download for Windows"
  3. Choose the appropriate version (User Installer recommended)

Step 2: Install VS Code

  1. Run the downloaded installer as Administrator
  2. Accept the license agreement
  3. Choose installation location (default is fine)
  4. Select additional tasks (recommended: "Add to PATH", "Register Code as an editor")
  5. Complete the installation

Step 3: Verify Installation

code --version

You should see the VS Code version number.

macOS Installation

Method 1: Direct Download

  1. Visit code.visualstudio.com
  2. Click "Download for Mac"
  3. Open the downloaded .zip file
  4. Drag VS Code to your Applications folder
  5. Open VS Code from Applications

Method 2: Using Homebrew

# Install Homebrew first (if not installed)
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

# Install VS Code
brew install --cask visual-studio-code

Linux Installation (Ubuntu/Debian)

Method 1: Using Snap

sudo snap install code --classic

Method 2: Using Package Manager

# Add Microsoft GPG key
wget -qO- https://packages.microsoft.com/keys/microsoft.asc | gpg --dearmor > packages.microsoft.gpg

# Add VS Code repository
sudo install -o root -g root -m 644 packages.microsoft.gpg /etc/apt/trusted.gpg.d/
sudo sh -c 'echo "deb [arch=amd64,arm64,armhf signed-by=/etc/apt/trusted.gpg.d/packages.microsoft.gpg] https://packages.microsoft.com/repos/code stable main" > /etc/apt/sources.list.d/vscode.list'

# Install VS Code
sudo apt update
sudo apt install code

Essential Extensions

Why Extensions?

Extensions enhance VS Code's functionality with language support, themes, debugging tools, and more.

Language Support

  • Python - Microsoft Python extension
  • JavaScript/TypeScript - Built-in support
  • HTML/CSS - Built-in support
  • Java - Extension Pack for Java
  • C/C++ - C/C++ extension

Productivity Tools

  • GitLens - Enhanced Git capabilities
  • Auto Rename Tag - HTML tag renaming
  • Bracket Pair Colorizer - Color-coded brackets
  • Prettier - Code formatter
  • ESLint - JavaScript linting

Themes & Icons

  • Material Icon Theme - File icons
  • One Dark Pro - Dark theme
  • Dracula Official - Dark theme
  • GitHub Theme - Light/dark themes
  • Night Owl - Dark theme

Development Tools

  • Live Server - Local development server
  • Thunder Client - API testing
  • REST Client - HTTP requests
  • Docker - Docker integration
  • Remote Development - Remote coding

How to Install Extensions

Method 1: Using the Extensions Panel

  1. Open VS Code
  2. Click the Extensions icon in the sidebar (or press Ctrl+Shift+X)
  3. Search for the extension you want
  4. Click "Install"
  5. Restart VS Code if prompted

Method 2: Using Command Palette

  1. Press Ctrl+Shift+P (Cmd+Shift+P on Mac)
  2. Type "Extensions: Install Extensions"
  3. Search for the extension
  4. Click "Install"

Method 3: Using Terminal

# Install extension by ID
code --install-extension ms-python.python

# Install multiple extensions
code --install-extension ms-python.python --install-extension ms-vscode.vscode-typescript-next

Basic Configuration

Settings

Access settings via File > Preferences > Settings or Ctrl+,

// Recommended settings
"editor.fontSize": 14,
"editor.tabSize": 2,
"editor.insertSpaces": true,
"editor.wordWrap": "on",
"editor.minimap.enabled": false,
"workbench.colorTheme": "One Dark Pro"

Keyboard Shortcuts

General

  • Ctrl+P - Quick Open
  • Ctrl+Shift+P - Command Palette
  • Ctrl+, - Settings
  • Ctrl+Shift+X - Extensions

Editing

  • Ctrl+S - Save
  • Ctrl+Z - Undo
  • Ctrl+F - Find
  • Ctrl+H - Replace

Verification

Test Your Setup

# Check VS Code version
code --version

# Open VS Code from terminal
code .

# Check installed extensions
code --list-extensions

If you can open VS Code and see the version number, your installation is successful!

Common Issues & Solutions

'code' command not found

If you can't use the 'code' command from terminal:

  • Open VS Code
  • Press Ctrl+Shift+P (Cmd+Shift+P on Mac)
  • Type "Shell Command: Install 'code' command in PATH"
  • Select the command and run it

Extensions not loading

If extensions aren't working properly:

  • Restart VS Code
  • Check if the extension is enabled
  • Try disabling and re-enabling the extension
  • Check the Extensions panel for error messages

Next Steps

What to do next:

  • • Explore VS Code's integrated terminal
  • • Learn about debugging with VS Code
  • • Set up Git integration
  • • Customize your workspace settings