What's a simple way to test code written locally for mobile devices?

I’m redoing by personal portfolio page so I can practice using Git and writing code locally.

Since I’m trying to design my portfolio for mobile-first, would it be simplest to push my code to GitHub, check the output on GitHub Pages on my mobile phone, and then repeat for when I make changes?

The fastest way by far to test the responsiveness of your code is just to manually resize your browser window and the page should dynamically adjust. Doesn’t matter which browser you use—and actually, you should use every browser you can, to make sure that your code renders correctly for every browser.

If you need to test something on your actual phone, the fastest way to do that is by using Gulp.js and the browser-sync package, which sets up an IP that your phone can access (assuming it’s on the same wi-fi network as your laptop).

What you suggested would be doable as well, but a lot slower than either of the methods that I just mentioned.

1 Like

Chrome’s Dev tools is great for this. Just hit ctrl + shift + j then ctrl + shift +m and pick your device. Generally when I make responsive Apps I test with the iphone5 (one of the smaller screen sizes) but check some of the others periodically. That being said, different browsers will behave differently and pushing to github and testing yourself would be prudent.

1 Like

Thanks for telling me about this. I saw it once but completely forgot; it should make my workflow much faster. I just looked at Firefox’s dev tools and I see that it has this feature as well. Cheers.