Intro

여러분은 어떤 IDE를 주력으로 사용하시나요?

여러 포스트에서 볼 수 있듯이 저는 완성된 것을 사용하는 것보다 커스텀 하여 사용하는 것을 좋아하는 편입니다. 이런 이유로 여러 확장 프로그램들로 커스텀이 가능한 VS Code에 정말 만족하면서 사용하고 있습니다.

확장 프로그램 중 이거 대박이다 싶었던 확장 프로그램만 뽑아서 매번 새롭게 업데이트해보겠습니다 :D

Dev Containers

Docker Container 내부에서 개발할 수 있도록 도와주는 확장 프로그램입니다.

회사에서 진행했던 솔루션 중 사용하는 서드파티 애플리케이션이 정말 많았던 솔루션이 있었습니다. 심지어 개중엔 특정 OS, 특정 아키텍쳐…에서만 작동 가능한 경우도 존재했습니다. 따라서 컨테이너가 아닌 로컬 환경에서 개발하기가 어려웠는데, 그때 이 확장 프로그램의 구원을 받았었습니다.

가볍게 언급만 하고 넘어가기엔 꽤나 아쉬운 주제라 관련 내용은 따로 포스트를 한 번 더 적어볼게요 😃

위 사진처럼 컨테이너를 올리고 접속하는 일련의 과정을 자동화할 수 있습니다.

Error Lens

에러 구문을 외부로 보여줘 한눈에 파악하기 편한 확장 프로그램입니다.

포인터를 올리지 않더라도 오류가 직관적으로 나타납니다.

file-tree-generator

지정한 폴더의 구조를 출력해 주는 확장 프로그램으로, 정리 및 협업에 큰 도움이 됩니다.

Github Actions

workflows와 secret key 등을 vscode 내부에서 관리할 수 있는 확장 프로그램입니다.

Github Copilot

AI base의 code autocomplete suggesions 확장 프로그램입니다.

Live Share

Visual Studio Code를 여러 명과 공유해서 사용할 수 있는 확장 프로그램입니다.

Meterial Icon Theme

파일 및 폴더 아이콘을 아래의 Meterial Icon으로 변경해 주는 확장 프로그램입니다.

지원하는 목록 중 일부

생각보다 훨씬 많은 파일/폴더 포맷을 지원하기 때문에 (jenkins, .github, …) 보기에도 예쁠 뿐만 아니라, 특정 종류의 파일/폴더를 찾는데 많은 도움이 됩니다.

또, 기본 파일 및 폴더 아이콘의 색상도 지정할 수 있다는 장점이 있습니다.

파일 아이콘 색상 지정

폴더 아이콘 색상 지정

이외에도 아이콘의 투명도, 테마 등을 변경할 수 있기 때문에 애용하고 있습니다:)

Power Mode

타이핑 시에 효과를 부여해 주는 확장 프로그램입니다.

이 확장 프로그램을 처음 알게됬을 땐 좋아하는 캐릭터의 gif도 넣어보고, 효과도 바꿔보면서 저만의 커스텀 효과를 만들었던 기억이 납니다.

현재는 약간 질려서 그냥 안쓰고 있네요 :(

Prettier - Code formatter

여러 언어에 대한 code formatter 확장 프로그램입니다.

만약 Markdown 작성 시 prettier가 방해될 경우 아래처럼 .prettierignore 파일을 생성하여 예외처리하시면 됩니다.

20*.md

Remote - SSH

ssh로 연결하여 VSCode를 사용할 수 있도록 하는 확장 프로그램입니다.

Todo Tree

현재 workspace의 todo 혹은 fixme 단어들을 가져오는 확장 프로그램입니다.

단어 목록 / 아이콘을 커스텀 할 수 있는 것이 특징이며, 저는 인수인계받는 과정에서 프로젝트 이해하는 데에 썼던 기억이 납니다.

Color Highlight

색의 hex, 이름 등에 해당하는 색으로 하이라이팅 해주는 확장 프로그램입니다.

Better Comments

주석에 특정 문자가 들어갈 경우 이에 맞게 하이라이팅 해주는 확장 프로그램입니다.

Auto Close Tag

HTML, XML의 태그를 자동으로 닫아주는 확장 프로그램입니다.