Program Install/Visual Studio Code

[VSC] 익스텐션 설치

taecongs 2023. 3. 5. 06:06

Visual Studio Code를 사용하는 경우 필수 익스텐션 정리

( ※ [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11 필수 설치 )


1. Korea Language Pack for Visual Studio Code

  • 영어로 되어 있는 Visual Studio Code를 한국어 버전으로 보여주는 확장 프로그램

 

2. Prettier - Code formatter

  • 코드 자동화 정렬 확장 프로그램
  • Ctrl + S로 저장을 해주면 코드가 자동적으로 들여쓰기 된다.
  • 좌측 하단 톱니바퀴 아이콘 클릭 -> 설정 클릭
  • formatter 검색 -> 없음(null)을 Prettier - Code formatter(esbenp.prettier-vscode)로 변경
  • editor format 검색 -> Editor:Format On Save에 체크 표시

 

3. Material Theme

  • 편집기의 테마를 바꿔주는 확장 프로그램

 

4. Material Icon Theme

  • 저장한 코드 파일의 아이콘을 시각적으로 알아보기 쉽게 아이콘을 바꿔주는 확장 프로그램

 

5. Auto Rename Tag

  • 하나의 태그만 수정하여도 자동적으로 나머지 태그를 같이 수정해주는 확장 프로그램

 

6. HTML to CSS autocompletion

  • HTML에서 정의한 클래스나 속성에 설정한 이름을 CSS에서 자동 완성 기능으로 띄워주는 확장 프로그램

 

7. HTML CSS Support

  • CSS파일에서 정의한 클래스나 id 값을 HTML 파일에서 자동완성 기능을 제공하는 확장 프로그램

 

8. CSS Peek

  • CSS파일을 쉽게 찾을수 있도록 도와주는 확장 프로그램

 

9. Colorizer

  • 색상 코드 문자에 배경색을 입혀서 한눈에 알아볼 수 있도록 해주는 확장 프로그램

 

10. Colorful Comments

  • 주석 주제에 따라서 색깔을 적절히 사용하여 코드 가독성에 매우 도움이 되는 확장 프로그램

 

11. indent-rainbow

  • 들여쓰기를 보다 쉽게 볼 수 있는 간단한 확장 프로그램

 

12 Auto Reload

  • 로그 파일 같은 경우 실시간으로 로그가 쌓여 파일 내용이 바뀌게 된다.
  • 이때 파일창을 끄고 다시 여는게 아닌, auto reload를 활성화하면 콘솔같이 파일 내용이 실시간으로 변경된다.

 

13 Auto Scroll

  • Auto Reload 확장팩과 함께 사용하며, 자동으로 파일 내용을 스크롤링 해주는 확장팩이다.