How to Test your web frontend design in mobile device via VS code?

In the process of website design, testing plays an important role before the deployment so that we can ensure it works and looks as you expect. VS code is a good development tool, and we can use its extension Live Server to go through the website for review.

We would like to share a great function that we are able to review the frontend directly through your mobile devise instead of only browsing it through your web browser in laptop or PC by adding few lines and taking few actions.

Step 1: install live server from extension tab.

Step 2: Follow the path of file/ preference/ setting and enter live server. You can see Live Server Config tab.

Step 3: In tab of Live Server Config, you can see multiple hyperlinks of Edit in settings.json, enter any of them and add the following lines.

"liveServer.settings.useWebExt": true

Step 4: Go to command line (CMD) and enter ipconfig. You can see the IP address, which is the one you should use in you mobile device (192.168.XXX.XXX:5500).

Thank you!