반응형 작업을 할 때, 모바일 환경을 확인할 때는 크롬 개발자 도구를 통해 모바일 해상도에서 확인할 수 있다. 하지만, 모바일 디바이스를 통해 보는 것이 정확하기 때문에, 모바일로 확인할 수 있는 방법을 알아보자.
우선 Live Server 익스텐션을 설치한다. 설치 후 라이브서버를 눌러보면, 우측 뷰에 아래와 같이 나오는데, 설정 > 확장 설정을 선택한다.
상단 검색 영역에 host 를 검색하여 내 로컬 IP 주소를 보면 127.0.0.1로 되어 있다. 이 호스트를 바꿔주면 된다.
내 IP 주소를 확인하려면 아래의 단계로 확인하면 된다. 윈도우라면, 설정 > 네트워크 및 인터넷 > WIFI 로 들어가 IPv4 주소를 확인해야 한다.
맥이라면, > 시스템 설정 > Wi-Fi > 알고 있는 네트워크의 세부사항 > 네트워크 설정. 나는 맥 유저라서, 아래의 사진처럼 네트워크 설정에서 내 IP 주소를 확인할 수 있었다. 192.로 시작하는 아이피 주소를 VS code 로 돌아와 아래의 ...
![[VSCODE] 로컬 작업 중 모바일로 페이지 확인하는 방법 live server host](https://mblogthumb-phinf.pstatic.net/MjAyMzAyMTVfNDcg/MDAxNjc2NDQ3ODY1NDI4.tgW8C7Bz21tqJchz8IK2zxxRcmiGeutvVj2oluzP8vgg.BTAl-TXZfM82Y-dH--sUnnQPve854qZmhZzeFxGwVDQg.PNG.hugehomm/%BD%BA%C5%A9%B8%B0%BC%A6_2023-02-15_%BF%C0%C8%C4_4.37.01.png?type=w2)
#
live
#
에디터툴
#
반응형페이지모바일확인
#
반응형페이지모바일로확인하는방법
#
모바일해상도확인
#
vscode익스텐션
#
vscode
#
server
#
liveserverhost
#
liveserverextension
#
익스텐션
