The Browser card

Feature film0:53Mac · iPhone

Chapters

  1. 0:00localhost, out of reach
  2. 0:07Reachable on every device
  3. 0:12The Browser card
  4. 0:18A tunnel per port
  5. 0:25Synced tabs
  6. 0:32Docs on the go
  7. 0:36Servers list themselves
  8. 0:42Your logins stay yours

Your agents start dev servers on your host: the frontend on localhost:5173, an API on localhost:8787. Those addresses answer on the host and nowhere else, so from your phone on the train, localhost is out of reach.

The Browser card is your host’s localhost, on your Mac and on your iPhone. Every tab tunnels to its own port, so your frontend and your backend are open side by side. The tabs, and the one that’s open, are the same on every device: start at your desk, pick up your phone and keep going. A server your agents start lists itself on the card. Your logins stay on your device, and no agent can touch this browser.

Tips

  • ⇧⌘R reloads past the cache, for dev servers that serve stale bundles.
  • ⌘-click a favorite to open it in a new tab.
  • Give a workspace its own browser profile in Host Settings › Browser, for test accounts or a dev app whose cookies clash with another one on localhost.
  • On the iPhone, Open in Safari takes a localhost page through the same tunnel.
Transcript