C# :: Lecture & TIPs VB :: Lecture & TIPs

협업과 코드관리, 두 마리 토끼를 잡는 Visual Studio Team Services

안녕하세요!

처음 Visual Studio Team Services (VSTS) 가 출시되었을 때의 이름은 TFS (Team Foundation Services) 라는 이름으로 출시되었다가 업데이트를 거듭하면서 2013 년 Visual Studio Online 으로 서비스 명이 변경되었고, 최근에 이르러서는 다시 한번 Visual Studio Team Services 라는 이름으로 리브랜딩되었는데요.

Visual Studio Team Services 란, TFS 로 더 많이 알려진, 팀 파운데이션 서버 (Team Foundation Server) 의 웹 서비스 버전입니다. Team Foundation Server 는 설치형 소프트웨어로 ALM (Application Lifecycle Management) 도구로서, 응용 프로그램 성능 주기를 관리해주는 소프트웨어로 어플리케이션을 손쉽게 배포하고 관리할 수 있도록 도와줍니다. 컴파일 (Compile), 빌드 (Build), 테스트 (Test), 배포 (Release) 등 분리되어 있는 과정들을 한번에 지원하면서 관리하는데 드는 개발자들의 수고를 덜어주므로 VSTS 서비스를 사용하면 진행 계획과, 진행 상황, 협업과 코드 관리를 상당히 효율적으로 수행할 수 있게 됩니다.

Visual Studio Team Services 는 무료로 이용할 수 있습니다. 다만 무료 서비스 이용 시 제약 사항은 개발자 계정을 총 5 개 까지만 등록할 수 있으며, 개발자를 5인 이하로 등록할 경우에는 상업용이든, 비상업용이든 상관 없이 바로 이용할 수 있습니다.

Team Foundation Server 의 웹 서비스 버전 답게, 모든 동작들은 기존의 Team Foundation Server 사용법과 동일합니다만, “Team Explorer” 에서의 “Team Project Collection Settings”에서 제공되던 기능들이 “visualstudio.com” 웹 페이지로 넘어갔다는 정도의 차이점만 존재합니다.

기존에 존재하던, Team Foundation Server 의 경우 ‘개발 팀’이 대체로 유지 / 보수하게 되는데 그걸로 인해 소비되는 시간이 만만치 않습니다. Team Foundation Server 를 개발한 Microsoft 스스로가 직접 운영해 주는 만큼 확실한 서비스를 보장받을 수 있으며, 가격도 5인 이하의 대학생 동아리나 소규모 업체 혹은 커뮤니티 개발 팀은 무료로 사용이 가능하고, 웹 서비스 용량도 무제한으로 제공되며 Team Foundation Server 를 컴퓨터에 별도로 설치하지 않아도 사용이 가능해진다는 점에서는 꽤나 매력적인 요소 인 것 같습니다.

첫 번째 포스팅이므로 이번에는 서비스 가입과 간단한 사용 방법, 그리고 Visual Studio Team Services 와 연결되어 있던 코드 파일을 연결 해제 하는 방법에 대해 다루어보려고 합니다. 그럼, Visual Studio Team Services 의 사용법에 대해 알아볼까요?

 

[ 서비스 가입과 소스 코드 연결하기 ] 

1. Visual Studio Team Services (VSTS) 를 사용하려면 Microsoft 계정이 필요하므로 https://account.microsoft.com/ 으로 접속하여 회원 가입 절차를 거칩니다.

 

2. http://www.visualstudio.com/ 사이트에 접속하여 Visual Studio Team Services 항목 아래 무료로 시작하기 버튼을 클릭합니다.

wp-vsts001

 

3. Visual Studio Team Services 를 사용할 계정 URL 주소를 생성합니다. 가령, happybono 라는 계정을 입력할 경우 http://happybono.visualstudio.com/ 이 VSTS 의 메인페이지 접속 주소가 됩니다. 아래에는 현재 진행중인 프로젝트명과 프로젝트가 저장될 데이터센터의 위치를 입력합니다. 모든 항목에 대한 입력을 완료하셨으면 “Continue (계속)” 버튼을 클릭하여 메인 페이지를 생성합니다.

wp-vsts002

 

4. 웹 페이지가 생성되는데, 약간의 시간 (1-2분) 이 소요됩니다.

wp-vsts003

 

5. Recent projects & teams 항목에 위치한 New 링크를 클릭합니다.

wp-vsts004

 

6. 새로운 프로젝트를 생성 대화상자가 표시되면, 각각의 텍스트박스에 프로젝트 이름과 설명을 입력하고, Version Control 부분에는 “Team Foundation Version Control” 옵션을 선택합니다. 모든 작업을 완료하셨으면 “Create Project” 버튼을 눌러 프로젝트를 생성합니다.

wp-vsts005

 

7. 프로젝트가 생성되고 있는 중이니, 조금만 기다려주세요.

wp-vsts006

 

8. 프로젝트가 생성되면 Navigate Project 를 눌러 해당 프로젝트 페이지로 이동합니다.

wp-vsts007

 

9. Visual Studio Team Services 에 대한 튜토리얼과 프로젝트 생성에 대한 축하메시지도 함께 뜨는데요, 상단 우측의 “×” 버튼을 눌러 창을 닫습니다.

wp-vsts008

 

10. 표시되는 프로젝트 메인 페이지에서 우측 Visual Studio 카테고리에 위치한 [Open in Visual Studio] 링크를 찾아 클릭합니다.

wp-vsts009

 

11. 다른 앱으로 이동하기 전에 확인 메시지 박스가 출력되는데, [예] 버튼을 클릭하여 계속 진행 하도록 합니다.

wp-vsts010

 

12. Visual Studio Team Services 에 가입했던 Microsoft 계정의 아이디와 비밀번호 입력을 통해 로그인을 진행합니다. (이미 Visual Studio 에 로그인 되어 있는 사용자의 경우 아래처럼 계정 선택 대화상자가 나타납니다. 이전에 프로젝트를 생성한 아이디를 선택해 로그인 하시면 되겠습니다.)

wp-vsts011

 

13. Visual Studio 가 실행되었으면 Mapping (매핑) 을 해 주어야 하는데요, Mapping (매핑) 이란 웹서버의 코드 저장소와 컴퓨터에 저장된 로컬 폴더를 연결하는 작업입니다. [Configure your workspace (작업 매핑을 구성)] 링크를 클릭하여 맵핑을 수행합니다.

wp-vsts012

 

14. 이제 작업 영역을 구성할 단계입니다. [Map & Get (매핑 및 가져오기)] 버튼을 클릭합니다.

wp-vsts013

 

15. 매핑이 완료되었습니다. 이제 진행되고 있는 Project (프로젝트 파일) 를 하나 열어서 Code Repository (코드 저장소) 에 업로드 해 보도록 하겠습니다.

wp-vsts015

 

16. 상단 메뉴의 [파일] – [프로젝트 열기] 를 클릭합니다. 진행중인 프로젝트가 없으실 경우 [새 프로젝트] 를 생성하셔도 무방합니다.

wp-vsts016

 

17. [Open Project (프로젝트 열기)] 대화상자에서 솔루션 파일 (.sln) 을 찾아 선택한 후 하단의 [Open (열기)] 버튼을 클릭합니다.

wp-vsts017

 

18. 우측 하단의 [솔루션 탐색기] 탭을 클릭합니다.

wp-vsts019

 

19. 우측 솔루션 탐색기의 프로젝트 이름에서 마우스 오른쪽 클릭을 통해 표시되는 팝업 메뉴의 [Source Control (소스 제어)] – [Add Project to Source Control (소스제어에 솔루션 추가)] 을 차례로 선택해줍니다.

wp-vsts020

 

20. 화면에 새로 표시되는 소스 제어 대화상자에서 저장소를 생성할 때 지정해 둔 팀 프로젝트 명칭을 클릭하고, [OK (확인)] 버튼을 클릭합니다.

wp-vsts021

 

21. 솔루션 탐색기에 보면 프로젝트 좌측에 + 표시가 생기게 됩니다. 이를 통해 코드 저장소 (Code Repository) 와 성공적으로 연결이 이루어졌음을 쉽게 알아볼 수 있습니다.

wp-vsts022

 

22. 이제 작업 중인 코드들을 Code Repository (코드 저장소) 에 업로드해야하므로 화면 우측 메뉴에서 다시 [Team Explorer (팀 탐색기)] 탭을 클릭합니다.

wp-vsts023

 

23. [Pending Changes (보류 중인 변경 내용)] 버튼을 클릭하여 변경되었지만 서버에 적용되지 않은 파일들을 확인합니다.

wp-vsts024

 

24. 이렇게 새롭게 코드를 작성했거나 수정했던 변경 내역을 일괄적으로 확인 할 수 있습니다. [Comment (변경 내용 설명)] 부분을 입력한 후, [Check-in (체크 인)] 버튼을 클릭하여 코드를 서버로 업로드 하는 과정을 진행합니다.

wp-vsts025

 

25. [Check-in (체크 인)] 확인 대화 상자에서 [확인] 을 누르면 코드들이 서버로 업로드 (Commit) 됩니다.

wp-vsts026

wp-vsts027

 

26. 모든 파일에 대한 Check-in (체크 인) 이 완료되면 다음과 같이 체크인을 완료했다는 노란색 상자가 우측에 나타납니다.

wp-vsts028

 

27. 그럼 이제 로컬 컴퓨터에 저장된 코드가 서버의 코드와 일치하는지 확인해봐야겠죠? 하단의 [Solution Explorer (솔루션 탐색기)] 탭을 클릭합니다.

wp-vsts029

 

28. 솔루션 탐색기에 보면 + 아이콘이 자물쇠 모양의 아이콘으로 변경되어 있습니다. 각각의 파일들이 서버의 코드와 일치한다는 것을 의미합니다.

wp-vsts030

 

29. 서버에 접속 해 상단의 [Code] – [Files] 메뉴와 탐색기를 통해 직접 확인해보면 Project (프로젝트) 의 변경된 모든 파일이 성공적으로 업로드 되었음을 확인 할 수 있으며, 입력한 코멘트도 버전별로 보여집니다.

wp-vsts031

 

여기까지 Visual Studio Team Services 와 소스코드를 연결하는 방법에 대해 알아보았습니다. 그럼 간단하게 소스코드 연결을 해제하는 방법도 함께 알아보도록 하겠습니다.

 

[소스 코드 연결 해제 하기]

1. 소스 코드 연결 해제는 간단하게 상단 메뉴 바에서 [File (파일)] – [Source Control (소스 제어)] – [Advanced (고급)] – [Change Source Control] 을 차례로 클릭하여 진입합니다.

wp-vsts032

 

2. 화면에 표시되는 소스 제어 변경 대화상자에서 [Unbind (바인딩 해제)] 버튼과 하단의 [OK (확인)] 버튼을 차례로 클릭하시면 연결 해제가 이루어집니다.

wp-vsts033

 

여기까지 소스 제어를 연결하는 방법과 연결을 해제하는 방법에 대해 알아보았습니다. 다음 포스팅에서는 팀 구성원을 추가하고 발송된 초대장을 수락하는 방법에 대해 알아보도록 하겠습니다.

긴 글 읽어주셔서 고맙습니다.

Advertisements

8 comments

    1. 도움이 되셨다니 저도 기분이 좋습니다. ^^ 위의 Visual Studio Team Service 활용하기 (팀 구성원 초대 / 수락 및 프로젝트 변경 내용 추적) 트랙백을 클릭하시면 팀 구성원을 초대 / 수락하는 방법도 정리되어 있으니 참고하여 주시기 바랍니다.

      좋은 하루 되세요! ^^

      Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s