I built a desk setup cable planner with Flutter Web — here's what I learned

I hate planning desk setups. Every time I buy a new monitor or dock, I spend 20 minutes Googling "does USB-C carry DisplayPort signal" or "can I daisy-chain these two monitors." So I built a tool to do it for me. DeskFlow — a browser-based diagram tool where you drag equipment onto a canvas, click ports to connect them, and instantly see whether the cable is physically possible + what to buy. What it does Drag equipment from a library onto a canvas Click two ports to connect them — compatibility is checked automatically Incompatible connections are rejected (e.g. HDMI out → DP in via passive adapter is blocked, two bidirectional power ports can't connect to each other) Shopping list panel auto-generates with cable names and prices from a DB Stack Flutter Web — single codebase deployed as a web app without learning a JS framework Supabase — equipment DB (33 devices, 11 cable types). anon key only, all reads. No auth needed. Vercel — static hosting with a vercel.json rewrite rule for SPA