<aside> <img src="/icons/cursor-click_blue.svg" alt="/icons/cursor-click_blue.svg" width="40px" /> 빠른 이동을 원하시면, 아래 키워드를 클릭하세요!
</aside>
vscode에는 개발환경을 조금 더 효율적으로 바꿔줄 수 있는 다양한 extension들이 존재합니다. 우리는 그 중에서 Live Server라고 하는 것을 설치할거예요. Live Server는 코드를 수정하고 저장하면 해당 코드와 연결되어 있는 페이지를 자동으로 새로고침해서 수정 사항이 바로 반영될 수 있도록 도와주는 extension입니다.
먼저 extensions 메뉴로 들어가주세요.
그리고 검색창에 "Live Server"라고 입력하시면, 몇개의 extension들이 보일겁니다.
그 중에서 우리는 사진과 같은 extension을 설치 해줄 겁니다. 바로 설치가 완료될 수도 있고, restart required라는 메세지가 나올 수도 있습니다. 그러면 vscode를 껐다가 다시 실행 시켜 주시면 됩니다.
설치가 완료 되셨다면, Live Server로 열고자 하는 파일로 이동해 우측 하단에 있는 Go Live 버튼을 눌러 주시거나
혹은 파일을 오른쪽 클릭해서 보이는 메뉴 중, Open With Live Server라는 메뉴를 클릭해 주시면 됩니다.
라이브 서버를 사용해서 페이지를 열면 주소창에 localhost라는 문자가 나옵니다. 이 localhost는 사용자의 컴퓨터 자체를 가리키는 ip 주소, 127.0.0.1과 같은 주소를 의미합니다.