r/reactjs • u/alazartesema • 1d ago
Needs Help I built a dev tool that shows mobile, tablet, and desktop simultaneously in your browser: synced scroll, click, and input across all three
Been using Responsively App for a while but the context
switching was getting to me — separate window, separate
process, alt-tab constantly.
Built responsive-dx to solve it. It's an npm dev dependency
that injects a synchronized multi-viewport panel directly
into your localhost.
One command to set it up:
npx responsive-dx init
It detects your framework automatically (Next.js, Vite,
Remix, Astro, Gatsby) and adds the component to your layout
file. Nothing to configure manually.
What it does:
- Mobile, tablet, and desktop frames side-by-side
- Scroll one → they all scroll (real DOM sync, not emulation)
- Click syncs, input syncs, dark/light theme syncs
- Focus mode: one click to zoom any single frame
- iPhone notch on mobile, macOS chrome on desktop
The frames load any localhost URL — so even though the
wrapper is React, it works for Vue, Svelte, Angular, Rails,
Django, whatever you're running locally.
Zero dependencies. Tree-shaken out of production builds
completely.
GitHub: https://github.com/respodx/respo
npm: https://www.npmjs.com/package/responsive-dx
Happy to answer any technical questions.
-1
u/Over_Expert2858 1d ago
Been stuck with Responsively for ages, the alt-tab dance is real. The scroll sync across real DOM is the bit that sells it for me, most tools fake it with iframes and it never feels right. Will give it a spin on a Vite project later.
1
0
u/HeylAW 1d ago
Looks like one of the Sizzy Browser features, nice