Claude Skill MartKhám phá skillCâu dùng ngayHọc qua videoDùng terminalSkill là gì?
← Về danh sách

Reticle — Kiểm chứng web app từ bên trong

Thay vì đoán qua ảnh chụp màn hình, skill này cắm SDK vào app đang chạy để kiểm tra DOM, network, console, state và đưa ra phán quyết kèm `file:line` cần sửa.

Lập trìnhTrung cấp★ 1,153⑂ 169Điểm AI 9/10Cập nhật lần cuối: 3 thg 10, 2026

Làm được gì

  • Nhúng SDK chế độ dev vào app đang chạy và mở ra các công cụ MCP reticle_* để Claude quan sát, tác động và khẳng định trực tiếp trên app thật.
  • Một lệnh npx @reticlehq/server init tự nhận diện framework, package manager, cấu hình build, cài SDK, đăng ký MCP server và mở trình duyệt.
  • Chạy trọn một luồng người dùng thật rồi tạo verdict qua reticle_act_and_wait, reticle_assert hoặc reticle_act { steps } có khai báo expect.
  • Không cho phép coi unknown hay no-fault là "pass", và nghiêm cấm làm nhẹ điều kiện kiểm tra để vượt qua.
  • Ghi lại luồng để phát lại (reticle_flow_replay) mà không cần model, giúp kiểm tra hồi quy rất rẻ.

Phù hợp với ai

  • Lập trình viên web (React, Next.js, Vue...) để Claude Code tự sửa UI.
  • Nhóm thường gặp cảnh "test xanh nhưng giao diện hỏng".
  • Tech lead muốn có bằng chứng thay vì lời tuyên bố "đã xong".

Ví dụ sử dụng

  1. Thiết lập lần đầu: yêu cầu "cài Reticle" → chạy init, sau đó khám phá và ghi lại một luồng với persona cụ thể.
  2. Kiểm tra tác động thay đổi: sau khi sửa src/App.tsx, gọi reticle_verify({action:"change", files:[...]}) để nhận phán quyết trong một lượt.
  3. Chứng minh tính năng mới: khẳng định đồng thời POST /api/refund trả 200 với số tiền đúng, phần tử hoá đơn xuất hiện và không có lỗi console — loại bỏ kiểu "UI chỉ hiển thị lại dữ liệu vừa gửi".

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

Dùng thử ngay, không cần cài

Dán đoạn dưới vào Claude là dùng được skill này mà không cần cài đặt.

Hãy đọc hướng dẫn trong tệp này và làm theo để giúp mình:
https://raw.githubusercontent.com/reticlehq/reticle/HEAD/plugin/SKILL.md

Mình muốn: (viết việc bạn cần ở đây)

Nếu Claude không mở được liên kết, hãy mở liên kết và copy nội dung vào rồi dán.

↓ Thấy hữu ích thì tải ZIP bên dưới và cài. Sau đó skill tự chạy, không phải dán lại mỗi lần.

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 plugin từ repo GitHub reticlehq/reticle vào ~/.claude/skills/reticle/ 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/reticlehq/reticle.git /tmp/reticle && mkdir -p ~/.claude/skills/reticle && cp /tmp/reticle/plugin/SKILL.md ~/.claude/skills/reticle/SKILL.md

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

  1. Clone repo: git clone https://github.com/reticlehq/reticle.git /tmp/reticle
  2. Tạo thư mục skill: mkdir -p ~/.claude/skills/reticle
  3. Sao chép file: cp /tmp/reticle/plugin/SKILL.md ~/.claude/skills/reticle/SKILL.md
  4. Mở Claude Code ngay trong thư mục dự án web cần kiểm chứng.
  5. Nhập "cài và thiết lập Reticle" hoặc /reticle.
  6. Khi Claude xin phép chạy npx @reticlehq/server@latest init, hãy đọc kỹ rồi phê duyệt (lệnh này đăng ký MCP server và ghi quy tắc pre-approval).
  7. Đảm bảo package.json có script dev; cung cấp biến môi trường cần thiết bằng --env KEY=VALUE.
  8. Nếu có license key, đưa cho Claude nhưng phải kiểm tra .env đã nằm trong .gitignore.
Xem mã nguồn trên GitHub ↗Giấy phép: NOASSERTION