본문 바로가기
개발/웹 (HTML)

HTML 초보자를 위한 VSCode 확장 추천

by 레조 2024. 10. 28.

VSCode

 

VSCode는 웹 개발에 최적화된 강력한 툴입니다.

로컬 환경에서는 물론이고, 원격 서버에서 작업할 때도 마치 로컬에서 작업하는 것처럼 빠르고 편리하게 사용할 수 있습니다. 이번 글에서는 VSCode 설치부터 시작해, HTML 개발에 필요한 확장을 설치해보겠습니다.

 

VSCode 설치

https://code.visualstudio.com/

VSCode Download

 

HTML 개발에 필요한 VSCode 확장을 최소한으로 설치해봅시다.

앞으로 진행하면서 필요할 때 추가합니다.

 

확장 설치 아이콘은 좌측에 있습니다.

VScode Extension

 

1. 코드 포메팅

VSCode는 HTML 코드 포메팅을 지원한다. (Alt + Shift + F)

 

2. Auto Rename Tag

HTML을 작성하다보면 태그 앞뒤 맞추기가 항상 번거롭고 불편하다.

이것을 자동화해주는 확장이다.

Auto Rename Tag
Auto Rename Tag Demo

 

3. Live Server

작성한 HTML 코드를 브라우저에서 접속해 볼 수 있다.