Bài tập thực tế: thêm dark mode cho một Next.js dashboard.
- Liệt kê các built-in tool của Claude Code và mục đích của mỗi cái
- Mô tả cách Claude Code orchestrate nhiều tool để giải task phức tạp
- Đoán trước được tool Claude sẽ dùng cho một prompt cụ thể
- Phân biệt "task đơn giản 1-tool" với "task phức hợp cần orchestration"
- Nhận ra dấu hiệu Claude đang đi sai tool strategy
Claude Code có những tool gì sẵn?
Claude Code đi kèm một bộ built-in tool bao quát 90% task developer thường làm. Đây là 10 tool cốt lõi:
Phân loại theo cách dùng
| Tool | Dùng cho | Tần suất Claude dùng |
|---|---|---|
| Read | Đọc file đã biết path | ⭐⭐⭐⭐⭐ (mọi task) |
| Grep | Tìm pattern trong code | ⭐⭐⭐⭐⭐ |
| Glob | Tìm file theo pattern | ⭐⭐⭐⭐ |
| Edit | Sửa text cụ thể trong file | ⭐⭐⭐⭐⭐ |
| Write | Tạo file mới hoặc viết lại toàn bộ | ⭐⭐⭐ |
| Bash | Chạy command (test, install, git) | ⭐⭐⭐⭐ |
| MultiEdit | Sửa nhiều chỗ trong cùng file | ⭐⭐ |
| WebFetch | Lấy nội dung từ URL cụ thể | ⭐⭐ |
| WebSearch | Search Google cho thông tin mới | ⭐ |
| TodoWrite | Quản lý task list nhiều bước | ⭐⭐ |
┌────────────────────────────────────────────────────────────┐ │ │ │ 🔍 DISCOVERY ✏️ MODIFICATION │ │ ├── Glob — tìm file ├── Write — tạo file │ │ ├── Grep — tìm pattern ├── Edit — sửa 1 chỗ │ │ └── Read — đọc file └── MultiEdit — sửa nhiều │ │ │ │ ⚙️ EXECUTION 📋 ORGANIZATION │ │ ├── Bash — chạy shell ├── TodoWrite — task list │ │ └── BashOutput — đọc stdout └── Agent — subagent │ │ │ │ 🌐 EXTERNAL │ │ ├── WebFetch — fetch URL │ │ └── WebSearch — search web │ │ │ └────────────────────────────────────────────────────────────┘
Điều thực sự mạnh: Orchestration
Có tool tốt thôi chưa đủ. Cái làm Claude Code thực sự mạnh là khả năng kết hợp tool thông minh để giải task đa bước.
Ví dụ: Refactor rename function
Prompt: "Rename function getOldUserData thành getUserProfile khắp codebase."
Orchestration thực tế của Claude:
7 tool call trong 30 giây. Con người làm thủ công dễ miss 1-2 call site → bug runtime 2 tuần sau.
Bài học: Orchestration quan trọng hơn từng tool
Một coding assistant có 50 tool nhưng không biết kết hợp = vô dụng. Claude Code có 10 tool nhưng orchestrate xuất sắc = làm được việc lớn.
┌──────────────────────────────────────────────────────────┐ │ │ │ Bước 1: Grep "getOldUserData" │ │ → Tìm được 14 call site ở 8 file │ │ │ │ Bước 2: Read 8 file đó │ │ → Hiểu context, verify đúng function cần rename│ │ │ │ Bước 3: Edit function declaration │ │ → Ở lib/users/get-user.ts │ │ │ │ Bước 4: MultiEdit 14 call site │ │ → Ở 8 file │ │ │ │ Bước 5: Grep lại "getOldUserData" │ │ → Verify 0 kết quả (đã clean hết) │ │ │ │ Bước 6: Bash "npm run typecheck" │ │ → Xác nhận không có type error │ │ │ │ Bước 7: Bash "npm run test" │ │ → Test pass │ │ │ └──────────────────────────────────────────────────────────┘
Ví dụ thực chiến: Một session 5 phút với Claude Code
Tình huống
Bạn có repo uigen (sẽ cài ở Bài 4.5). Mở Claude Code trong repo đó.
Session
You: Xem project này là gì, tech stack, flow chính.
Claude:
[Read] package.json
[Read] README.md
[Glob] src/**/*.{ts,tsx} → 47 file
[Read] src/app/page.tsx
[Read] src/lib/prompts/generation.tsx
Đây là uigen — web app Next.js 14 dùng Claude API để generate
React component từ prompt người dùng. Tech stack:
- Next.js 14 (App Router)
- Prisma + SQLite (persistence)
- Anthropic SDK (gọi Claude API)
- Tailwind CSS
Flow chính:
1. User nhập prompt "tạo cho tôi một pricing card"
2. Frontend gọi /api/generate
3. Backend call Claude API với system prompt template
4. Response stream về UI real-time
5. Code được lưu vào SQLiteSession
5 phút, 8 tool call, thay đổi đáng kể. Dev người làm thủ công: tìm file (5p) + đọc hiểu (10p) + suy nghĩ thêm gì (15p) + test (10p) = 40 phút.
You: Có vẻ prompt template trong generation.tsx hơi chung chung.
Làm cho nó generate component đa dạng style hơn.
Claude:
[Read] src/lib/prompts/generation.tsx (chi tiết)
Prompt hiện tại chỉ nói "create a React component" rồi thôi.
Tôi đề xuất thêm:
1. Diversity directives (style variants)
2. Examples để Claude có "taste"
3. Anti-patterns để tránh output boring
Muốn tôi proceed không?
You: Yes.
Claude:
[Edit] src/lib/prompts/generation.tsx
+ Thêm 15 dòng diversity directives
+ Thêm 3 example outputs khác style
[Bash] npm run dev
[Bash] curl localhost:3000/api/generate -d '{"prompt":"pricing card"}'
✅ Test OK. Output giờ có warm sunset gradient (orange-pink),
asymmetric layout. Khác hẳn "purple-blue" mặc định.Case studies theo ngành
💼 Sales Engineering — Custom demo nhanh
Trước: "Khách hỏi 'demo feature X được không?' — dev lead phải fork repo, hack demo, deploy. 2 ngày."
Với Claude Code orchestration:
🏭 DevOps — Audit Kubernetes manifest
Trước: "30 manifest files, cần check security best practice. Thủ công 1 tuần."
Với Claude Code:
🎮 Game Development — Bug triage từ Steam review
Trước: "QA đọc 500 Steam review/tuần, chia loại, tạo ticket. 2 ngày."
Với Claude Code:
🏥 Health Tech — Generate FHIR schema từ sample
Trước: "Có 50 JSON sample từ EHR partner, phải tự tay viết FHIR resource schema. 1 tuần."
Với Claude Code:
- Glob + Read hiểu codebase
- Bash fork + checkout branch
- Edit hack config cho demo
- Bash deploy preview
- Kết quả: 2 ngày → 2 giờ, win nhiều deal hơn
- Glob tìm *.yaml
- Read từng file
- Cross-check với OWASP K8s checklist
- Output report markdown với ưu tiên
- Kết quả: 1 tuần → 4 giờ
- WebFetch Steam review page
- Classify (bug vs feature vs praise)
- Match với codebase bằng Grep key terms
- Write ticket draft cho Jira
- Kết quả: 2 ngày → 3 giờ
- Read tất cả sample
- Infer schema pattern
- Write schema files
- Bash validate với FHIR validator
- Iterate
- Kết quả: 1 tuần → 1 ngày, coverage 95%
Anti-patterns: Khi Claude orchestrate sai
❌ Claude skip gather context, đi thẳng vào code
Biểu hiện: bạn vừa gõ prompt, Claude Write file ngay không Read hay Grep gì. Thường xảy ra với prompt mơ hồ.
Tại sao sai: Không hiểu context → output thường không fit codebase.
Cách đúng: Prompt rõ "Đọc các file liên quan trước, plan, rồi hỏi tôi approve." Hoặc dùng Planning Mode (Bài 4.7).
❌ Claude đọc QUÁ nhiều file trước khi action
Biểu hiện: bạn hỏi task nhỏ, Claude Read 40 file. Tốn token, chậm.
Tại sao sai: Có thể prompt không cung cấp đủ scope, Claude "paranoid" đọc hết.
Cách đúng: Giới hạn scope trong prompt: "Chỉ nhìn vào @src/features/billing/..."
❌ Claude stuck trong loop Grep → Read → Grep → Read
Biểu hiện: 15 tool call, vẫn chưa action. Claude bị lạc.
Cách đúng: Esc interrupt. Cho Claude context cụ thể hơn (file cụ thể hoặc description chi tiết hơn).
❌ Bạn tin Claude "đã làm" mà không verify
Biểu hiện: Claude bảo "done" → bạn commit và push — nhưng thực tế test fail Claude không report.
Cách đúng: Luôn verify — đọc diff, chạy test độc lập, mở app. Claude Code có khi over-claim success.
Mẹo nâng cao
Mẹo 1: Prompt để Claude "suy nghĩ trước hành động"
Pattern này = Planning Mode manual. Giúp bạn kiểm soát token spend.
Mẹo 2: Giới hạn scope rõ ràng
Trước khi edit file nào, show cho tôi plan:
1. Files you'll read
2. Files you'll modify
3. Tests you'll run
Đợi tôi approve rồi mới execute.Mẹo 2: Giới hạn scope rõ ràng
Mẹo 3: Hỏi Claude list tool cho task
Chỉ làm việc trong @src/features/auth/. Đừng touch file ngoài thư
mục này. Nếu thấy cần sửa file khác, liệt kê cho tôi xem thay vì
tự sửa.Mẹo 3: Hỏi Claude list tool cho task
Giúp bạn học cách Claude "nghĩ".
Cho task "refactor rename hàm foo thành bar", bạn sẽ dùng tool nào
theo thứ tự gì? Không execute, chỉ plan.Áp dụng ngay
Bài tập 1: Dự đoán tool use (10 phút)
Với mỗi prompt dưới, ghi trước bạn đoán Claude sẽ dùng những tool gì (theo thứ tự):
Đoán: ________________________________
Đoán: ________________________________
Đoán: ________________________________
Đoán: ________________________________
Sau khi đoán, chạy từng prompt trong Claude Code và so sánh với thực tế.
Chấm điểm:
Bài tập 2 (optional, 20 phút): Quan sát orchestration
Bước 1: Trong uigen project, gõ:
Bước 2: Ghi lại từng tool call của Claude. Tổng bao nhiêu?
Bước 3: Nếu phải làm thủ công, bạn sẽ cần bao nhiêu bước tương đương?
Bước 4: Tỷ lệ thời gian: thủ công _____ phút vs Claude _____ phút.
- "Xem project này có dùng TypeScript strict mode không?"
- "Thêm header 'X-Request-ID' vào mọi API response."
- "Viết README.md dựa trên code hiện có."
- "Tìm trong codebase có chỗ nào dùng any type, suggest cách replace."
- 4/4 đúng: Bạn có mental model chuẩn về Claude
- 2–3/4: OK, vẫn học được
- 0–1/4: Đọc lại phần "tool classification" phía trên
- Số Read: ____
- Số Grep: ____
- Số Edit: ____
- Số Bash: ____
- Tool khác: ____
Thêm một button "Export as PDF" ở trang /dashboard. Khi nhấn,
export nội dung page thành PDF. Dùng library @react-pdf/renderer.
Viết test tối thiểu.Tóm tắt bài học
🎯 Claude Code có ~10 built-in tool — cover 90% developer task.
🎯 Orchestration quyết định giá trị — ghép tool thông minh > có nhiều tool.
🎯 Pattern chuẩn: Gather → Plan → Act → Verify — chú ý bước Verify (chạy test, typecheck) mà Claude thường tự làm.
🎯 Biết tool Claude sẽ dùng = prompt tốt hơn — prompt giúp Claude vào đúng tool ngay lần đầu.
🎯 Đừng tin "done" mù — luôn verify bằng diff review + test.
- Claude Code docs — built-in tools
- Agent design patterns — Anthropic
- Bài 4.10 — MCP để thêm tool mới cho Claude
- Bài 4.6 — CLAUDE.md để định hướng cách Claude dùng tool