[HTML5] HTML5 사용을 위한 VSCODE초기 설정

 

 

Visual Studio Code 다운받기

 

HTML5를 사용하려면 Visual Studio Code 라는 프로그램을 다운받는다.

다운받고 실행했으면 이제 라이브서버를 설치해야한다.

 

 

왼쪽 맨밑에 아이콘(확장)을 누르면 확장기능을 다운받을 수 있다.

[확장]을 클릭하고 마켓플레이스에 Live Server를 검색하고 설치한다. live까지만 치면 바로 나옴!

 

그리고 vscode에서 html파일을 작성할때

느낌표를 누르고 탭을 누르면 html의 기본구조템플릿이 작성되는데 혹시 그게 안된다면 설정해주면 된다.

 

윈도우와 맥에서 각각 방법이 다른데 아래와 같이 하면 된다.

(윈도우)
파일 > 확장 > Emmet > Trigger Expansion On Tab 체크하기

(맥)
code > 기본설정 > 설정> 검색바에 Trigger Expansion On Tab 입력후 체크

 

 

그리고 이제 html파일을 작성해보겠다. 

먼저 html파일들을 관리할 폴더를 만드는데, 

나는 myhtml이라는 폴더를 만들고 그 폴더를 vscode에서 불러올것이다.

 

 

파일 > 폴더열기에서 myhtml폴더를 선택하고 열기를 누른다.

 

 

 

 

myhtml폴더아래에 index.html파일을 만들고

! + Tab 을 하면 위와 같은 기본구조 템플릿이 생성된다.