Best team collaboration tool for remote work using Visual Studio Code

William L'Archevêque
5 min readApr 9, 2020

--

Pair programming and remote collaboration for when you work from home

TLDR; You can install VS Code Live Share extension pack to enable great collaborating tools within Visual Studio Code. Enable the Slack integration and the Live Share Audio to communicate with others.

Pair programming and remote collaboration

Do you work from home and would you like to learn how to better collaborate with other developers ?

We live in a connected world in which remote collaboration and remote work are very useful. The unfortunate pandemic situation the world has dived in during spring 2020 has changed how startups and companies work together.

Freelancers work alone most of the time, although you may be collaborating with other developers or clients. Startup and business are used to shared office spaces where they can communicate in person. In all situation, remote work is taking much more importance during our current era.

Our data show that 56% of companies allow remote work, “hybrid companies,” or are a fully remote company. Last year, our U.S data revealed that 85% of companies were hybrid- allowing or requiring remote work. However, globally, the majority of companies still don’t allow remote work. 44% of respondents work for companies that don’t allow remote work, but interestingly, 16% work for companies that are fully remote. In 2017 in the United States, only 15% of companies did not allow remote work.

https://www.owllabs.com/state-of-remote-work/2018

Physical distancing and confinement brings new barriers in how we can work efficiently together. A handful of collaboration tools for remote work is available for developers.

In this article, I suggest a very useful tool for pair programming when working with Microsoft Visual Studio Code.

Setting up Visual Studio Code for collaboration with the LiveShare Extension Pack

The Live Share extension pack enables your team to rapidly collaborate on the same code without the need to synchronize code or configure the same settings, or environment. It is a very good starting point to share code, discuss around bugs/issues and complete pair code review.

The extension(s) offers great features for collaboration like live code editing, focus and follow another developer, group discussion and communication, peer debugging and shared terminal.

You can check out all the details on the extension page :
https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare-pack

You will first need to install the Live Share Extension Pack. Head to the extension view (Ctrl+Shift+X) search and install the extension.

You can also install it by launching the VS Code Quick Open (Ctrl+P), paste the following command, and press enter :

ext install MS-vsliveshare.vsliveshare-pack

Sharing session to show your code remotely in VS Code

Creating a sharing session is simple. Once the extension has been installed, open the Live Share tab in the left toolbar. You can also access it using the “Show all commands” (Ctrl+Shift+P), Focus on Live Share View or enter “view” and autocomplete will let you open the Live Share view.

In the command prompt, enter “view” and autocomplete will let you open the Live Share view

You will have three options for code sharing : Join collaboration session, Start collaboration session, Start read-only collaboration session.

Under sessions details, you can Start or Join a Live Share session

It’s also possible to generate a Session link using the “Create a planned session link” command.

Starting a session or joining one will prompt you to sign in to your Microsoft or GitHub accounts and redirect you to your browser.

Github authorization for Live Share

The invitation link will then be copied to your clipboard, ready for sharing to your collaborators. You can modify the session to make it read-only.

When you Start a Live Share session
More information on invitation link

Stopping the session or sharing your terminal

Once the session has started, you can easily share your terminal with your collaborating peers. In the Sessions Details view, you can see which participants are part of the session and share a terminal. You can open the Sessions Details View using Ctrl+Shift+P, Live Share: Focus on Sessions Details View

You can also terminate the session using the red icon on top of the sessions details panel.

Multiple options are offered to you in the Sessions Details View

Discuss and share audio in Live Share

The Visual Studio Code Live Share Extension Pack includes audio sharing capabilities. Beginning a new session creates a new discussion room. If you want to enter the room, click Join audio call under the Audio tab of the Live Share panel.

All developers accessing the session and guests have direct access to the call. It’s perfect for both collaborating, teaching, or presenting your code to colleagues or freelancers.

Integration Visual Studio Code with Slack

You can integrate Slack using the Setup Slack option. Once authorized by a slack administrator from your workspace, you will have direct access to a specific channel for Visual Studio Code collaboration. This can be activated with the “Live Share Chat : Sign in with Slack” command.

A note on security and privacy using Live Share

Some can have doubts about the security and privacy implied while using Visual Studio Code Live Share. Stay assured that Microsoft implements the best security measures so your code is secure and your privacy safe.

Read more information here :
https://docs.microsoft.com/en-us/visualstudio/liveshare/reference/security

You want similar results using SublimeText ?

Remote Collab is an open-source SublimeText plugin for remote pair programming, allowing multiple developers to work together on the same project in real-time. It can be installed through Package Control and found under RemoteCollab. Remote Collab is an open-source SublimeText plugin for remote pair programming, allowing multiple developers to work together on the same project in real-time.

More information on this link :
http://teamremote.github.io/remote-sublime/

Conclusion

Live Share is an extension for VS Code that enables real-time pair programming between developers. It gives users the ability to share a collaboration session with peers, allowing them to edit and review code as well as share a server and debugging session.

It’s a great time to be a remote developer — there are a lot of solid tools out there for collaborating on code. I hope this article helped you to configure the Live Share extension.

--

--

William L'Archevêque

Full-Stack Web Developer. Enthusiast Helper. Freelancer for 7 years, now having fun working at Centiva. Specialized in Laravel PHP, AWS Cloud and cartwheeling.