개발 환경 셋팅 - MS Visual Studio Code 환경설정

< 추천 Extension>

1. Material Theme
2. Material Icon Theme
3. Prettierctrl + shift + p > settings 검색 후> prettier quote 검색 > JavaScript › Preferences: Quote Style 을 Single 로 변경
   • 윈도우에서는 ctrl + 를 이용해 설정함
   • ctrl + shift + p > settings 검색 후> prettier quote 검색 > JavaScript › Preferences: Quote Style 을 Single 로 변경

4. bracket pair colorizer: 괄호에 컬러감을 줌으로써 코드의 가독성을 높여줌.

5. indent rainbow: 들여쓰기 된 부분이 rainbow 되어 한눈에 알아보게 함.

6. auto rename tag: HTML 편집 시 도움을 줌. ex) 태그 변경시 앞 태그를 바꾸면 뒷 태그도 자동으로 변경됨.

7. css peek: 정의된 CSS 파일을 금방 다 찾아줌.

8. html css support: html 에서 css 의 자동완성 기능 사용 가능.

9. live server

10. markdown preview (내장되어 있어서 따로 설치 필요X): readme.md

11. HTML to CSS autocompletion: HTML 에서 만든 class 명을 css 에서 자동으로 사용 하게

 

cf)

jsbin.com

JSFiddle

codesandbox.io