Visual Studio Code

  • Intro
  • Installing VS Code

Information

Last updated January 29, 2025
Software versions

Responsible

Faculty

Visual Studio Code 0/1

Visual Studio Code

One of the most common code editing enviornment that supports multiple languages and plugins

Writing code can be sometimes difficult to read and manage uding plain text editors. Visual Studio Code (shortened as VS Code) provides a solution to help make code syntax more legible and organize files in folders to switch between files seamlessly. In programming, this is a very useful tool for managing your code, sharing, and debugging it. VS Code also allows for adding virtual environments to allow for multiple version of a programming language which is sometimes necessary for using dated libraries. 

VS Code will be used in writing and testing code using HTML HTML (HyperText Markup Language) is the standard language used to create and design web pages by structuring content and defining elements like text, images, and links. and CSS CSS (Cascading Style Sheets) is a stylesheet language used to describe the presentation and design of a document written in HTML or XML, including layout, colors, and fonts. for online digital portfolios. It can also be used as a code enviornment for writing and executing Python Python is a high-level, general-purpose programming language known for its readability and simplicity, making it ideal for both beginners and experienced developers. code. VS Code can also create and execute Jupyter notebooks, see Jupyter Notebook explanation here.

Visual Studio Code 1/1

Installing VS Code

Download the latest version from their website: https://code.visualstudio.com/download. Follow the run the installer and follow the installation instructions. 

Startup interface
Startup interface

Once successfully installed, you will see this screen as the user interface (as of early 2025). 

Recommended Extensions

To make use of the capabilities of VS Code, some extensions are recommended for different type of projects. We will mention a few useful ones to add. 

On the left, click on the bottom icon for “extensions”

Extensions tab
Extensions tab

Recommended Extensions

view popular extensions
view popular extensions

Click on the filter icon and select “Most Popular” to view the most relevant extensions.

Python Extension
Python Extension

Python is one of the most common programming language in computational design. Install it on VS Code.  This extension only adds Python support to the editor in VS Code. You still need to have a python environment installed on your computer separately. 

Prettier code formatter
Prettier code formatter

To make code more legible, Prettier is a popular extension for formatting HTML and CSS files. This is a nice addition to have if you are working on web development or creating a website portfolio for your projects. 

Useful links

Additional tips to get started with VS Code: https://code.visualstudio.com/docs/getstarted/getting-started