Claude Skill MartKhám phá skillSkill là gì?
 
← Về danh sách

Thêm Dashboard cho NanoClaw

Skill gắn một dashboard giám sát cục bộ vào dự án NanoClaw để xem agent, session và lượng token sử dụng.

Lập trìnhTrung cấp★ 30,471⑂ 12,865Điểm AI 7/10Cập nhật lần cuối: 9 thg 8, 2026

Làm được gì

Skill cài gói npm @nanoco/nanoclaw-dashboard và thêm module "pusher" (src/dashboard-pusher.ts) để định kỳ thu thập dữ liệu từ DB và file log của NanoClaw rồi đẩy sang dashboard: snapshot mỗi 60 giây, log mỗi 2 giây. Việc tích hợp chỉ cần chèn đúng một khối code (dynamic import + gọi startDashboard()) vào main() trong src/index.ts.

Điểm đáng chú ý là hai bài test đi kèm: test hành vi gửi snapshot thật tới một dashboard giả, còn test wiring dùng AST của TypeScript để kiểm tra khối code có nằm đúng vị trí (sau khi khởi tạo DB, trước log báo boot xong). Nếu thiếu DASHBOARD_SECRET, dashboard tự động không chạy nên không ảnh hưởng production.

Phù hợp với ai

  • Người tự host NanoClaw muốn quan sát agent group và trạng thái session
  • Người vận hành cần theo dõi token, tỷ lệ cache hit và mức dùng context window
  • Trường hợp debug cần xem log real-time có bộ lọc theo level
  • Lập trình viên muốn học mẫu tích hợp tối giản, dễ tháo bỏ

Ví dụ sử dụng

  1. Yêu cầu "thêm dashboard" → skill cài package, copy pusher, chèn khối code, tạo secret trong .env, rồi bạn mở http://localhost:3100/dashboard.
  2. Điều tra vì sao session liên tục cạn context → xem thanh context usage ở trang Sessions và biểu đồ token ở Overview.
  3. Khi không cần nữa: yêu cầu gỡ bỏ → xoá file, uninstall package, dọn khối code trong index.ts và biến môi trường, build lại.

· · · Hướng dẫn cài đặt · · ·

Cài vào ứng dụng Claude (không cần terminal)
  1. Tải tệp ZIP bằng nút bên dưới.
  2. Trong Claude, mở Settings → Capabilities và bật 'Code execution and file creation'. (chỉ một lần)
  3. Vào Customize → Skills → + → 'Upload a skill' rồi tải tệp ZIP lên.
↓ Tải ZIP
Cài vào Claude Code

Để Claude làm — dán câu dưới đây vào Claude Code

Hãy cài skill mình tìm thấy trên Claude Skill Mart.
Copy thư mục .claude/skills/add-dashboard từ repo GitHub nanocoai/nanoclaw vào ~/.claude/skills/add-dashboard/ của mình.
Sau khi cài xong, cho mình biết skill này làm được gì trong một câu.

Cài bằng lệnh thủ công

git clone https://github.com/nanocoai/nanoclaw.git && mkdir -p ~/.claude/skills && cp -r nanoclaw/.claude/skills/add-dashboard ~/.claude/skills/

⚠ Đây là skill do người khác tạo. Hãy kiểm tra repo gốc trước khi cài.

  1. Mở terminal và clone repo NanoClaw: git clone https://github.com/nanocoai/nanoclaw.git
  2. Copy skill vào thư mục skill của Claude Code: mkdir -p ~/.claude/skills && cp -r nanoclaw/.claude/skills/add-dashboard ~/.claude/skills/ (bỏ qua nếu bạn đang làm việc ngay trong dự án NanoClaw).
  3. Chạy Claude Code tại thư mục gốc của dự án NanoClaw.
  4. Gõ /add-dashboard hoặc yêu cầu "thêm dashboard giám sát".
  5. Kiểm tra pnpm install @nanoco/nanoclaw-dashboard đã chạy và 3 file pusher đã được copy vào src/.
  6. Xác nhận .env có DASHBOARD_SECRET (sinh ngẫu nhiên) và DASHBOARD_PORT=3100.
  7. Chạy pnpm run build trước, sau đó pnpm exec vitest run src/dashboard-pusher.test.ts src/dashboard-wiring.test.ts (giữ đúng thứ tự vì build mới xác minh dependency).
  8. Restart service rồi mở http://localhost:3100/dashboard trên trình duyệt.
Xem mã nguồn trên GitHub ↗Giấy phép: MIT