Auto Close Tag
여는 태그를 작성하면 자동으로 닫는 태그를 생성해 준다.
Auto Rename Tag
만들었던 태그 이름을 변경하면 그와 짝이 맞는 닫는 태그도 이름을 바꿔준다.
indent-rainbow
칸별로 들여쓰기에 색상이 생겨 가독성이 좋아진다.
HTML CSS Support
html에서 작성해뒀던 css 클래스이름이나 아이디이름 자동완성을 이용할 수 있다.
HTML to CSS autocompletion
CSS에서 작성해뒀던 html 클래스이름이나 아이디이름 자동완성을 이용할 수 있다.
CSS Peek
ctrl이나 cmd를 누르고 CSS설정을 해둔 클래스나 아이디 이름을 클릭하면 빠르게 CSS 파일로 갈 수 있다.
Material Theme
Set Color Theme 버튼을 눌러 VSCode의 배경색상을 설정 할 수 있다.
Material Icon Theme
파일 아이콘이 언어별로 예쁘게 바뀐다.
Bracket Pair Colorization
VSCode가 업데이트 되어 자체적으로 컬러 브라켓이 지원되어 이제는 설치하지 않아도 된다.
Javascript Auto Backtick
${}를 감지하면 따옴표로 감싸져있던 문자열의 따옴표를 자동으로 백틱으로 변경해준다.
Live Server
작업하고 있는 페이지를 브라우저에서 띄워주고 실시간으로 반영해준다. 파일을 변경하고 저장하면 자동으로 반영되므로 새로고침 할 필요가 없다.
단축키 : alt + L + alt + O / cmd + L + cmd + OPrettier
설정을 통해 코드 스타일을 통일할 수 있다.
Settings(ctrl + ,/ cmd + ,)에서 Default Formatter 세팅을 해주어야한다.
Format On Save 설정을 해주면 편리하다.
유용하지는 않지만 재미있는 익스텐션
Power Mode
코드를 입력할 때마다 창이 흔들리면서 이펙트가 나온다.
Settings에서 power mode를 껐다 켰다 할 수 있다.
아이콘을 눌러 settings.json 파일을 열고 코드를 붙여넣으면 테마를 바꿀 수 있다.
코드와 테마의 종류는 익스텐션 설치 페이지의 detail > Choose Your Explosions 부분에서 확인할 수 있다.
