33.jpg
55.jpg

KAIST부설 한국과학영재학교 온라인 과학매거진 코스모스

  • 블랙 페이스 북 아이콘
  • 블랙 인스 타 그램 아이콘

비주얼 스튜디오 코드, 100% 활용하기

한국과학영재학교 학생들은 필수적으로 정보과학1, 2 수업을 이수해야 합니다. 대부분의 학생들은 정보과학1 첫 번째 시간에 설치한 Python 인터프리터와 Wing IDE는 1년 동안 사용합니다. Wing IDE는 편리한 개발 환경이지만, 다루어야 할 프로그램이 점점 커질수록 가볍다는 장점보다는 기능이 많지 않다는 단점이 부각됩니다. 실제로 정보과학1, 2의 직접적인 상위 과목인 정보과학3 과목을 담당하는 정 모 선생님께서는 필수 과목 외에 추가적으로 정보과학 과목을 수강하는 학생들에게 Wing IDE가 아닌 다른 개발 환경을 사용하는 것을 권장하시기도 합니다.

저는 JetBrains 사의 제품들과 Visual Studio, VIM 등 여러 가지 개발 환경들을 사용해 보았고, 현재는 Visual Studio Code를 사용하고 있습니다. Visual Studio Code(앞으로는 vscode라고 쓰겠습니다)는 Microsoft 사가 개발해 오픈 소스로 배포하고 있는 개발 환경으로, 세계에서 가장 큰 개발자 커뮤니티인 StackOverflow에서 중복 응답을 허용해 설문한 결과에 따르면 세상에서 가장 많이 사용되는 개발 프로그램입니다. 71%의 점유율을 기록했으며, 이는 2위인 Visual Studio의 33%의 두 배가 넘는 수치입니다. 절반 이상의 개발자들의 컴퓨터에 VSCode가 설치되어 있습니다.

필자의 VSCode 화면

하지만 설치 직후의 VSCode는 텍스트 에디터의 기능밖에 수행할 수 없습니다. 다시 말해 메모장일 뿐입니다. 자동 완성, 실행, 디버깅 등 개발에 필요한 모든 기능을 내부에 포함하고 있는 통합 개발 환경(IDE)과는 다르게, VSCode가 자체적으로 지원하는 기능은 매우 부족합니다. 하지만 여러 가지 확장들을 설치함으로써 상용 유료 IDE보다 더 편리한 개발 환경을 구축할 수 있습니다. 이 기사에서는 제가 사용하고 있는 확장들을 소개함으로써 여러분들의 VSCode 개인 설정을 도와드리려고 합니다.


언어 지원

한국과학영재학교의 모든 정보과학 수업은 Python을 사용하여 진행됩니다. Python 개발에 필요한 확장은 Python입니다. 이 확장 하나만으로 인텔리센스(자동 완성), 실행, 디버깅, 코드 포매팅, 리팩토링, 코드 내비게이션 등 개발에 필요한 대부분의 기능이 지원됩니다. 물론 Python 인터프리터는 따로 설치해아 합니다. 저는 AI 기반의 자동 완성을 제공해 코딩을 편리하게 해 주는 Visual Studio IntelliCode 확장도 같이 사용하고 있습니다.

Visual Studio IntelliCode

C/C++을 사용하고 있다면 기본 C/C++ 확장 외에도 CMakeLists.txt 파일 설정을 도와주는 CMake와 CMake Tools를 사용하는 것도 좋은 선택입니다. 아니면 C++ 개발자들이 많이 사용하는 확장들을 모아 놓은 C/C++ Extension Pack을 설치하셔도 됩니다. 이 확장은 C/C++, C/C++ Themes, CMake, CMake Tools, Remote Development Extension Pack, GitHub Pull Requests and Issues, Visual Studio Codespaces, LiveShare Extension Pack, Doxygen Documentation Generator, Better C++ Syntax을 포함하고 있습니다.

자바스크립트 언어 지원은 VSCode에 내장되어 있습니다. 자바스크립트를 개발하기 위해서 추가적인 확장은 필요하지 않지만, 그래도 개발을 편리하게 해 주는 확장들이 많습니다. 마크다운과 레이텍을 편집하고 문서를 제작할 수도 있습니다. 이외에도 PHP, C#, 하스켈, 자바 등 많은 언어를 위한 확장들이 지원되고 있습니다.


Git

큰 규모의 프로그램을 만들게 되면 개발 중인 프로그램을 백업하고 팀원 간의 협력을 수월하게 해 주는 버전 관리 시스템의 사용이 필수적입니다. SVN이나 머큐리얼 등의 선택지도 있지만 아직 Git만큼 많은 사용자를 보유하고 있지는 않습니다. Git은 로컬 저장소와 리모트 저장소가 나뉘어져 있고, 브랜치를 옮겨다니면서 작업을 해야 하는 등 사용할 때 신경써야 할 부분이 많습니다. 아래의 두 확장들은 Git을 편리하게 사용할 수 있도록 도와주는 확장들입니다.

Git Graph

첫 번째 확장은 프로그램 개발 상황을 시각적으로 보여주는 Git Graph입니다. 내가 개발하고 있는 부분을 담고 있는 브랜치의 상태를 확인할 수 있습니다.

GitLens

두 번째 확장은 GitLens입니다. 다른 사람이 작성한 코드의 커밋 코멘트를 확인할 수 있습니다. 또 어떤 부분을 마지막으로 수정한 사람을 찾는 Blame이라는 기능을 쉽게 사용할 수 있는데, 탓하다는 뜻의 단어를 사용한 것으로 코드의 버그를 탄생시킨 사람을 찾기 위해 만들어진 기능이라는 것을 추측할 수 있을 것입니다. 그 외에도 Git이 지원하는 많은 기능들을 편리하게 사용할 수 있는 인터페이스를 제공하고 있습니다.


글꼴과 테마

오랜 시간 코딩을 할 일이 있다면 코드의 활자에도 신경을 써야 합니다. 가독성과 같은 요소들이 생산성에 많은 영향을 미치기 때문입니다. VSCode 설정의 Editor: Font Family 항목에서 에디터 글꼴을 변경할 수 있습니다.

코딩에 적합한 글꼴의 특징은 어떤 것이 있을까요? 먼저 비슷하게 생긴 여러 문자들(소문자 l, 대문자 I, 숫자 1 등)이 확실하게 구별되어야 합니다. 또 코드의 줄을 맞추기 위해서 모든 문자의 폭이 일정한 모노스페이스 글꼴을 사용하는 것이 일반적입니다. 마지막으로 합자(Ligature) 기능이 있습니다. 합자 기능은 자주 같이 사용되는 두 개 이상의 문자를 하나의 문자로 표기해주는 기능으로, 예를 들어서 “작거나 같다”를 나타내는 “=<”는 합자되어 “≤“와 같은 모습으로 표시됩니다. 유명한 개발자용 글꼴로는 VSCode의 기본 글꼴인 Consolas, 지금 필자가 만족하며 사용하고 있는 Fira Code, 네이버에서 개발해 한글을 지원하는 D2Coding 등이 있습니다.

Fira Code 글꼴을 사용한 코드

테마도 개발 생산성을 좌우하는 기술 외적인 요소 중 하나입니다. 연구 결과에 따르면 사용하는 테마가 눈의 피로도에 큰 영향을 준다고 합니다. 백문이 불여일견이라고, 그냥 마음에 드는 디자인의 테마를 사용하시면 됩니다.

Material Theme

필자는 nord 테마를 사용하고 있습니다.

장인은 도구 탓을 하지 않는다는 말이 있습니다. 하지만 아직 장인이 아닌 우리는 좋은 도구를 사용함으로써 더 좋은 생산성을 기대할 수 있습니다. 아직 확신이 없으시다면 웹 버전 VSCode(https://vscode.dev/)로 먼저 시도해 보는 것도 좋은 방법입니다. 자신에게 맞는 개발 환경을 구축하는 데 도움이 되었으면 좋겠습니다. 감사합니다.

 

이승욱 학생기자 | Mathematics & Computer Sci. | 지식더하기


첨부한 이미지 출처

[1] 필자 컴퓨터 캡처

[2] https://marketplace.visualstudio.com/items?itemName=VisualStudioExptTeam.vscodeintellicode

[3] https://github.com/tonsky/FiraCode/blob/master/README.md

[4] https://www.reddit.com/r/vscode/comments/iqeh3v/when_using_git_graph_in_vscode_how_do_i_specify/

[5] https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens



ⓒ KAIST부설 한국과학영재학교 온라인 과학매거진 KOSMOS

조회수 2,497회댓글 1개

최근 게시물

전체 보기