All Articles

Visual Studio Code Setup

Theme

Visual Studio Code Example Syntax

Font

This font has programming ligatures which are multiple characters joined together. The screenshot below shows a combined arrow (=>) character and triple equal (===).

FiraCode Retina Example

Extensions

  • Active File In StatusBar

    A very simple extension which displays the full path of the file that is currently being viewed

  • Auto Close Tag

    Automatically adds the closing tag for any HTML/XML tag

  • Auto Rename Tag

    Automatically renames both opening/closing tags when you rename either of them

  • Bracket Pair Colorizer

    Highlights matching (), {}, [] to make them to easily identifiable

  • Color Highlight

    Highlights web colors in hexidecimal with the color that the code refers to.

  • ESLint

    Integrates ESLint with VS Code based on your local the ESlint configuration

  • GitLens

    Powerful and feature rich Git integration. Some features include code authorship, gutter heatmaps for recently changed files, and a sidebar that has full support of all Git commands

  • Go

    Go support which provides intellisense, code navigation, linting, testing, and much more.

  • Import Cost

    Displays package size inline when it is imported.

  • Live Share

    Edit and debug your projects collaboratively in real-time.

  • Markdown Preview Enhanced

    Preview markdown files to see how they will render

  • Material Icon Theme

    Icon set for files in the file tree

  • Output Colorizer

    Syntax highlighting for output logs

  • Polacode

    Generate screenshots of code by copy and pasting it

  • Rails

    Ruby on Rails integration which preovides snippets, syntax highlighting, click navigation, and much more.

  • Rails Run Specs

    Easily run spec files with a keyboard shortcut

  • Ruby

    Ruby language support which provides formatting, debugging, intellisense, linters, and much more.

  • Settings Sync

    Synchronize all themes, settings, keybindings, etc. across multiple computers

  • Toggle Quotes

    Toggle between the various types of quotes ”, "", ` with a keyboard shortcut

  • vscode-spotify

    Integrates Spotify inside of VS Code. See what song is playing, contorl playback, view albums, and much more.

  • XML Tools

    XML formatting