Visual Studio Code 자체 웹서버 html 코드 테스트

html 페이지 만으로 테스트하고 싶은 경우가 있어요

nodejs나 python flask를 이용해서 서버를 만들어서 할 수도 있지만 화면만 담당하는 사람에게는 필요 없는 경우도 있어요

또는 아주 간단한 페이지를 만들어서 테스트하려는 경우에도 유용하게 쓸 수 있습니다

 

사실 파일을 그냥 크롬에서 열어도 되는 경우가 많은데요

가끔 웹서버 환경에서 동작해야 잘 작동하는 경우도 있어서 한 번만 이렇게 설치해두면 좋아요

 

Visual Studio Code 에서 확장 프로그램 설치 화면으로 오세요

왼쪽에서 확장프로그램 아이콘이 있어요

 

live server 라고 검색해서 설치하세요

웹서버에서 보고 싶은 파일을 오른 클릭해보세요

 

그럼 Open with Live Server 메뉴를 누르면 웹서버가 실행됩니다

 

하단에 포트 정보 5500이라고 나오는데요

이 부분을 누르면 서버를 정지시킬 수 있어요