본문 바로가기
개발/기타(vscode 설치)

01_VS code 확장프로그램 추천_Live server,Auto close tag,Indent-rainbow

by 자유로운 코끼리 2020. 4. 11.
728x90

안녕하세요!:D

설치를 했으니, 이제 편집기의 기능을 확실하게 사용하려면

몇 가지 확장 프로그램들을 설치해주어야 합니다.

 

VS 코드에 들어가 좌측에 여러 이모티콘들을 볼 수 있죠?

그 중에서 네번째 있는 아이는 extentions(확장프로그램)이라고

VS 코드가 가진 여러 기능을 선택적으로 사용할 수 있게 해주는 곳입니다.

 

 

검색바에서 필요한 프로그램을 적어 설치하면 되는데요.

우선 여러 프로그램 중 많은 분들이 필수적으로 설치하는 것들에 대해 알려드리려 합니다:>!

 

Auto close tag

- 태그를 만들면 자동으로 닫는 태그를 만들어주는 기능입니다.

ex) <h1>이라는 태그를 만드는 순간 자동으로 </h1>이 만들어집니다.

 

Auto rename tag

- 앞에 태그를 수정하면 뒤에 있는 태그의 내용도 동시에 수정이 되게 하는 기능을 가지고 있습니다.

Indent-rainbow

- 코드 들여쓰기에 따라 공간의 색을 바꾸어 주어 코드를 읽을 때 도움을 줍니다.

Rainbow Brackets

- 대괄호, 중괄호  등 괄호에 따라 색을 다르게 해줍니다.

(꼭 설치할 필요 X)Material theme

- 배경색을 바꾸어줍니다.

(꼭 설치할 필요 X)Material icon theme

- 코드의 색을다양하게 바꿀 수 있습니다.

Live server

- VSCode 자체에서 서버를 띄워주고,

  코드를 바꾼 후 저장하면 웹 브라우져에서 바로 확인가능하도록 새로고침을 자동으로 해준다.
서버열기 : Alt + L를 누른 후 Alt +O
서버닫기 : Alt + L를 누른 후 Alt +C

 

제가 코딩을 하면서 필요했던 몇가지 아이를 데려와 봤구요. 

앞으로 코딩을 하며 필요한 프로그램이 있을 때마다 따로 데려와 추가로 설명하겠습니다.

 

직접 코딩을 해보면서 더 필요한 부분이 있다면 그때그때 찾아보며 추가해주시면 되어요:).

끝!

 

'개발 > 기타(vscode 설치)' 카테고리의 다른 글

00_비주얼 스튜디오 코드 설치  (0) 2020.04.09

댓글