빠르게 요약한다. 웹개발자를 위한 필수 VS Extension (Feat. Dream Coding)

TookTalk2·2020년 10월 2일
1

Tool

목록 보기
1/2
post-thumbnail

이 글은 드림코딩 엘리님의 유튜브 동영상을 보고 제가 정리한 글임을 미리 알려드립니다.

동영상에 있는 내용이지만
늘 시간이 부족한 여러분을 위하여 시간을 아껴드릴 겸 제가 정리해보았습니다.
웹개발자에게 추천할 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

profile
쫓다.

0개의 댓글