As some of you may already know, we will be allowed to work in pair going forward from P3. I found VSCode Live Share pretty useful for group programming (especially face-to-face paring programming).

Roughly speaking, VSCode Live Share is Google Docs for Coding. It supports

Live editing
Focus and Follow
Audio calls
Shared terminal
Shared servers (not covered in this tutorial)
Group debugging (not covered in this tutorial)

In this tutorial, I will walk you through how to set up VS Code Live Share for code collaboration.

Animated gif of 2 people highlighting editing code in real-time together.

Preparation

1. Download Visual Studio Code from code.visualstudio.com and install it. (You can also use Visual Studio if you already installed it, but this tutorial will be focused on VSCode.)

2. Open a folder that you want to work on. I will use xv6 as an example.

3. Open the extension tab on the left, search for VS Live Share Extension Pack, and click install. Restart the editor if prompted.

Start a Live Share Session

1. Click on Live Share at the bottom left. An invitation link will be copied to the clipboard.

2. Send the link to your partner. He/she will be able to open the link in VS Code and join the session (possibly required to login via Microsoft account or GitHub).

3. Once your partner joins the live share, you should be able to see his/her cursor in the editor.

Some Useful Tricks and Tips

By default, your partner will follow your cursor when you are moving. You can disable it in the Live Share tab (see screenshot below).

During VSCode Live Share, you can open an integrated terminal by pressing Control + `, and the terminal will be shared across the session. It’s read-only by default, but you can change the permission in the Live Share tab as well.