Sitemap

[Visual Studio 2019] Live Share 기능에 대한 모든 것!

happybono
9 min readApr 27, 2019

Visual Studio 2017 에서는 새로운 확장 기능을 설치하여야만 사용이 가능했었던 실시간 협업 / 코드 공유 (Live Share) 기능이 Visual Studio 2019 에서는 기본 기능으로 제공됩니다.

Live Share 기능이란, 복잡한 설정 없이 팀 구성원들과 함께 하나의 프로젝트를 열어, 실시간으로 함께 작업 할 수 있도록 해 주므로 기존처럼 소스 코드를 나누었다가 다시 합치는 불편한 과정들을 거치지 않아도 소프트웨어를 효율적으로 개발 가능하다는 이점이 존재합니다. 이와 더불어 어플리케이션을 개발하다가 작성한 소스 코드에 문제가 발생한 경우, 타인에게 프로젝트 파일을 별도로 전달하지 않고도 다른 사람과 소스 코드를 실시간으로 확인하면서 수정이 가능하기 때문에 온 · 오프라인 교육 환경이나 원격 작업 지원용으로도 응용하여 활용할 수 있습니다.

Live Share 기능은 Visual Studio 2017 이상 또는 Visual Studio Code 에서 사용 가능하며, Visual Studio 기준으로 상단 메뉴의 [Tools (도구)] — [Options (옵션)] 항목을 차례로 클릭하면 표시되는 설정 화면에서 [Live Share] 카테고리 하위의 [General (일반)] 항목 내부의 여러가지 설정을 수정 하여 보다 효율적인 협업이 가능해집니다.

이번 게시글에서는 Live Share 기능 활용 및 설정 방법에 대해 다루어보도록 하겠습니다.

[ Live Share 를 시작하기 전에 옵션 변경하기 ]

Live Share 기능을 최대한 활용하려면, 상단의 [Tools (도구)] 메뉴 하위의 [옵션 (Options)] 항목으로 진입 합니다.

설정을 보다 간편하고 빠르게 수행 할 수 있도록 [Sharing (공유)] 버튼을 누르면 표시되는 하위 메뉴에 배치하여 설정 바로 가기 식으로 구현하였다면 보다 직관적으로 접근이 가능했을 것 같은데 살짝 아쉽습니다.

기본적으로 Live Share 기능을 사용하면 세션 당 최대 5 명 까지참여 가능합니다. 하지만 [Options (옵션)] 화면의 [Live Share] 카테고리 하위의 [General (일반)] — [Increased Guest Limit (게스트 제한 증가)] 항목의 설정을 [True] 값으로 변경하게 되면, 최대 30 명 까지 참여 하여 함께 소스코드를 편집하거나 검토할 수 있습니다.

이외에도, 공동 디버깅 설정도 할 수 있는데요, 참여한 게스트들에 세션 중 디버깅을 자유롭게 수행할 수 있는지의 여부 혹은 디버그 시 localhost 로 실행되는 웹 앱을 게스트와 공유 할 것인지에 대한 설정까지 제공하고 있습니다.

더불어 공동 편집을 위한 세부적인 설정도 지원 합니다. 각각의 사용자 이름 (ID) 을 보여주는 플래그 기능에 대해 항상 보여줄 것인지, 참여자 (게스트) 의 활동이 있거나 해당 커서에 사용자의 마우스를 올리면 보여줄 것인지를 설정할 수 있고, 참여자 (게스트) 들의 커서 이동 요청을 무조건 수락할 것인지, 요청들에 대해 각각 의사에 따라 결정할 것인지에 대한 설정 등을 세세하게 변경할 수 있습니다.

[ Live Share 세션 시작하기 ]

오른쪽 최상단에 위치[Live Share] 버튼을 클릭하여 새로운 공동 작업 세션시작 할 수 있습니다. 예를 들어 자신이 작성한 코드에 오류가 발생하여 다른 개발자 분께 검토를 요청하거나, 온.오프라인 회의 및 강의를 하는 경우, 사내에서 다른 들과 협업이 필요한 경우 등의 사례들에 매력적으로 활용할 수 있을 것으로 보여지는데요,

Live Share 기능을 처음 실행할 경우, 보안 상 방화벽의 포트에 대한 권한을 허용하여야 정상적으로 세션을 시작할 수 있기에 하단에 위치한 [OK (확인)] 버튼을 클릭 해주시면 되겠습니다.

이렇게 세션을 시작하면 상단의 아이콘 모양과 텍스트가 변경되고, 세션을 준비하는데 약간의 시간이 소요 되게 됩니다.

세션이 성공적으로 시작되면 오른쪽 상단의 문구가 [Sharing (공유)] 으로 변경되고, 클립보드에 공동 작업 세션 URL 링크가 자동으로 복사됩니다. 공동 작업 세션 URL 링크를 망각하였을 경우, 상단에 표시되는 노란색 바[More Info (추가 정보)] 텍스트를 클릭하여 링크를 다시 한번 확인 하실 수 있습니다.

노란색 바의 More Info 텍스트를 눌렀을 때 표시되는 화면입니다. 공동 작업 세션 URL 을 확인하실 수 있고, 아래의 [Copy Invite Link (초대 링크 복사)] 버튼을 클릭하면 세션 URL 이클립보드에 복사 됩니다. 그리고 새로운 게스트 (참여자) 가 참여했을 때 알림 등을 확인할 수 있는 정보 등도 보여주고 있습니다.

[ Live Share 세션 참가하기 ]

Live Share 세션에 참가하는 방법에는 크게 두 가지가 있습니다.

SNS 혹은 메신저로 공동 작업 세션 URL 링크를 수신한 경우 해당 링크를 탭하거나 클릭하여 웹 브라우저를 통해 Live Share 세션에 참여하는 방법이 있고, Visual Studio 가 실행 중이라면 간단하게 Visual Studio 를 통해서 참여 가 가능한데요, 두 가지 방법을 모두 언급해두도록 하겠습니다.

Live Share 기능이 기본으로 제공되지 않는 Visual Studio 2017 환경에서 Live Share 확장 기능이 설치되어 있지 않은 상황이라면, 에러 메시지가 표시되고 실제 Live Share 세션과 연결되지 않는데요, 이후 표시되는 웹 페이지에서 Live Share 확장 기능을 설치할 수 있는 링크를 제공 하고 있습니다.

이렇게 게스트 (참여자) 가 Live Share 세션에 입장하게 되면 하단의 알림 창을 통해 참여 알림이 표시 됩니다. 이 때부터 참여자와 세션 진행자가 실시간으로 자유롭게 소스를 편집하거나 수정할 수 있게 됩니다.

참여자가 소스 코드의 내용을 수정하거나, 편집하고 있는 경우 상단에 Thumbnail (썸네일) 형태로 보여지는 프로필 사진을 클릭하면 그 때 그 때, 각각의 참여자가 수정하거나 현재 편집중인 위치로 이동 하실 수 있습니다.

[ 공동 디버깅 하기 ]

Visual Studio 의 [Options (옵션)] 에서 공동으로 자유롭게 디버깅할 수 있는 [Allow Guest Control (게스트 제어 허용)] 옵션True 값으로 변경 해 두었다면 일반적인 디버깅 방식 (상단 중앙에 위치한 [Start (시작)] 버튼 클릭) 참여자 쪽과 진행자 쪽 어디에서든 자유롭게 디버깅이 가능 합니다.

하지만, False 값으로 일반적인 디버깅 방식으로 디버깅을 할 수 없도록 설정되어 있는 경우라면, 아래와 같이 오른쪽 상단의 [Sharing (공유)] 버튼클릭하여 나타나는 하위 메뉴에서 [Share Terminal (Read / Write) (터미널 공유 (읽기 / 쓰기)] 항목을 클릭하여 터미널을 공유하는 방법으로 디버깅을 수행 할 수 있습니다. 물론, 디버깅 수행 이전에 BreakPoint (마킹하는 작업) 를 걸어 놓는 작업이 필요합니다.

다만, 여기서 주의하여야 될 점이 존재한다면, PowerShell 의 경우 Command Prompt (명령 프롬프트) 와는 다르게 현재 설정된 디렉토리의 경로가 기본 값이 아니므로, CMD (명령 프롬프트) 에서 실행하는 방법과 동일하게 파일 명만 그대로 입력하시면 안됩니다. 따라서 실행 테스트를 하실 경우 현재 경로를의미하는 “.” 과 디렉토리 분류를의미하는 “\” 를 입력하신 후 파일명 입력하셔서 ./[실행 파일명] 과 같이 입력하여 디버깅 수행 하시면 되겠습니다.

[ 공동 작업 세션 종료하기 ]

공동 작업 세션은 간단하게 오른쪽 상단의 [Sharing (공유)] 버튼을 클릭하여 표시되는 메뉴에서 [End Live Share Session (Live Share 세션 종료)] 버튼 차례로 클릭하여 종료 가능 합니다. 참여자 / 진행자 쪽에 상관 없이 종료가 가능하며 종료될 경우 열려있던 모든 파일과 편집기가 종료되어 편집 불가 상태가 됩니다.

Live Share 기능 안에 여러가지 다양한 기능들이 포함되어 있어 내용이 길어졌습니다. 그만큼 여러분들께 많은 도움이 되었으면 좋겠습니다!

오늘 이야기는 여기까지입니다.

Happy Coding!

Originally published at http://happybono.wordpress.com on April 27, 2019.

--

--

No responses yet