비주얼 스튜디오 코드

1. 개요

비주얼 스튜디오 코드는 마이크로소프트가 개발한 소스 코드 편집기로, 다양한 프로그래밍 언어를 지원하며 구문 강조, 코드 완성, 디버깅 등 통합 개발 환경(IDE) 수준의 기능을 제공한다. 2015년에 처음 발표되었으며, MIT 라이선스 하에 소스 코드를 공개하고 확장 기능 지원을 제공한다. VS Code는 널리 사용되는 편집기로, 2018년부터 스택 오버플로우 개발자 설문 조사에서 1위를 차지하고 있다. 하지만, 사용 정보 수집 및 CEC-IDE 표절 논란 등의 비판도 존재한다.

2. 역사

마이크로소프트는 빌드 컨퍼런스에서 비주얼 스튜디오 코드를 처음 공개하였고, 2015년 11월 18일에는 MIT 라이선스 하에 소스 코드를 깃허브에 공개하였으며, 2016년 4월 14일에는 정식 버전을 배포하였다.

2.1. 개발 및 출시

마이크로소프트는 2015년 4월 29일 빌드 컨퍼런스에서 비주얼 스튜디오 코드를 처음 공개하고, 미리보기 버전을 출시했다.

2015년 11월 18일, MIT 라이선스 하에 비주얼 스튜디오 코드의 소스 코드를 깃허브에 공개하고, 확장 기능 지원을 발표했다.

2016년 4월 14일, 퍼블릭 베타 단계를 종료하고 정식 버전을 웹을 통해 배포하였다.

3. 기능

비주얼 스튜디오 코드는 Electron 프레임워크를 기반으로 구축되었으며, Blink 레이아웃 엔진에서 실행되는 Node.js 웹 애플리케이션을 개발하는 데 사용된다. 웹용 비주얼 스튜디오 코드는 프로그램을 설치하지 않고도 로컬 파일과 원격 저장소(깃허브 및 마이크로소프트 Azure)를 편집할 수 있는 브라우저 기반 편집기이다. 이는 마이크로소프트에서 공식적으로 지원하며, [https://vscode.dev] 에서 접속할 수 있다.

비주얼 스튜디오 코드는 사용 데이터를 수집하여 제품 개선에 활용하며, 수집된 정보는 마이크로소프트로 전송된다. 이 기능은 비활성화할 수 있다. 텔레메트리 데이터에 포함된 정보는 제품이 오픈 소스이므로 공개적으로 검사할 수 있다.

또한, 창 내에서 통합 터미널을 열거나, 웹에 공개된 기능 확장을 다운로드하여 설치할 수 있다.

3.1. 기본 기능

소스 코드 편집기로, 다양한 프로그래밍 언어를 지원하며 각 언어와 함께 사용할 수 있는 편리한 기능들을 제공한다. 비주얼 스튜디오 코드의 다양한 기능 중 상당수는 메뉴를 통해 접근할 수 없기 때문에, 명령 팔레트와 .json 파일(예: 사용자 설정)을 통해 사용해야 한다. 명령 팔레트는 그래픽 인터페이스가 지원하는 거의 모든 기능을 실행할 수 있어 키보드 접근성이 매우 높다.

작성 중인 문서의 코드 페이지를 바꾸거나 줄바꿈 문자(LF 또는 CRLF)를 선택할 수 있고, 편집 중인 소스 코드가 어떤 프로그래밍 언어를 사용하는지 설정할 수 있다.

대응하는 괄호 표시, 여러 커서, 사각형 선택, 블록 단위의 선택 확장 및 접기, Git 리포지토리와 비교한 변경 행 표시 등의 기능을 갖는다.

기본적으로 대부분의 일반적인 프로그래밍 언어에 대한 기본 지원을 포함한다. 이 기본 지원에는 구문 강조 표시, 괄호 일치, 코드 폴딩, 구성 가능한 스니펫이 포함된다. 또한 비주얼 스튜디오 코드는 JavaScript, TypeScript, JSON, CSS, HTML에 대한 IntelliSense와 Node.js에 대한 디버깅 지원을 제공한다. 추가 언어에 대한 지원은 VS Code 마켓플레이스에서 무료로 제공되는 확장을 통해 제공될 수 있다.

프로젝트 시스템 대신, 사용자가 하나 이상의 디렉터리를 열 수 있으며, 나중에 재사용하기 위해 워크스페이스에 저장할 수 있다. 이를 통해 모든 언어에 대한 언어 중립적 코드 편집기로 작동할 수 있다. 많은 프로그래밍 언어와 언어별로 다른 기능 집합을 지원한다. 원치 않는 파일 및 폴더는 설정을 통해 프로젝트 트리에서 제외할 수 있다.

소스 관리는 비주얼 스튜디오 코드의 내장 기능이다. 메뉴 막대 내에 전용 탭이 있어 사용자가 버전 관리 설정에 액세스하고 현재 프로젝트에 대한 변경 사항을 볼 수 있다. 이 기능을 사용하려면 비주얼 스튜디오 코드가 지원되는 모든 버전 관리 시스템(Git, Apache Subversion, Perforce 등)에 연결되어야 한다. 이를 통해 사용자는 저장소를 만들고, 비주얼 스튜디오 코드 프로그램에서 직접 푸시 및 풀 요청을 할 수 있다.

Visual Studio Code의 소스 코드 편집기 기능은 프로그래밍 언어별로 지원 여부가 다르다. 플러그인을 통해 다른 언어도 지원할 수 있다.

3.2. 확장 기능

비주얼 스튜디오 코드는 플러그인을 통해 편집 기능을 추가하거나 프로그래밍 언어 지원과 같은 새로운 기능을 확장할 수 있다. 이러한 확장은 중앙 저장소를 통해 제공된다.

확장 기능을 통해 새로운 프로그래밍 언어, 테마, 디버거를 추가하거나, 시간 여행 디버거 지원, 정적 코드 분석 수행, Language Server Protocol을 사용한 코드 린터 추가 등의 기능을 구현할 수 있다.

VS Code 마켓플레이스에서 무료로 제공되는 확장을 통해 추가 언어에 대한 지원을 받을 수 있다. 예를 들어, 기본적으로 지원되는 구문 강조, 괄호 일치, 코드 폴딩, 구성 가능한 스니펫 외에도, JavaScript, TypeScript, JSON, CSS, HTML에 대한 IntelliSense와 Node.js에 대한 디버깅 지원을 받을 수 있다.

다음은 소스 코드 편집기 기능에 대한 프로그래밍 언어별 지원 현황을 나타낸 표이다(다른 언어도 플러그인을 통해 지원 가능).

3.3. 언어 지원

비주얼 스튜디오 코드(VS Code)는 다양한 프로그래밍 언어를 지원하며, 각 언어에 맞는 편리한 기능들을 제공한다. 이러한 기능들 중 상당수는 명령 팔레트나 .json 파일(사용자 설정 등)을 통해 사용할 수 있다.

VS Code는 플러그인을 통해 편집 기능을 추가하거나 새로운 프로그래밍 언어를 지원하는 등 확장이 가능하다. 자바스크립트, 타입스크립트, CSS, HTML은 기본적으로 지원되며, 그 밖의 언어는 VS 코드 마켓플레이스에서 확장을 무료로 다운로드하여 지원할 수 있다.

VS Code에서 지원하는 프로그래밍 언어와 각 언어별 기능 지원 현황은 다음과 같다.

기본적으로 VS Code는 대부분의 일반적인 프로그래밍 언어에 대한 기본 지원을 포함한다. 이 기본 지원에는 구문 강조 표시, 괄호 일치, 코드 폴딩, 구성 가능한 스니펫이 포함된다. 또한, VS Code는 자바스크립트, 타입스크립트, JSON, CSS, HTML에 대한 IntelliSense와 Node.js에 대한 디버깅 지원을 제공한다. 추가 언어에 대한 지원은 VS Code 마켓플레이스에서 무료로 제공되는 확장을 통해 제공될 수 있다.

3.4. 통합 개발 환경 (IDE) 기능

비주얼 스튜디오 코드는 기본적으로 제공되는 소스 코드 편집기에 더하여, 디버깅, 인텔리센스, 리팩토링 등 통합 개발 환경(IDE) 수준의 기능들을 제공한다. 이러한 기능들은 다양한 프로그래밍 언어에 대해 지원되며, 플러그인을 통해 추가적인 언어 지원을 확장할 수 있다.

다음은 비주얼 스튜디오 코드에서 제공하는 IDE 기능 및 지원되는 프로그래밍 언어 목록이다.

3.5. 소스 관리

소스 관리는 비주얼 스튜디오 코드의 내장 기능이다. 메뉴 막대 내에 전용 탭이 있어 사용자가 버전 관리 설정에 접근하여 현재 프로젝트의 변경 사항을 볼 수 있다. 이 기능을 사용하려면 비주얼 스튜디오 코드가 지원되는 버전 관리 시스템(Git, Apache Subversion, Perforce 등)에 연결되어야 한다. 이를 통해 사용자는 저장소를 만들고, 비주얼 스튜디오 코드 프로그램에서 직접 푸시 및 풀 요청을 할 수 있다.

3.6. 원격 개발

마이크로소프트에서 제공하는 "원격 개발"(Remote Development) 확장 팩을 설치하면 SSH, 컨테이너, WSL을 이용해 원격 환경에서 개발할 수 있다.

3.6.1. 컨테이너 활용

"Visual Studio Code Remote - Containers" 확장 기능을 사용하면 도커 컨테이너 내에서 개발이 가능해진다.

도커 데스크톱 2.0+ 또는 도커 CE/EE 18.06+가 설치된 호스트 머신에서 컨테이너 내 개발 환경을 조작할 수 있다. 호스트 머신에 프로그래밍 언어 실행 환경을 설치하지 않아도 컨테이너 내에서 코딩 지원·디버깅 등을 이용할 수 있다.

컨테이너를 이용하는 방법에는 Git 저장소에서 직접 컨테이너를 생성하는 방법이 있다. 개발 환경 컨테이너 설정이 devcontainer.json에 기술된 Git 저장소는 VS Code 상에서 명시적인 Clone 없이 컨테이너화가 가능하다. "Repository 컨테이너" 생성 시에는 Git 저장소가 도커의 Volumes에 저장된다.(bind mounts가 아니다. 참고: 도커#영속화)

이 기능은 컨테이너 내에 VS Code Server를 구축함으로써 실현된다. 로컬에서 VS Code를 실행하는 것과 마찬가지로 컨테이너 내에서 VS Code(Server)가 시작되어(/root/.vscode-server), 클라이언트(로컬) 측에서 수행한 VS Code UI 조작을 컨테이너로 전송함으로써 투명하게 컨테이너 내 개발을 수행할 수 있다.

생성된 개발 환경(volume)은 VS Code의 Remote Explorer 탭에서 관리(액세스·삭제)가 가능하다. 실체는 도커의 Containers 및 Volumes이므로, 도커 측에서도 삭제할 수 있다.

4. 한국에서의 활용

비주얼 스튜디오 코드(Visual Studio Code)는 한국의 개발 환경에서 널리 사용되며, 개인 개발자부터 대기업, 개발 커뮤니티, 오픈 소스 프로젝트에 이르기까지 다양하게 활용된다.

주요 기업에서의 활용

* [[네이버]]: 네이버는 프론트엔드 개발, Node.js 기반 백엔드 개발, Python을 이용한 데이터 분석 등 다양한 서비스 개발에 비주얼 스튜디오 코드를 활용한다.
* [[카카오]]: 카카오는 카카오톡, 카카오페이지 등 주요 서비스 개발에 비주얼 스튜디오 코드를 활용하며, 특히 React, Vue.js, TypeScript 기반 프론트엔드 개발에 적극적이다.
* [[라인 (메신저)|라인]]: 라인은 React Native 기반 모바일 앱 개발, Node.js 기반 백엔드 개발 등 글로벌 서비스 개발 환경에 비주얼 스튜디오 코드를 활용한다.
* [[쿠팡]]: 쿠팡은 Java, Spring 기반 백엔드 개발, React 기반 프론트엔드 개발 등 이커머스 플랫폼 개발에 비주얼 스튜디오 코드를 활용한다.
* [[우아한형제들]]: 우아한형제들은 배달의민족 서비스 개발에 비주얼 스튜디오 코드를 활용하며, 특히 React Native 기반 모바일 앱 개발, Node.js 기반 백엔드 개발에 주로 사용한다.

개발 커뮤니티 및 오픈 소스 프로젝트에서의 활용

* [[생활코딩]]: 생활코딩은 일반인 대상 프로그래밍 교육 온라인 커뮤니티로, 강의 자료 및 예제 코드 작성에 비주얼 스튜디오 코드를 활용한다.
* [[OKKY]]: OKKY는 한국 대표 개발자 커뮤니티로, 회원 간 질의응답, 기술 정보 공유, 스터디 그룹 운영 등에 비주얼 스튜디오 코드를 활용한다.
* [[깃허브|GitHub]] 한국어 오픈 소스 프로젝트: 깃허브에서 활동하는 한국 개발자들은 다양한 오픈 소스 프로젝트 개발에 비주얼 스튜디오 코드를 활용한다.

한국어 지원 및 편의 기능

비주얼 스튜디오 코드는 기본적으로 한국어를 지원하고 한글 문서도 제공하여 한국 개발자들이 쉽게 사용할 수 있다. 또한 한국 개발자들을 위한 다양한 확장 기능(extension)이 있어 개발 생산성을 높인다.

한국 개발자를 위한 팁

* 확장 기능 활용: 비주얼 스튜디오 코드 마켓플레이스에서 "Korean Language Pack for Visual Studio Code"와 같은 한국어 관련 확장 기능을 설치하면 편리하다.
* 단축키 활용: 자주 사용하는 기능의 단축키를 익히면 개발 속도를 높일 수 있다.
* 온라인 커뮤니티 활용: 한국 개발자 커뮤니티에서 비주얼 스튜디오 코드 관련 정보를 얻거나 질문할 수 있다.

5. 논란 및 비판

비주얼 스튜디오 코드는 사용자의 제품 사용 정보를 수집하여 마이크로소프트로 전송하며, 설정을 통해 정보 수집을 비활성화할 수 있다. 수집된 정보는 마이크로소프트 산하의 계열사 및 자회사, 그리고 치안 당국에 공유되며, 이는 개인정보 취급방침에 따른다. 사용 상황에 대한 데이터도 수집하여 마이크로소프트로 전송하지만, 이 원격 분석 보고는 비활성화할 수 있다.

5.1. CEC-IDE 표절 논란

2023년 6월 20일, 광둥성 광저우에서 열린 디지털 정부 혁신 개발 포럼에서 CEC-IDE가 공개되었으며, 중국산 최초의 통합 개발 도구로 묘사되었다. 그러나 CEC-IDE는 재배포 시 요구되는 MIT 라이선스 사본을 포함하지 않는 등, 비주얼 스튜디오 코드를 리브랜딩한 제품으로 밝혀졌다. 8월 26일, 디지털 광둥은 CEC-IDE가 비주얼 스튜디오 코드를 기반으로 하고 있음을 인정하는 성명을 발표했다.

5.2. 사용 정보 수집

비주얼 스튜디오 코드는 사용자의 제품 사용 정보를 수집하여 마이크로소프트로 전송하며, 이를 원치 않을 경우 설정을 통해 정보 수집을 비활성화할 수 있다. 수집된 정보는 마이크로소프트 산하의 계열사 및 자회사, 그리고 치안 당국에 공유되며, 이는 개인정보 취급방침에 따른다. 또한 사용 상황에 대한 데이터를 수집하여 마이크로소프트로 전송하지만, 이 원격 분석 보고는 비활성화할 수 있다.

6. 평가

스택 오버플로우에서 실시한 개발자 설문 조사에서 비주얼 스튜디오 코드는 꾸준한 인기를 얻으며 최상위 개발 도구로 자리매김했다. 2016년 조사에서는 47,000명의 응답자 중 7%만이 사용하여 13위에 그쳤지만, 2년 후인 2018년에는 75,000명의 응답자 중 35%가 사용하여 1위를 차지했다. 2019년에도 87,000명의 응답자 중 50%가 사용하여 1위를 유지했다. 2020년 조사에서는 통합 개발 환경을 다루지 않아 순위가 없었지만, 2021년에는 71,000명의 응답자 중 74.5%가 사용하여 다시 1위를 차지했다. 이후 2022년에는 71,010명 중 74.48%, 2023년에는 86,544명 중 73.71%, 2024년에는 58,121명 중 73.6%를 기록하며 1위 자리를 지켰다.

--

비주얼 스튜디오 코드는 자바, 자바스크립트, Go, Node.js, C++ 등 다양한 프로그래밍 언어와 환경에서 유연하게 사용 가능하다는 장점 덕분에 개발자들 사이에서 높은 인기를 유지하고 있다.

7. 기타

마이크로소프트는 "Code - OSS" 저장소의 배포물에 자사 고유의 사용자 정의를 적용하여 일반적인 마이크로소프트 제품 라이선스로 비주얼 스튜디오 코드를 출시했다. 비주얼 스튜디오 코드는 사용 데이터를 수집하여 마이크로소프트로 전송하지만, 이 원격 분석 보고는 비활성화할 수 있다.

우분투 소프트웨어 센터는 코드(code)를 apt로 설치를 지원한다.

: $ sudo apt install code

7.1. VSCodium

마이크로소프트는 "Code - OSS" 저장소의 배포물에 자사 고유의 사용자 정의를 적용하여 일반적인 마이크로소프트 제품 라이선스로 비주얼 스튜디오 코드를 출시했다. 비주얼 스튜디오 코드는 사용 데이터를 수집하여 마이크로소프트로 전송하지만, 이 원격 분석 보고는 비활성화할 수 있다.

VSCodium은 오픈 소스 부분만 사용하고 마이크로소프트의 상표 및 원격 분석 구성 요소는 제거된, 비주얼 스튜디오 코드 소프트웨어의 또 다른 바이너리 배포판이다. 하지만 다른 면에서는 비주얼 스튜디오 코드와 완전히 기능하며 호환된다.

7.2. 우분투 소프트웨어 센터

우분투 소프트웨어 센터는 코드(code)를 apt로 설치를 지원한다.
: $ sudo apt install code