Exercise - Use Visual Studio Code for the Web

Completed

Before you can start coding on-the-go, you need to familiarize yourself with Visual Studio Code for the Web for the first time.

In this exercise, you'll explore the VS Code for the Web interface and practice installing an extension.

First, you'll explore the interface of VS Code for the Web.

  1. In a browser, navigate to https://vscode.dev

  2. The experience in the browser looks similar to that of VS Code Desktop. For example, you have the editor area, the command palette, and several views, like Source Control Explorer and Extensions, on the sidebar. This interface provides a consistent experience when working in the browser.

    Screenshot of the vscode.dev landing page.

Install an extension

Now, you can customize VS Code for the Web by installing an extension.

  1. On the sidebar, click the Extensions view.

    Screenshot of the extension view icon in the activity bar of VS Code.

  2. From here, you can see what extensions are already installed, and browse other extensions.

  3. Try installing the GitHub Theme extension by searching for "github theme"

  4. Select the GitHub Theme extension, and click "Install."

    Screenshot of the GitHub Theme extension in VS Code, highlighting the search box and the Install button.

  5. Notice how quickly the extension is installed, all within your browser!

Great work! You've completed your initial navigation of VS Code for the Web. While this may be the first time you've ever browsed to https://vscode.dev, it should look familiar if you've used the VS Code Desktop.

In the next section, you'll learn how to work with remote repositories in VS Code for the Web.