반응형

 

안녕하세요.

 

Visual Studio Code는 가볍고 강력한 기능을 갖춘 개발용 에디터로, 수많은 확장 프로그램을 통해 기능을 무한히 확장할 수 있어요.
그중에서도 꼭 설치해두면 생산성을 높여주는 확장 프로그램 3가지를 소개합니다!

 


1. Live Preview 🔄

실시간으로 HTML 결과를 확인할 수 있는 확장 프로그램이에요.
HTML 파일을 수정하면 저장과 동시에 바로 결과를 브라우저에서 확인할 수 있어, 웹 개발에 필수!

 

설치 방법:
확장 프로그램 탭에서 Live Preview 검색 후 설치하면 됩니다.

 


 

2. Material Icon Theme 🎨

파일/폴더 아이콘을 보기 좋고 직관적으로 변경해주는 테마입니다.
어떤 파일이 어떤 종류인지 한눈에 파악 가능해서 가독성이 크게 향상돼요.

 


설치 후:
Material Icon Theme을 활성화하면 VSCode 전반의 아이콘 테마가 깔끔하게 바뀝니다.

 


3. Prettier – Code formatter ✍️

자동으로 코드를 정리해주는 포매터입니다.
특히 협업할 때 코드 스타일을 통일시키는 데 효과적이에요.

 

설정 방법

🔧 Command + , 를 눌러 설정(Settings) 메뉴에 진입합니다.

 

📌 Editor: Default Formatter 항목에서 Prettier - Code formatter를 선택합니다.

 

 Editor: Format On Save 옵션을 체크하면, 저장할 때마다 자동으로 코드가 예쁘게 정렬됩니다.

 


반응형

+ Recent posts