제가 설치하여 사용하고 있는 확장 프로그램 모음입니다.
하나씩 글을 적기엔 분량이 너무 적을 거 같아서 그냥 한 번에 쭉 리스트를 올려봅니다.
#1 이건 필수!
Korean(사용법) Language Pack for Visual Studio Code
Visual Studio Code의 설정을 한글로 바꿔주며, 기본적으로 처음 설치 시 오른쪽 아래의 팝업창을 통해 자동으로 설치됩니다.
Live Server
웹브라우저를 통하지 않더라도 수정하는 결과를 바로바로 확인할 수 있게 도와주는 프로그램으로 코딩한 내용의 수정 사항을 즉각적으로 확인할 수 있습니다.
#2 강력 추천
Auto Rename Tag
한쪽의 태그만 수정해도 반대쪽의 태그까지 자동으로 수정해 줍니다.
Bracket Pair Colorizer 2
()와 {}에 색상을 주어 해당 범위를 쉽게 인식 할 수 있습니다.
CSS Peek
HTML에서 해당 클래스를 선택하면 CSS위치로 바로 이동할 수 있습니다.
HTML CSS Support
HTML에서 코드 작성시 이미 작성되어있는 CSS의 이름을 미리 보여주는 기능.
오타로 인한 연결 오류를 현저히 줄일 수 있습니다.
HTML to CSS autocompletion
위에서 HTML 작성시작성 시 CSS를 쉽게 입력하였다면, 이건 CSS 작성 시 HTML의 클래스를 쉽게 선택할 수 있습니다.
두개를 세트로 사용!
#3 추천
htmltagwrap
이미 작성된 부분을 드래그 등으로 범위를 지정하여 양쪽에 태그를 쉽게 넣어줄 수 있게 해 줍니다.
윈도우는 alt + W, 맥에서는 option + W를 사용합니다.
indent-rainbow
들여 쓰기 한 부분에 색상을 주어 구분을 쉽게 해 줍니다.
내용이 길어질수록 힘을 발휘합니다!
Beauty
HTML의 경우 ctrl + K, ctrl + F로 자동 정렬을 사용할 수 있지만 CSS와 Javascript에서는 자동 정렬이 안되는데,
이 확장 프로그램을 설치하면 ctrl + option + B를 눌러 CSS와 javascript에서 자동 정렬을 할 수 있습니다.
#4 취향에 따라 선택
Community Material Theme
다양한 색 테마를 추가해 줍니다.
Material Icon Theme
HTML, CSS, javascript 등 파일에 따라서 아이콘을 변경해 주기 때문에 조금 더 쉽게 파악할 수 있습니다.
