이 글은 드림코딩 엘리님의 유튜브 동영상을 보고 제가 정리한 글임을 미리 알려드립니다.
동영상에 있는 내용이지만
늘 시간이 부족한 여러분을 위하여 시간을 아껴드릴 겸 제가 정리해보았습니다.
웹개발자에게 추천할 VS Extension입니다.
Material Theme
- 에디터 칼라 Theme을 다양하게 설정할 수 있습니다.
Material Icon Theme (Philipp Kief)
Prettier
- Code format을 자동으로 수정합니다.
- 맥 기준 세팅창 단축기 :
cmd
+ ,
사용하여 세팅창으로 갑시다.
- save 검색하여 Format on Save 기능을 사용합니다.
- prettier 검색하여 tabsize :2 , quote 타입을 single로 설정합니다.
Bracket Pair colorizer
- 브라켓 쌍에 색감을 주어 알아보기 쉽게 만듭니다.
Indent Rainbow 2
- 들여쓰기 부분을 알아볼 때 눈에 잘 보이도록 해줍니다.
Auto Rename Tag
- HTML 태그 편집할때 시작태그를 수정하면 뒷 태그도 같이 수정됩니다.
Auto Close Tag
CSS Peek
- HTML에서 커맨드로 누른상태로 마우스 좌클릭 하면 정의된 css 파일로 자동 이동합니다.
HTML CSS Support
- css파일에서 클래스 선택자를 정의하고 html에서 클래스명을 설정할때 자동완성을 도와줍다.
live server(Ritwick Dey)
- 파일 수정시 새로고침을 안해도 자동으로 화면을 업데이트합니다.
- 명령창(cmd + shift + p )에서 Open with Live server를 선택하면 미리 설정된 port로 화면이 송출 됩니다.
Markdown Preview Enhanced(yiyi wang)
- md파일을 자동으로 보고 싶다면
- 명령창에서 markdown :Open preview 를 사용하여 프리뷰창을 열 수 있습니다.
html to css autocompletion
- html에서 정의한 클래스를 css파일에서 자동완성해줍니다.
출처 :
https://youtu.be/bS9yTI2fC0w