r/rrweb

I vibe coded Tugboat — an embeddable beta-feedback widget (screenshots, screen recording w/ voice, session replay).
▲ 3 r/rrweb+2 crossposts

I vibe coded Tugboat — an embeddable beta-feedback widget (screenshots, screen recording w/ voice, session replay).

Everyone's vibe coding something but not many are thinking about how they'll actually hear from the people using it. So I went back to basics and built a simple way for builders to capture feedback from their end users. I made it free for most projects, hoping it helps forward the cause.

Tugboat is a drop-in feedback button for new apps. You paste one `<script>` tag, and your testers get a floating button that captures screenshots, screen recordings (with mic narration), voice notes, and/or text. It's all automatically bundled with console logs, network errors, and a full session replay of what the user was doing. It all lands in a dashboard where you triage it or push it to Jira. I also include a changelog in the widget for curious users who want to track updates.

Basically: the messy "hey the thing is broken" DM from a tester now turned into a structured bug report with everything a dev needs to reproduce it. I build and ship often and now I include Tugboat in all my projects to gather feedback from early users.

The stack / tools:

- Frontend: React + Tailwind + shadcn/ui. Simple brutal design system

- Backend: FastAPI (Python) + MongoDB.

- The widget itself: pure vanilla JS, no framework.

- Session replay: [rrweb](https://github.com/rrweb-io/rrweb).

- Storage: object storage for media. Email Notifications: Resend. Payments: Stripe. Auth: JWT + Google OAuth.

Build insights-

  1. The widget had to be framework free. It gets injected into someone else's site, so it can't assume React exists or clobber their globals. It's ~1,000 lines of vanilla JS that builds its own shadow-ish DOM, scopes all styles under one root ID, and reads config from a `data-project-key` attribute. Discipline over convenience.
  2. Session replay is DOM events, not video. rrweb records DOM mutations + input as structured JSON, so a full replay is ~2–3MB instead of a 50–200MB screen video. That one detail is the difference between "this scales" and "this bankrupts me on storage."
  3. A non-technical lesson: I almost kept adding features forever. The honest realization was that a deployed, working product doesn't need more features it needs its first users. So I'm shipping and letting demand pull the roadmap.

Try it here: https://tugboatapp.com/

Happy to go deeper on any of these. Would appreciate any feedback.

u/smackd40 — 1 day ago