Live Server 확장팩 설치

VS Code 의 Live Server 확장팩은 html, css  소스를 실시간으로 웹브라우져에 반영시켜주는 확장팩이다. 

소스를 작성하면서 편리하게 결과물을 볼 수가 있다.

- 좌측 4번째 아이콘을 눌러 확장팩을 설치 준비한다. 

- 검색창에 Live을 입력한다. 

- 검색 후 나타난 Live Server 확장팩을 선택한다. 

- 설치를 눌러 확장팩을 설치한다.

 

 

- 간단한 예제 소스를 입력한다.

- 소스를 입력한 후 저장하기 위해 Ctrl+s 키를 누른다.

- VS CODE 하단의 Go Live 를 틀릭한다.  

 

 

- "Go Live" 를 클릭하면 "port:5500" 이 나타난다.

- 성공.. 웹브라우져가 뜨며 소스의 결과물이 브라우져에 출력된다. 

 

 

 

"Live Server" 를 종료하려면  VS code 우측 하단의 "Port:5500"를 클릭한다. 

 

 

다시 "Live Server" 를 Power-On 하려면 "Go Live" 를 클릭하면 된다.