Need some help.
I would like to be able to vide my coded site on mobile before i published it to my domain.
Because the site is builot locally, it only works on my computer i devloped it on…
How can I see my changes on mobile as i build this out?
you can try this site otherwise chrome dev tools have some tools when you inspect
The easiest way to see your site on a mobile viewport is to adjust the browser width. Then you will be able to see the breakpoints you’ve set to adjust the design. In your browser you can also press CTRL+Shift+M (Firefox) to select different view port configurations.
Thank you,
Ok im a bit confused here, first question, lets say I shrink the view port down to mobile view, if i make the changes in this setitng, do they only afftect the mobile view, or will the desktop view lok different because the css / html was modified?
Can someone explain to me how this works please?
You use media queries in your css to set the breakpoints. Rules inside these media queries will trigger when a screen size you specified is detected. There are few approaches to this. You can make the desktop or mobile version first, and then start adding in media queries to make css rules apply when the viewport is at certain sizes (break points).
You have a desktop site so you could use the device emulator within the browsers dev tools to emulate the size of other devices you are wanting to work with your device. For example you could view your site through a iPhone 14 viewport to see what happened to your layout and start creating media queries to fix the issue.
Another approach is called “mobile first” since typically a mobile site is smaller and more simple since it has less space for components. Then use media queries to allow for more complex layouts if the user is on a larger device with more real-estate to work with.
You can read more about this here to get an overview.
Hi,
You could browse to your server if your mobile user the local Wi-Fi.
Development servers such as for React need to allow access to other devices. I do not remember the commands but there are options to do that. I did it a few years back.
I actually found a picture I took. You can see the localhost on the computer and the IP address to the computer on the mobile.
You could also install a dedicated dev server (I mean Apache, IIS, Nginx, you name it… [can be a container]) where you’d deploy so that you could control yourself any security rule.
Cheers.