Xây dựng dashboard cho automation với n8n (NextJS + Supabase)

Xây dựng dashboard cho automation với n8n (NextJS + Supabase)

Trong quá trình làm automation với n8n, chắc nhiều anh em cũng từng gặp một vấn đề quen thuộc: workflow chạy ổn, logic ok, nhưng thiếu một giao diện tập trung để sử dụng, theo dõi và quản lý kết quả.

Mình cũng gặp tình huống đó, nên gần đây bắt đầu xây dựng một dashboard nhỏ để gom toàn bộ các tool automation mình đang triển khai trên n8n về một chỗ, giúp:

• thao tác thuận tiện hơn
• theo dõi kết quả trực quan
• ưu trữ data và trạng thái của từng tool

Kiến trúc hiện tại mình đang dùng là một combo tương đối “bất ổn” nhưng rất linh hoạt:

• n8n đóng vai trò backend cho automation & orchestration logic
• Dashboard (NextJS) đảm nhiệm phần UI, trigger workflow và hiển thị kết quả
• Supabase được dùng làm database, lưu dữ liệu đầu ra, trạng thái và metadata của các tool

Lý do mình chọn n8n làm backend ở giai đoạn này là vì:

• dễ quan sát cách tool vận hành
• chỉnh sửa và tối ưu logic nhanh
• phù hợp cho việc thử nghiệm và phát triển ý tưởng

Khi một tool đã chạy ổn định và use case rõ ràng, mình sẽ rebuild phần logic thành service riêng, tách khỏi n8n để tăng hiệu năng và độ ổn định, trong khi dashboard vẫn giữ nguyên.

Có thể coi n8n như một môi trường ươm mầm cho các ý tưởng automation, trước khi đưa chúng sang dạng production-ready.

(Combo vibe coding mình dùng để build dashboard này ở dưới 👇)