[Tool] VS Code 필수 단축키 & 확장 프로그램 완벽 정리

안녕하세요! 오늘은 VS Code를 더 효율적으로 사용할 수 있는 꿀팁들을 정리해보았습니다.

필수 단축키 모음

📌 기본 조작
- Ctrl + P : 빠른 파일 열기
- Ctrl + Shift + P : 모든 명령 표시
- Ctrl + ` : 터미널 열기/닫기
- Alt + ↑/↓ : 현재 줄 이동
- Ctrl + L : 현재 줄 선택

📌 코드 편집
- Ctrl + D : 같은 단어 선택 (여러 번 누르면 다중 선택)
- Alt + Click : 다중 커서
- Ctrl + / : 주석 처리/해제
- Shift + Alt + F : 코드 자동 정렬
- Ctrl + Space : 자동 완성 제안

📌 화면 관리
- Ctrl + B : 사이드바 열기/닫기
- Ctrl + \ : 화면 분할
- Ctrl + Tab : 열린 파일 간 이동

추천 확장 프로그램

1. 코딩 필수품
- GitHub Copilot : AI 코드 자동 완성
- GitLens : Git 이력 관리 강화
- Error Lens : 인라인 에러 표시
- Auto Rename Tag : HTML/XML 태그 자동 수정

2. 코드 품질
- ESLint : 자바스크립트 코드 검사
- Prettier : 코드 자동 정렬
- Code Spell Checker : 영문 스펠링 체크
- SonarLint : 코드 품질 검사

3. 테마 & UI
- Material Icon Theme : 파일 아이콘 테마
- One Dark Pro : 인기 다크 테마
- Indent Rainbow : 들여쓰기 색상 표시

4. 생산성 도구
- Live Server : 실시간 미리보기 서버
- Thunder Client : API 테스트 도구
- Code Runner : 코드 즉시 실행

추천 설정

{
    "editor.fontSize": 14,
    "editor.fontFamily": "D2Coding, Consolas, monospace",
    "editor.wordWrap": "on",
    "editor.minimap.enabled": false,
    "editor.formatOnSave": true,
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "files.autoSave": "afterDelay",
    "workbench.colorTheme": "One Dark Pro",
    "terminal.integrated.defaultProfile.windows": "Git Bash"
}

 

작업 효율을 높이는 팁

1. 스니펫 활용하기
- 자주 사용하는 코드 조각을 저장
- 커스텀 스니펫 만들기

2. 작업 영역 설정
- 프로젝트별 설정 관리
- .vscode 폴더 활용

3. 다중 커서 활용
- Alt + Click
- Ctrl + Alt + ↑/↓
- Ctrl + D

4. 터미널 통합 활용
- Git 명령어 실행
- NPM 패키지 관리
- 빌드 및 실행

마무리

위의 설정들을 적용하면 VS Code를 훨씬 더 효율적으로 사용할 수 있습니다.
특히 단축키는 처음에는 어색할 수 있지만, 자주 사용하다 보면 작업 속도가 크게 향상됩니다.

이 글이 도움이 되셨다면 좋아요와 공유 부탁드립니다! 😊