Làm app cùng AI agent

Giao diện

Thông tin kiểm chứng ngày 2026-10-24T00:00:00.000Z

Skill ​

Skill (kỹ năng) là một thư mục có file SKILL.md: hướng dẫn (và có thể kèm script) cho một việc cụ thể. Agent chỉ nạp nội dung đầy đủ khi việc đó xuất hiện.

Giải quyết vấn đề gì ​

Có những quy trình bạn muốn agent làm đúng một cách, lần nào cũng vậy: dựng khung app bằng đúng lệnh đã kiểm chứng, tự kiểm tra app trên trình duyệt trước khi báo xong, viết changelog theo mẫu công ty.

  • Nhét hết vào CLAUDE.md thì file phình to, mọi phiên đều phải đọc dù không cần.
  • Gõ lại trong prompt mỗi lần thì dễ quên bước, dễ lệch tham số.

Skill giải quyết cả hai: agent chỉ thấy description (một dòng) cho tới khi cần, rồi mới nạp toàn bộ hướng dẫn.

Khi nào cần ​

  • Một việc bạn đã giải thích cho agent lần thứ hai.
  • Một lệnh dài, nhiều tham số, sai một chữ là hỏng (ví dụ lệnh scaffold).
  • Một quy trình có thứ tự bước cố định và tiêu chí kết thúc rõ (ví dụ kiểm tra app).
  • Muốn đóng gói kinh nghiệm cho cả nhóm dùng chung: commit thư mục skill vào repo.

Vị trí trong Claude Code:

Phạm viĐường dẫn
Dự án.claude/skills/<name>/SKILL.md
Cá nhân~/.claude/skills/<name>/SKILL.md
Trong plugin<plugin>/skills/, gọi bằng /plugin:skill

Trùng tên thì thứ tự ưu tiên: enterprise > personal > project. Thư mục con lồng nhau cũng được.

Frontmatter: mọi trường đều tùy chọn. description được khuyến nghị (agent dựa vào nó để biết khi nào dùng), name mặc định bằng tên thư mục. description cộng when_to_use tối đa 1.536 ký tự.

Ví dụ tối thiểu ​

Starter có hai skill. practice/starter/.claude/skills/scaffold-app/SKILL.md đóng gói một lệnh dài đã chạy thử:

markdown
---
name: scaffold-app
description: Dựng khung app (Better-T-Stack + bun + SQLite) vào thư mục hiện tại. Dùng khi repo chưa có package.json và cần bắt đầu viết code app.
---

# Dựng khung app

1. Kiểm tra: thư mục gốc chưa có `package.json`. Có rồi thì dừng, báo người dùng.
2. Chạy đúng lệnh này (không đổi tham số, đã được kiểm chứng):
   bunx create-better-t-stack@3.49.0 create . --frontend tanstack-router --backend hono ...
3. `bun run db:push` rồi `bun run check-types`. Cả hai phải pass.
4. Kiểm tra `CLAUDE.md`, `AGENTS.md`, `.claude/` vẫn còn nguyên.
5. Commit: `chore: scaffold app với Better-T-Stack`.

(Lệnh đầy đủ ở file gốc; ở đây rút gọn.) Để ý description nói cả làm gì lẫn khi nào dùng ("khi repo chưa có package.json"). Đó là câu agent đọc để quyết định có gọi skill hay không.

practice/starter/.claude/skills/verify-app/SKILL.md là kiểu skill quy trình:

markdown
---
name: verify-app
description: Tự kiểm tra app sau khi làm xong một tính năng - typecheck, test, chạy app và thao tác thật trên trình duyệt. Dùng trước khi báo hoàn thành bất kỳ tính năng nào có giao diện.
---

1. `bun run check-types` và `bun test`. Hỏng thì sửa trước, chưa đi tiếp.
...
4. Dùng Playwright MCP (hoặc Chrome DevTools MCP) mở http://localhost:3001:
   - Làm đúng luồng của tính năng vừa viết, bằng dữ liệu thật.
   - Chụp màn hình kết quả.
   - Xem console có lỗi đỏ không.
5. Báo lại: đã thử luồng nào, kết quả ra sao, kèm ảnh chụp. Có gì lạ thì nói thẳng.

Skill này dùng MCP trình duyệt, và được AGENTS.md nhắc tới trong định nghĩa "xong". Ba khối nền ráp với nhau như vậy.

Gọi skill: agent tự gọi khi thấy khớp description, hoặc bạn gõ thẳng tên, ví dụ "dùng skill scaffold-app".

Bên Codex ​

Skill của Claude Code theo chuẩn mở Agent Skills (agentskills.io). Codex dùng cùng chuẩn, nên một SKILL.md viết tốt dùng được cho cả hai. Khác biệt:

  • Vị trí: .agents/skills (repo), $HOME/.agents/skills (user), /etc/codex/skills (admin).
  • Codex bắt buộc có cả name lẫn description. Viết đủ hai trường thì chạy được ở cả hai tool.
  • Gọi: $skill-name hoặc /skills; Codex cũng tự gọi theo description. Có sẵn $skill-creator và $skill-installer.

Starter chỉ đặt skill ở .claude/skills. Muốn Codex dùng chung thì chép (hoặc link) sang .agents/skills.

Nguồn ​