Live Share can come in handy in a variety of situations.

In the case of students, imagine you’re in a group project with three other students. Unfortunately for your group, the only work that has to be done on the project is within a single file, meaning every member of your group will only interact with that one file. This means that if you were to want to have every member of your team working in the file at the same time to maximize efficiency, the only way your group would be able to keep track and sync the code would be with Git. Unfortunately, many issues might arise because of this such as merge conflicts when you try to sync the code (Which you can check the git section of this document to learn how to navigate) or people working on the wrong section of the code (Which you can check the trello section of this document to learn how to avoid such misunderstandings). Rather than deal with these problems directly, we can just have everyone be able to see the entire document as it’s being typed live. This would mean there would only ever be one live copy of the file, meaning it’s impossible for merge conflicts to occur. It would also be incredibly easy to see if someone is working on the wrong part, as everyone else working on the document will see it being changed live.

Live Share’s utility isn’t limited to just students, it can also be used in workplace settings just as easily for the same reasons as above and more. For example, if a company didn’t want to use Git or some alternative for file hosting, perhaps out of confidentiality concerns, they could instead just have one copy of whatever project they are working on that everyone interacts directly with through Live Share. This would ensure the only place the files are hosted is on a computer the workplace should already trust.

Installation of Live Share into VS Code is simple, it’s done the same as any other VS Code extension. From the opening window of VS Code, select the extensions page from the left hand side as highlighted in red here:

From there, use the search field at the top to search for “vs live” or “live share”. Then the following should be visible:

For just the base functionality, the first one on the list, “VS Live Share”, suffices. Simply hit the install button on the bottom right of the box containing the first entry. If you wish, you can click anywhere else on the box and more information describing Live Share will appear on the right side of the page. As it says in the figure above, “VS Live Share Audio” allows one to share the audio of the host computer through the extension. This may or may not be desired and should be installed if that’s a feature you’ll want while working. The “VS Live Share Extension Pack” includes both “VS Live Share” itself and “VS Live Share Audio.” In other words, it just gets the other two mentioned extensions and bundles them into one installation. From there you’re done and you have the functionality installed.

Live Share

Live Share is an extension made by Microsoft for VS Code for the purposes of furthering collaboration by allowing multiple people to edit and debug code in real time. In other words, multiple people can be working on the same file and can see code being typed live from their own computer no matter where they are. The functionality of Live Share isn’t just limited to typing code at the same time, it can also be used to share debugging sessions, terminal instances, localhost web apps, voice calls and even more. This tool, for the purposes of remote development, is almost invaluable as it allows group projects to function as if everyone working on the project is right next to each other. This functionality has many uses for both the workplace and school work, you can find some examples of this in the next section. An example of how Live Sharing appears while using it can be seen in the image below.

The functionality of Live Share isn’t just limited to typing code at the same time, it can also be used to share debugging sessions, terminal instances, localhost web apps, voice calls and even more. This tool, for the purposes of remote development, is almost invaluable as it allows group projects to function as if everyone working on the project is right next to each other. This functionality has many uses for both the workplace and school work, you can find some examples of this in the next section.

Usage is extremely easy. You should now see a “Live Share” Button on the status bar of the bottom of your VS Code. Follow these instructions in order:

Click on this button (You can also access this with the command Ctrl+Shift+P / Cmd+Shift+P depending on your operating system). A pop-up will appear asking you to sign-in which you’ll complete in your browser. If you don’t have an account then you’ll be prompted to create one. Once you’re done following the instructions, you can just close your browser.

After you’re signed in you’ll see a new option on the VS Code activity tab as highlighted in red. To share a project, open the folder as you normally would (File -> Open..).

To collaborate, now click the “Live Share” button in the bottom status bar then select "Live Share: Start a collaboration session".

This will cause an invite link to be copied to your clipboard. An option to make the link read-only will also appear, which you can select if that’s desired. To share with other people, just send them this link via whatever way you normally message them. Make sure not to only send this link to people you trust, you don’t want to expose your files to random people. When someone attempts to join you’ll be prompted if you want to let them join or not.

That’s all it takes. From there you’ll be collaborating live! All participants will be able to see code as it’s being typed live. Each participant will see the folder being worked on as if it was on their own computer. This is an introduction to Live Share, there’s more functionality to it than explained in this document but this was just supposed to serve as an accessible guide on how to get started.

To end the session, hit this button in the top right:

If you want to join a session, just click the link the host sends you. It’s as simple as that.