Today I'm going to share with you an awesome plugin that lets you live code with other people. It is called VS Live Share.
What we're going to do today is to setup VS Live Share. I'll also show you how to start a collaboration session and join a collaboration session.
Installing VS Live Share
What you want to do is to install the VS Live Share extension. The VS Live share extension can be found in Visual Studio Code's extension marketplace.
Type VS Live Share into the search box and you'll be able to find it.
Then, click on install to install the extension.
Then, click on reload.
Signing in the VS Live Share
You will see a "Sign in" button at the bottom left corner of Visual Studio code, on the status bar. Click on the "Sign in" and a window will pop up to ask you to sign in.
You can sign in with a Microsoft account or a Github account. In my case, I use Github.
Now, you're ready to collaborate.
What happens next depends on whether you're starting a session or joining a session.
Starting
If you are starting the session, you can click on your name at the bottom left corner, and select start collaboration session. Alternatively, you can simply click on "Share" to start the session.
Once you started the session, VS Code will show you a notice on the bottom right hand corner. It'll say a link has been copied to your clipboard.
You can click on "Copy again" to make sure the link is copied onto your clipboard.
This link looks like this:
https://insiders.liveshare.vsengsaas.visualstudio.com/join?0EUI09T34IISNETHUI09435
You'll pass this link to your parter for them to join your session.
Joining a session
To join a session, you click on your name on the bottom left hand corner, then click "Join collaboration session" and paste the link your parter gave you.
That's it.
Making it better
You might want to use a video chatroom application like Zoom or appear.in to chat and type code at the same time.
Thanks for reading. This article was originally posted on my blog. Sign up for my newsletter if you want more articles to help you become a better frontend developer.
Top comments (2)
I'm using it from time to time. VS Live Share is a useful tool. I must add that session members can use both VS Code or Visual Studio. We are not limited to VS Code.
As a drawback, I have to mention that when some of the session members change the working file, it's hard to find it because there is no mark indicating on which file you partner actually is.
Thanks for your post and video.
There is a community on spectrum where you can post your VS Live Share link.
If you need help from someone with your project or just want to teach you can create a thread, fill in some information and you are good to go.