개발자에게 개발환경 구성은 중요한 부분이다. 5년 전에만 해도 강의에서 간단한 실습은 별도의 환경 구성없이 메모장을 활용한 기억이 있다. 오타가 난다면 어디서 생긴 문제인지 확인하느라 시간을 허비했던 경험도 있다. IDE(Integrated Development Environment, 통합개발환경)의 도움을 받으면 이런 상황을 쉽게 해결이 가능하도록 도와주는 장치들이 포함되어 있다. 하지만 IDE는 언어 혹은 프로젝트 구성의 존속적인 기능을 모두 포함하기에 무겁게 느껴지는 상황들이 분명 존재한다. 또한 여러 가지의 언어를 다루는 개발자 혹은 학생이 많은 상황에서 각 프로젝트에 해당하는 구성들을 따로 만들어 주기에는 개인 노트북이 감당하기 어렵다. 그래서 최소한의 구성으로 모든 상황을 유동적으로 대응할 수 있는 요구사항을 가진다. 이에 적합한 코드 편집기 중 가장 많이 사용하는 VSCode를 들여다본다.
Visual Studio Code
Visual Studio Code - Code Editing. Redefined
Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows.
code.visualstudio.com
Visual Studio Code is a lightweight but powerful source code editor which runs on your desktop and is available for Windows, macOS and Linux. It comes with built-in support for JavaScript, TypeScript and Node.js and has a rich ecosystem of extensions for other languages (such as C++, C#, Java, Python, PHP, Go) and runtimes (such as .NET and Unity). Begin your journey with VS Code with these introductory videos.
비주얼 스튜디오 코드는 당신의 컴퓨터에서 가볍지만 강력하게 실행되는 소스 코드 편집기이며, 윈도우와 맥, 리눅스 모두 사용 가능하다. 기본으로 내장된 자바스크립트와 타입스크립트, 노드js, 그리고 다른 프로그래밍 언어들(씨쁠쁠, 씨샵, 자바, 파이썬, 피에이치피, 고랭 등)을 위한 다양한 생태계 확장들과 런타임들(닷넷 혹은 유니티 같은)이 포함된다. ...
라고 소개하고 있다. 주로 소프트웨어 개발 단계 중 구현, 테스트, 유지보수 과정에서 활용이 가능하다. 다양한 언어를 지원하기에 각 언어가 어떤 환경을 요구하는지는 직접 공식 문서를 참고하여 구성해야 한다. 고수준에서 모든 과정을 도와주는 IDE만 사용했다면 불편함을 느낄 수 있겠다. 하지만 다양한 분야를 학습한다면 꼭 필요한 부분이다.
어떤 특징을 가졌는가?
기능적인 측면에서 가볍게 훑어보자.
1. 다양한 확장 기능과 Microsoft의 지원
Microsoft같은 큰 기업의 지원은 많은 이점을 준다. 각종 언어에 대한 지원은 물론이고, Remote 기능을 통한 WSL, Container, SSH 원격으로 마치 로컬 환경에서 사용하는 듯한 경험을 선사한다. 또한 Live Share와 Teams를 활용해서 수월한 협업을 도와준다.
Publisher Microsoft - Visual Studio Marketplace
Microsoft is an multinational technology company with vision to empower every person and every organization on the planet to achieve more.
marketplace.visualstudio.com
2. Open source
Microsoft는 흥미롭게도 GitHub에 VSCode 저장소를 공개하고 있다. 그 말은 즉 원한다면 개발자와 소통이 가능하며, issues에 질문 혹은 오류를 올릴 수 있으며, 능력에 따라서는 개발에 참여하여 부분적으로 기여할 수 있다. 물론 대부분은 코드를 읽고 참고가 가능하면 다행이다.
GitHub - microsoft/vscode: Visual Studio Code
Visual Studio Code. Contribute to microsoft/vscode development by creating an account on GitHub.
github.com
3. 설정 동기화
개발자의 환경 구성은 개인 컴퓨터에만 있지는 않을 것이다. 그래서 VSCode는 Microsoft 혹은 GitHub 계정으로 원하는 설정(설정, 확장, UI 등)을 다른 컴퓨터에서 역시 자동 동기화가 가능하도록 했다.
GitHub와 연동성이 좋은 점 역시 Codespaces를 예로 들 수 있다. 이런 기능들은 매번 구성을 설정하는 시간을 단축하는 효과를 가지고 온다.
Blazing fast cloud developer environments
Codespaces has the full power of Visual Studio Code, including the editor, terminal, debugger, settings sync, and any extension.
github.com
4. 다양한 테마
기능 못지않게 예쁜 테마는 매우 중요하다. 물론 시인성과 구분이 수월한 부분에서 예쁜 것이다. vscodethemes를 통해 다양한 테마를 확인할 수 있다.
VSCodeThemes — Preview Visual Studio Code Themes.
Zenburn Cold Gray - Low Blue - Sugar Paper javascriptcsshtml const btn = document.getElementById('btn')let count = 0function render() { btn.innerText = `Count: ${count}`}btn.addEventListener('click', () => { // Count from 1 to 10.
vscodethemes.com
개인적으로는 GitHub Theme을 추천한다. 이유는 가장 익숙하고 보편적으로 쉬운 구분이 가능하기 때문이다.
GitHub Theme - Visual Studio Marketplace
Extension for Visual Studio Code - GitHub theme for VS Code
marketplace.visualstudio.com
다운로드 및 설치
Download Visual Studio Code - Mac, Linux, Windows
Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows. Download Visual Studio Code to experience a redefined code editor, optimized for building and debugging modern web and cloud applications.
code.visualstudio.com
Setting up Visual Studio Code
Get Visual Studio Code up and running.
code.visualstudio.com
설치를 누르면 각 운영체제에 맞는 방법을 안내하고 있다. OS와 CPU 아키텍처에 따라서 방법이 다르니 참고가 필요하다. Linux 유저는 Snap Store를 이용하는 것이 가장 쉬울 것으로 보인다.
Install code on Linux | Snap Store
Get the latest version of code for Linux - Code editing. Redefined.
snapcraft.io
초기 설정
가장 먼저 한국어를 설치하는 것이다. 물론 필요 없다면 건너뛰면 된다.
왼쪽의 확장 탭을 누른 후 'korea'를 입력하면 제일 상단에 한국어 언어 확장이 보인다. 이 확장을 설치하고, 다시 실행하라는 알림이 보이면 안내사항대로 다시 실행해준다.
동기화와 Live Share 혹은 관련 부가기능을 사용하기 위해 하단 왼쪽의 계정을 눌러서 GitHub 혹은 Microsoft 계정을 로그인한다.
하단 왼쪽 톱니바퀴 모양의 관리에서는 모든 설정과 색 테마, 파일 아이콘 테마 등을 변경 가능하다. 편집기와 기능 및 확장에 대한 설정 등 세부적인 부분은 설정을 통해서 변경하면 된다.
댓글