Solaiman Kmail

Responsive Viewer - View multiple screen dimensions in one view

A Chrome extension to show multiple screens in one view. the extension will help front-end developers to test multiple screens while developing responsive websites/applications.

Add a comment

Replies

Best
Kunal Bodke
Super helpful! A good replacement for Sizzy for people like me who cannot afford it.
Bruno Lemos
@kunalbodke Do you really can't afford $7 or you just don't wanna pay for other people products?
Ross Waycaster
@brunolemos that's a little harsh. Sizzy's cheapest plan, for instance, is $7 per month or $60 a year. Nothing wrong with using an open source replacement if it does what you need it to do.
Kunal Bodke
@brunolemos I meant to say I cannot justify paying for Sizzy. But I see how you look at people. So, my rational is since I am not reviewing coded designs every week or month. Our release cycles are quarterly.
Bruno Lemos
@kunalbodke “I cannot justify based on my low usage” is a more honest take than “I can’t afford”. 👍
Kunal Bodke
@brunolemos yeah, typed too fast, without thinking a lot about it. ;) I was just excited this thing is out there!
Ken Sim
Awesome! Used it right away and love the ability to create new user agents. The one issue I ran into was the new screen I created was not saved. Once I closed the tab, went back to the web page I am working on and reopen the viewer the screen I added was no longer in the viewer. I had to recreate the screen again. This can become problematic when working on a project that is focusing on specific viewports that are not provided in the default list you provide.
Solaiman Kmail
@kwsim thanks for your review glad that you loved it, I will fix the other the reported bugs and let you know from this page.
Emile Pretorius
Very nice @solaimankmail! Immediately put to use. Just one thing you may want to change - the page title is still called React App.
Solaiman Kmail
@emiledpretorius Thanks, I pushed a new version of the extension and it's under review , must be available in few days.
Jensen Chen
It's helpful for QA and front-end programmer
Francoo
Hello there, what about firefox ?
Solaiman Kmail
@francoolaami Hi, I built this project few months ago, I'm planning to refactor the code little bit to support firefox soon.
Francoo
@solaimankmail please do, many of us (and even more in tech scene) are separating form chrome/chromium.
Francoo
@solaimankmail why do you need so much persmissions ? http://imgur.com/hRuwruL
Solaiman Kmail
@francoolaami these permissions required to make it able to show any website inside the iframe. first permission: is to modify websites header inside the iframe to remove x-options header. 2: some websites refused to open after first visit from the action and it fixed by clearing the service works. 3. I think it's a basic permission. 4. this is required to access tabs api to create new tab of the extension. 5. it is required to detect when navigation occurs to and to carry the user agent to next page. hope this clarify. also you can checkout the source code on github https://github.com/skmail/respon...
Anneliese Herbosa
This looks awesome. Are there any notable differences between this and Chrome’s native responsive viewer within DevTools? At a glance I see the ability to view a page across different sizes for side-by-side comparison, but let me know if anything else!
Solaiman Kmail
@herbosa Thanks, there's no difference in the rendering side, the main difference is the ability to show multiple screens in one view, there are more features I'm working on and will be released soon.
Sotiris Valogiannis
While it could be useful for a quick review, the rendering could be really different in the actual device, especially in iOS Safari.
Solaiman Kmail
@vsotiris That's right, the extension depends on the user-agent to display the page since it's impossible to emulate other browser rendering engines without using third-parties or actual devices.
Keyul
Super time sever for developers and tester to create responsive site
Ram
Amazing Work @solaimankmail :) Tried it and loved it... Keep up the great work, any clue on what's on your roadmap for Responsive Viewer. As of now, it looks awesome...cheers
Solaiman Kmail
@ramkumarhq Thanks, a new update available now with sync scrolling, sync clicks & elements search & inspector.
Sahil Vhora
Great product! Please sync the link in all the devices so when I navigation from one page to another it reflects in all the devices. That would be great feature.
Solaiman Kmail
@sahil_vhora Thanks, a new update is available to sync clicks & scrolling, will add sync navigation in the next update.
Alejandro León
❤️Thank you! This is super helpful.
Jorge Dieguez
Such an awesome tool! Thank you!
Ali Bulut
very plain and straightforward. It would be great if you added browser supports.
Solaiman Kmail
@alibulut thanks, it's available now on firefox.
Francoo
in my some years of web product u have not seen responsive emulation (not even in dev tools) that takes some height for the regular bars of our browsers. No one as a a bazel free browser, why not aknowledge that in the renderings ?
Chris Dima
This is really awesome and will save me a ton of time. I can't believe it's the real page rendered right there — scrollable! It would be great as a tool to sync across teams.
Solaiman Kmail
@chrisdima thanks, this feature on the road map and will be available in the next update.
TIMUR MAMEDOV ☞ 𝙫𝙚𝙚𝙙.𝙞𝙤
wow that's really great. Using this now :)
Vivek Ramachandran
Nice Idea. Really solving the pain of checking with mutiple responsive checking... Keep up to date @all
Vivek Ramachandran
Update with More Device Screens to check the responsive in One Click