Bạn dựng xong một app, phần lớn nhờ AI viết. Nó chạy. Nhưng ai hỏi “lúc khách thanh toán thì chuyện gì xảy ra” hay “sửa chỗ này thì hỏng chỗ nào”, câu trả lời thật lòng là không biết. Floorplan sinh ra để lấp đúng khoảng trống đó: Claude hoặc Codex đọc codebase của bạn rồi vẽ một bản đồ tương tác. Mỗi phần, mỗi file, mỗi web request đều được đặt một cái tên bằng tiếng Anh thường, và mọi kết nối giữa chúng đều được hiển thị.
Nó làm gì, cụ thể
Repo haydenschmitty/floorplan là một công cụ chạy trong Claude Code và Codex. Bạn yêu cầu vẽ floorplan, vài phút sau có một map để khám phá. Map đó zoom được nhiều tầng: từ toàn bộ app, double-click vào một phần, rồi nhóm file, rồi từng file, rồi các endpoint. Mỗi view cho biết cái gì đang dùng nó và nó đang dùng cái gì.
Phần tên gọi là chỗ tôi thấy đáng giá nhất. Nó ghi “Takes card payments at checkout” chứ không ghi “Stripe API wrapper”. Thuật ngữ kỹ thuật được giải thích khi hover, và có một công tắc chuyển sang developer view nếu bạn muốn nhìn tên thật.
Nó theo import, và khớp từng request phía frontend với endpoint server trả lời request đó, kể cả khi hai bên nằm ở repo khác nhau. Bạn cũng có thể bắt đầu từ một màn hình quen thuộc để xem mọi thứ phía sau nó: các phần, request nó gọi, code server, dữ liệu, dịch vụ bên ngoài.
Có một tính năng tôi thấy thực dụng hơn cả: Health check. Nó bắt mấy lỗi kinh điển của app do AI dựng, gồm key nằm trong code hoặc bị gửi xuống browser, bảng Supabase ai cũng đọc được, Firebase rules để mở, Stripe webhook ai cũng giả được, endpoint không cần đăng nhập. Mỗi cảnh báo kèm sẵn bản fix để paste vào. README nói rõ đây là “a check, not an audit”, tức là kiểm tra nhanh chứ không phải audit bảo mật đầy đủ.
Thêm một thứ khác: Recent work. Các card mà AI vừa sửa sẽ sáng xanh, kèm ghi chú vì sao thay đổi đó phục vụ yêu cầu của bạn. Với người làm việc cùng AI cả ngày, đây là cách nhìn lại xem nó vừa chạm vào những đâu mà không phải đọc diff.
Vì sao nó đang hot
943 sao, tạo ngày 27/10/2026 và cập nhật ngày 31/10/2026. Bốn ngày. Con số đó nói lên khá nhiều: nhu cầu có thật, và repo này bắt đúng lúc. Cả một thế hệ dev đang dựng app bằng vibe coding, code chạy được nhưng người viết không hiểu hết nó. Các công cụ vẽ diagram cũ thì hướng tới người cần trình bày hệ thống cho người khác xem, còn Floorplan hướng tới chính người sở hữu app: hiểu cái mình vừa làm và biết chỗ nào cần lo.
Điểm khác biệt nằm ở chỗ nó không dừng ở việc vẽ. Nó kiểm tra (Health check), nó theo dõi thay đổi (Recent work), và nó nhận cả PRD để vẽ blueprint cho app chưa viết. Card trong blueprint là nét đứt để phân biệt với code thật, và thay vì Health check bạn nhận một bản review những gì kế hoạch còn bỏ ngỏ.
Cài và dùng thử
README có live demo tại haydenschmitty.github.io/floorplan-demo, map thật của Brewline (app demo đặt cà phê theo gói, dựng trên bốn repo) đặt cạnh một đoạn hội thoại scripted. Không cần cài gì, mở browser là xem được. Muốn cài thật thì repo chạy trên Node.js và có hướng dẫn install riêng trong README gốc, tôi không chép lại lệnh ở đây vì bản rút gọn không có đủ. Cách dùng thì đơn giản: trong Claude Code hoặc Codex, bạn yêu cầu vẽ floorplan, công cụ đọc codebase rồi trả về map.
Vài điểm vận hành đáng biết: cập nhật chỉ đọc lại phần đã thay đổi, map đang mở tự reload. Mọi thứ chạy trên máy bạn, không có gì bị commit vào git. Map export ra được một file HTML duy nhất để gửi cho người khác. Có layout cho điện thoại và tablet với kéo và pinch, có search, keyboard shortcuts, và right-click trên mọi card.
Ai nên dùng
- Người tự dựng app bằng AI: hiểu app mình làm mà không phải đọc code. Đây là nhóm hưởng lợi rõ nhất.
- Team cần onboarding: người mới xem từ bức tranh lớn xuống tới đúng file trong vài phút.
- Người làm việc với AI hằng ngày: sau mỗi thay đổi, xem chính xác nó chạm vào phần nào và vì sao.
- Ai hay quên mình đã quên gì: chạy Health check trước khi deploy, nhất là app có thanh toán hoặc auth.
Còn nếu bạn cần vẽ diagram đẹp để thuyết trình hay viết tài liệu, đây không phải chỗ. README tự so sánh với Archify và Understand Anything, và cách phân biệt khá rõ: Archify để trình bày (10 loại diagram, export ảnh và video, vẽ được cả thứ không phải code), Understand Anything để nghiên cứu codebase lớn tới mức function, có knowledge graph từng file, function, class cùng diff impact và guided tours. Floorplan trả lời câu “app tôi đang chạy thế nào và tôi nên lo gì”. Ba công cụ dùng chung được: map bằng Floorplan, rồi dùng Archify vẽ một flow cho buổi present.
Ưu, nhược và mấy điều cần lưu ý
Ưu: ngôn ngữ thường là thứ khiến nó dễ cho người không đọc code, mà đây lại đúng là nhóm đang build app bằng AI. Theo dõi request xuyên repo là chi tiết kỹ thuật không phải tool nào cũng làm. Health check kèm fix sẵn thì tiết kiệm thời gian hơn một danh sách cảnh báo chung chung. Export một file HTML giải quyết bài toán gửi cho người không cài gì.
Nhược và điều cần cân nhắc: repo mới 4 ngày tuổi, độ trưởng thành gần như bằng không. API, format map, cách Claude hay Codex sinh ra nó đều có thể đổi. README cũng tự nhận Health check không phải audit, nên đừng dùng nó thay cho việc review bảo mật thật. Công cụ phụ thuộc vào Claude Code hoặc Codex, không có nghĩa bạn dùng Cursor hay Copilot là chạy được ngay. License MIT thì thoải mái dùng, fork, nhúng vào quy trình nội bộ.
Một nghi ngờ cá nhân: chất lượng map phụ thuộc hoàn toàn vào việc model đọc code tốt đến đâu. Codebase càng lộn xộn, khả năng map bỏ sót kết nối càng cao, và người không đọc code sẽ khó phát hiện điều đó. Dùng nó như bản đồ để định hướng, đừng dùng như nguồn chân lý duy nhất.
Nếu bạn đang có một app do AI viết và chưa từng nhìn thấy nó trông thế nào từ trên xuống, 943 sao trong bốn ngày là tín hiệu đủ để bỏ mười phút mở live demo. Repo: haydenschmitty/floorplan.
