r/reactjs 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 Upvotes

3 comments sorted by

0

u/HeylAW 1d ago

Looks like one of the Sizzy Browser features, nice

-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

u/simple_explorer1 6h ago

Looks vibecoded. Why didn't you put a note that LLM built it and not you