VS Code 생산성 확장 추천 - 2년 동안 써보고 진짜 살아남은
개발의 길 2026. 6. 29. 22:18 |VS Code 생산성 확장 추천 - 2년 동안 써보고 진짜 살아남은 5개
요즘 개발자들, VS Code 하나 없이 어떻게 일하는지 솔직히 모르겠어요. 저도 2년 넘게 매일 쓰고 있거든요. 근데 확장 프로그램 막 깔면 되냐? 그건 절대 아니에요. 안 쓰는 거 30개 깔려있으면 시작도 느려지고, 메모리도 다 잡아먹어요. 진짜 써본 것만 콕콕 골라봤습니다.
VS Code 생산성 확장 추천이란?
사실 "생산성 확장"이라는 말 자체가 좀 모호하긴 해요. MDN 웹 문서에 따르면 에디터 환경 자체를 개선하는 도구들을 통칭하기도 하고, 어떤 사람은 자동완성 도구, 어떤 사람은 테마까지 포함시키거든요. 일단 저는 "코드 작성과 디버깅을 직접적으로 빠르게 만들어주는 도구"로 좁혀서 정의해요. 너무 넓으면 끝이 없어요.
VS Code 공식 릴리스 노트를 확인하면 2025년 기준 1.85 버전부터는 워크스페이스 트러스트 기능이 강화됐고, 확장 API 자체도 꽤 많이 바뀌었어요. 거기에 맞춰서 확장을 다시 한 번 골라보는 게 좋겠죠. 옛날 글 그대로 따라 했다가 호환 안 맞아서 낭패 볼 수 있어요.
진짜 핵심 확장 5가지
1. Prettier - 코드 정렬은 이제 기계한테
저는 처음에 코드 스타일 맞추는 거 손으로 다 했어요. 멍청했죠. Prettier 깔고 2시간 만에 확 바뀌었어요. 진짜 그랬어요. 따옴표, 들여쓰기, 세미콜론, 이게 자동으로 통일되니까 협업할 때 코드 리뷰 시간이 확 줄더라고요.
근데 주의. Prettier는 기본값이 좀 공격적이에요. 설정에서 printWidth를 80 → 120으로 바꾸는 걸 추천해요. 안 그러면 한 줄에 다 짤려서 오히려 읽기 힘들어요. 개인차가 있긴 한데, 최소 100 이상은 두는 게 현대적인 코드 스타일에 맞아요.
공식 문서를 확인하면 Prettier 3.x 버전부터는 ESM 모듈이 기본이고, Node 14 이하는 지원 종료됐어요. 이거 모르고 쓰면 빌드 에러 납니다. 처음에 저도 이거 때문에 한참 해맸어요.
2. ESLint - 버그 잡는 확장, 선택 아닌 필수
이건 선택이 아니라 필수입니다. 진짜로요.
저도 한 번은 ESLint 없이 React 컴포넌트 300개 짜다가 props 타입 안 맞아서 런타임 에러 났어요. 그때 2시간 잡고 결국 ESLint로 해결. 그 이후로 안 깐 적이 없어요. 야근 줄이는 가장 확실한 방법이에요, 이거.
GitHub 이슈 트래커에 따르면 ESLint 9.0부터 flat config가 기본이 됐어요. 기존 .eslintrc 쓰고 있으면 에러가 막 뜹니다. Stack Overflow에도 이거 관련 질문이 1000개 넘게 올라와 있고, 답변도 정리가 잘 되어 있어요. 처음에 막히면 거기서 찾는 게 빠릅니다.
3. GitLens - Git을 에디터 안에서
Git 명령어 매번 치기 귀찮죠? 저도 그랬고요. GitLens 깔면 라인마다 누가 언제 수정했는지 바로 보여요. 누가 짠 코드인지 3초 만에 파악 가능해요.
근데 큰 저장소에서는 좀 무거워요. 제일 가볍게 쓰려면 gitCodeLens.enabled를 false로 두고, blame만 켜는 게 좋더라고요. 이거 한 줄 바꾸니까 체감이 확 달라졌어요.
4. Project Manager - 프로젝트 점프용
작은 회사 다니다 보면 프로젝트가 한둘이 아니잖아요. Project Manager는 그 폴더들 한 번에 등록해두고 Ctrl+Alt+P로 바로 점프해요. 별거 아닌데 진짜 편해요. 사바사인 줄 알았는데 막상 써보니까 하루에 20번은 누르게 되더라고요.
참고로, 이 확장은 오픈소스라서 GitHub에 이슈 직접 올릴 수 있어요. 1.5 버전 이후로 멀티루트 워크스페이스도 지원합니다. 모노레포 쓰는 분들한테 특히 유용해요.
5. Error Lens - 에러를 눈앞에 띄워주는 잔인한 친구
보통 에러는 Problems 탭에 숨어있잖아요. Error Lens는 코드 옆에 빨갛게 박아줘요. 살짝 짜증나지만, 그래서 좋습니다. 안 보일 수가 없으니까요.
TypeScript 쓸 때는 진짜 도움돼요. 타입 에러가 바로 보여서 후다닥 고치거든요. 처음엔 정신없어 보일 수 있는데, 하루 이틀 쓰면 절대 못 버려요.
실수하기 쉬운 VS Code 생산성 확장 추천 주의사항
확장 많이 깔지 마세요. 이게 제일 큰 함정이에요.
VS Code 공식 문서에 따르면 확장 50개 넘어가면 시작 시간이 눈에 띄게 느려진다고 해요. 실제로 재봤어요. 진짜로요. 측정 도구로 확인까지 해봤어요.
그리고 자동 업데이트는 일단 꺼두세요. 2024년 한 번은 확장이 자체적으로 망가져서 설정 다 날아갈 뻔한 적 있어요. 그때 30분 날렸습니다. 업데이트는 한 달에 한 번 정도 수동으로 하는 게 안전해요. 급할 거 없어요, 진짜.
또 하나, 확장 키바인딩 충돌 조심하세요. Ctrl+Shift+P 같은 건 아무나 차지하면 안 됩니다. Keyboard Shortcuts에서 충돌 체크 꼭 해보세요. 이거 안 보면 나중에 "어? 왜 안 되지?" 하면서 시간만 날려요.
간단합니다. 진짜 그게 다예요.
오늘부터 실천하는 VS Code 생산성 확장 추천 정리
뭐 대단한 거 없어요. Prettier, ESLint, GitLens, Project Manager, Error Lens. 이 다섯 개면 충분합니다.
돌이켜보면, 저는 처음에 확장 70개 깔려있었어요. 지우고 나서 시작 시간 3초 → 0.8초로 줄었어요. 그게 1일 수십 번, 1년이면 몇 시간이에요. 시간은 돈이에요. 진짜로요.
오늘 하나만 지워보세요. 진짜 안 쓰는 거. 어차피 안 쓸 거잖아요, 솔직히. 그리고 Prettier랑 ESLint만이라도 설치해 보세요. 내일 아침 출근길에 "아, 이거 왜 이제 알았지" 하실 겁니다.
여러분의 VS Code가 조금 더 가볍고, 조금 더 똑똑해지길 바랍니다. 즐거운 코딩 하세요!
#VSCode #생산성확장 #VSCode확장 #개발자도구 #코딩팁
'개발의 길' 카테고리의 다른 글
| Vue.js 완전정복! 초보자도 3일만에 마스터하는 핵심 가이드 (0) | 2025.08.23 |
|---|---|
| java 개발자라면 반드시 알아야 할 7가지 디자인 패턴의 비밀! (0) | 2025.06.19 |
| 신의 데이터가 인질로 잡혔다! 랜섬웨어 DB 암호화 공격의 무서운 실체 (3) | 2025.06.10 |
| 눈에 보이지 않는 소프트웨어의 일꾼들: 멀티스레드의 모든 것 (1) | 2025.04.24 |
| 코드의 마법사 되기: Node.js와 npm으로 시작하는 현대적 웹 개발 여정 (0) | 2025.04.24 |
