Visual Studio Code(VSCode)는 다양한 테마와 아이콘팩을 지원해 개발환경을 자유롭게 커스터마이징할 수 있습니다. 개발자가 자주 머무는 공간인 만큼, 눈이 편하고 작업이 즐거워지는 환경을 만드는 것은 매우 중요합니다. 이번 글에서는 많은 사용자들에게 사랑받는 VSCode 테마와 아이콘팩을 추천합니다.

VSCode 추천 테마

1. One Dark Pro

• GitHub의 Atom 에디터 테마를 기반으로 제작된 테마입니다.
• 다크 모드 기반으로 가독성이 뛰어나며, 눈이 피로하지 않은 색상 배합이 특징입니다.
• 깔끔하면서도 개발 코드에 집중할 수 있는 환경을 제공합니다.

2. Dracula Official

• 보라색 계열을 중심으로 한 다크 테마입니다.
• 색 대비가 강해 코드 구분이 명확하며, 시각적인 피로도를 줄여줍니다.
• 다양한 에디터와 툴에서 호환되는 점도 장점입니다.

3. GitHub Theme

• GitHub 웹사이트와 동일한 색감을 VSCode에서도 사용할 수 있습니다.
• 친숙하고 부드러운 색감 덕분에 장시간 코딩에도 무리가 없습니다.
• Light 모드와 Dark 모드를 모두 지원합니다.

4. Tokyo Night

• 일본 네온 감성을 모티브로 한 다크 테마입니다.
• 블루 톤 기반으로 차분하면서도 현대적인 느낌을 줍니다.
• 프론트엔드, 백엔드 모두에게 인기가 높은 테마입니다.

VSCode 추천 아이콘팩

1. Material Icon Theme

• 가장 널리 사용되는 아이콘팩입니다.
• 폴더와 파일 타입에 따라 직관적인 아이콘을 제공해 프로젝트 구조를 한눈에 파악할 수 있습니다.
• 다양한 테마와도 조화롭게 어울립니다.

2. VSCode Icons

• 풍부한 색감과 다양한 아이콘을 제공하는 확장입니다.
• 프로젝트에 다양한 파일 형식이 많을 경우, 구분이 쉽고 보기 좋습니다.
• 사용자 설정을 통해 특정 파일에 커스텀 아이콘을 지정할 수 있는 기능도 지원합니다.

설치 방법

1. VSCode 좌측 사이드바에서 Extensions(확장) 아이콘 클릭
2. 검색창에 원하는 테마나 아이콘팩 이름 입력
3. Install 버튼 클릭 후 적용

테마 변경은 Ctrl + K → Ctrl + T를 누르면 쉽게 선택할 수 있습니다.
아이콘 테마 변경은 파일 → 기본 설정 → 파일 아이콘 테마 메뉴에서 변경할 수 있습니다.

실무 팁

• 테마는 단순 취향이 아니라, 코드 가독성과 장시간 작업 시 피로도에 직접적인 영향을 줍니다.
• 낮은 대비의 테마는 눈이 편하지만, 선명도가 낮아 디버깅 시 불편할 수 있습니다. 상황에 따라 테마를 교체하며 사용하는 것도 좋은 방법입니다.
• 프로젝트 성격에 따라 아이콘팩을 바꿔보는 것도 생산성 향상에 도움이 됩니다. 예를 들어, 파일 종류가 다양할수록 구체적인 아이콘팩이 효과적입니다.

좋은 테마와 아이콘팩을 적용하면 개발 집중력과 몰입도가 눈에 띄게 올라갑니다. 본인에게 가장 맞는 조합을 찾아 최적의 환경을 만들어보시기 바랍니다.

#VSCode #테마추천 #아이콘팩추천 #개발환경꾸미기 #코딩생산성

Visual Studio Code(VSCode)는 강력한 기능과 더불어 다양한 단축키를 지원합니다. 마우스 없이 키보드만으로 작업 속도를 높이기 위해 단축키를 익히는 것은 매우 중요합니다. 이번 글에서는 초보자부터 고급 사용자까지 자주 사용하는 VSCode 단축키를 정리해 소개합니다.

기본 이동 및 편집 단축키

• Ctrl + P : 파일 빠르게 열기

• Ctrl + Shift + O : 현재 파일 내 심볼(함수, 변수 등) 이동

• Ctrl + G : 특정 줄 번호로 이동

• Ctrl + Shift + ] / [ : 코드 블록 접기/펼치기

• Ctrl + C : 선택 영역이 없을 경우 현재 줄 복사

• Ctrl + X : 선택 영역이 없을 경우 현재 줄 잘라내기

• Alt + ↑ / ↓ : 현재 줄 위/아래로 이동

• Shift + Alt + ↑ / ↓ : 현재 줄 복제

멀티 커서 & 편집 기능 단축키

• Alt + Click : 원하는 위치에 커서 추가

• Ctrl + Alt + ↓ / ↑ : 다음 줄에 커서 추가

• Ctrl + D : 같은 단어 다음 찾기 및 선택

• Ctrl + Shift + L : 선택된 모든 단어 일괄 선택

• Ctrl + F2 : 문서 전체에서 같은 단어 모두 선택

• Ctrl + / : 현재 줄 주석 처리

• Shift + Alt + A : 선택 영역 블록 주석 처리

멀티 커서를 활용하면 여러 줄을 동시에 편집할 수 있어 생산성을 크게 높일 수 있습니다.

탐색 및 검색 단축키

• Ctrl + Shift + F : 전체 프로젝트 내 검색
• Ctrl + F : 현재 파일 내 검색
• Ctrl + H : 현재 파일 내 검색 후 치환
• F8 : 다음 검색 결과로 이동
• Shift + F8 : 이전 검색 결과로 이동

터미널 및 디버깅 단축키

• Ctrl + (백틱)` : 통합 터미널 열기/닫기
• Ctrl + Shift + ' : 새 터미널 생성
• F5 : 디버깅 시작
• F9 : 중단점 토글
• F10 : 디버깅 중 한 줄씩 실행(Step Over)
• F11 : 함수 내부로 진입(Step Into)

VSCode의 통합 터미널을 단축키로 자유롭게 다루면, 별도 터미널 프로그램을 사용할 필요가 없어집니다.

기타 유용한 단축키

• Ctrl + B : 사이드바 열기/닫기
• Ctrl + K → Ctrl + S : 전체 단축키 목록 보기
• Ctrl + K → Ctrl + 0 : 에디터 포커스 이동
• Ctrl + Shift + M : 문제 패널 열기

실무 팁

• 익숙해진 단축키부터 자연스럽게 손에 익히는 것이 중요합니다. 한꺼번에 외우기보다, 한두 개씩 늘려가는 방법이 효율적입니다.
• 직접 단축키를 커스터마이징할 수도 있습니다. 파일 → 환경설정 → 키보드 단축키 메뉴에서 본인 스타일에 맞게 수정이 가능합니다.
• 작업이 느려지거나 마우스를 많이 사용하는 구간이 있다면, 그 부분의 단축키를 찾아서 익혀보는 것이 큰 도움이 됩니다.

VSCode 단축키를 꾸준히 연습하면 개발 속도가 눈에 띄게 빨라집니다. 지금부터 하나씩 적용해보시기 바랍니다.

#VSCode #단축키정리 #코딩생산성 #개발환경 #VSCode팁