Visual Studio Code (VS Code) 초보자를 위한 5가지 팁(설정)

Visual Studio Code (VS Code)는 초보자에게도 매우 친숙한 코드 편집기입니다. 다음은 초보자를 위한 5가지 기본 세팅과 예시를 포함한 상세 설명입니다:

1. 테마 설정

VS Code의 테마를 설정하여 편안한 작업 환경을 만드세요. 테마는 코드 가독성을 높이고, 장시간 작업 시 눈의 피로를 줄이는 데 도움이 됩니다.

• 설정 방법: Ctrl+K Ctrl+T를 눌러 테마 선택 창을 엽니다. 여기서 다양한 테마를 선택할 수 있습니다.
• 예시: "Dark+" 테마는 어두운 배경에 밝은 글씨로 구성되어 있어 눈의 피로를 줄이는 데 도움이 됩니다. 반면, "Light+" 테마는 밝은 배경에 어두운 글씨로 구성되어 있어 밝은 환경에서 작업할 때 유리합니다.

2. 확장 프로그램 설치

생산성을 높이기 위해 몇 가지 필수 확장 프로그램을 설치하세요. 확장 프로그램은 코드 작성, 디버깅, 버전 관리 등 다양한 기능을 제공합니다.

• 설치 방법: 왼쪽 사이드바의 확장 프로그램 아이콘을 클릭하거나 Ctrl+Shift+X를 눌러 확장 프로그램 창을 엽니다. 여기서 필요한 확장 프로그램을 검색하고 설치할 수 있습니다.
• 예시:
  • Prettier: 코드 포맷팅을 자동으로 해주는 확장 프로그램입니다. 설치 후, 설정 파일에 "editor.formatOnSave": true를 추가하면 저장할 때마다 코드가 자동으로 포맷팅됩니다.
  • Live Server: HTML 파일을 실시간으로 미리 볼 수 있게 해주는 확장 프로그램입니다. 설치 후, HTML 파일을 열고 우클릭하여 "Open with Live Server"를 선택하면 브라우저에서 실시간 미리보기가 가능합니다.

3. 설정 동기화

여러 장치에서 동일한 설정을 사용하려면 설정 동기화를 활성화하세요. 설정 동기화를 통해 확장 프로그램, 테마, 단축키 등을 여러 장치에서 동일하게 사용할 수 있습니다.

• 설정 방법: Ctrl+Shift+P를 눌러 명령 팔레트를 열고 "Settings Sync: Turn On"을 선택합니다. GitHub 계정으로 로그인하여 설정을 동기화할 수 있습니다.
• 예시: 집과 회사에서 동일한 개발 환경을 유지하고 싶을 때 설정 동기화를 사용하면 매우 편리합니다. 한 장치에서 설정을 변경하면 다른 장치에서도 자동으로 반영됩니다.

4. 단축키 설정

자주 사용하는 기능에 대한 단축키를 설정하여 작업 효율을 높이세요. 단축키를 커스터마이즈하면 반복적인 작업을 빠르게 수행할 수 있습니다.

• 설정 방법: Ctrl+K Ctrl+S를 눌러 단축키 설정 창을 엽니다. 여기서 원하는 기능에 대한 단축키를 검색하고, 더블 클릭하여 새로운 단축키를 지정할 수 있습니다.
• 예시: 코드 주석 처리를 자주 한다면 Ctrl+/ 단축키를 사용해 보세요. 이 단축키를 누르면 선택한 코드 라인이 주석 처리됩니다. 또한, Ctrl+Shift+L을 사용하면 선택한 단어와 동일한 모든 단어를 한 번에 편집할 수 있습니다.

5. Git 통합

VS Code는 Git과 통합되어 있어 버전 관리를 쉽게 할 수 있습니다. Git을 사용하면 코드 변경 사항을 추적하고, 협업 시 충돌을 방지할 수 있습니다.

• 설정 방법: Ctrl+Shift+G를 눌러 Git 패널을 엽니다. 여기서 변경 사항을 커밋하거나 푸시할 수 있습니다. Git이 설치되어 있지 않다면, 먼저 Git을 설치하고 VS Code와 연동해야 합니다.
• 예시: 새로운 기능을 개발할 때는 별도의 브랜치를 생성하여 작업하세요. Ctrl+Shift+P를 눌러 "Git: Create Branch"를 선택하고 브랜치 이름을 입력하면 새로운 브랜치가 생성됩니다. 작업이 완료되면 Ctrl+Shift+G를 눌러 변경 사항을 커밋하고, Ctrl+Shift+P를 눌러 "Git: Merge Branch"를 선택하여 메인 브랜치에 병합할 수 있습니다.

이 외에도 다양한 설정과 확장 프로그램이 있으니, 필요에 따라 추가로 설정해 보세요. 도움이 필요하면 언제든지 말씀해 주세요!