Phần 3 của 560% hoàn thành

Chat và Composer — hai cách tương tác

English title: Chat vs Composer — Two Ways to Interact

Bài 3 trong chuỗi 15 bài hướng dẫn Cursor. Trong Cursor bạn có hai cách chính để nói chuyện với AI: Chat và Composer (mở bằng Cmd+I / Ctrl+I). Một câu hỏi nhanh thì dùng Chat; một task cần AI sửa file hoặc chạy lệnh thì dùng Composer. Bài này giúp bạn phân biệt rõ và chọn đúng chỗ làm việc.

Mở đầu: Một câu hỏi nhanh vs một task sửa code

Bạn có thể hỏi: "Promise.all và Promise.allSettled khác nhau thế nào?" — đó là câu hỏi giải thích, chỉ cần câu trả lời bằng text. Bạn cũng có thể nói: "Thêm try-catch cho toàn bộ function fetchUser trong file api.ts" — đó là task cần AI đọc file, sửa đúng chỗ, có thể chạy test. Loại đầu phù hợp Chat; loại sau phù hợp Composer. Nếu bạn dùng Chat cho task sửa code, bạn sẽ chỉ nhận được đoạn code mẫu và phải tự áp dụng; nếu dùng Composer, AI có thể áp dụng trực tiếp lên file trong project.

1. Đi sâu: Chat — hỏi đáp nhanh

Tại sao chủ đề này quan trọng: Chat có thể đọc context (bạn @ file hoặc folder) nhưng thường không thực hiện thay đổi trực tiếp lên file hay chạy terminal. Nó tối ưu cho hỏi đáp, giải thích, gợi ý đoạn code ngắn.

Hiểu sai thường gặp: Nhiều người mở Chat rồi yêu cầu "sửa file X" — Chat có thể đưa ra diff hoặc đoạn code để bạn copy, nhưng không phải lúc nào cũng "apply" thẳng vào editor như Composer/Agent.

Bản chất đúng: Chat = panel hỏi đáp; bạn có thể @ file, @ folder để đưa context; AI trả lời dựa trên context đó. Phù hợp: "giải thích đoạn này", "cú pháp Y là gì", "gợi ý tên biến", "có lỗi gì trong đoạn code này?". Không phù hợp: "sửa toàn bộ file A và B theo danh sách thay đổi" — việc đó nên làm trong Composer (và Agent mode nếu cần).

2. Khái niệm

Chat: Cửa sổ hoặc panel trò chuyện với AI trong Cursor; thường nằm ở sidebar hoặc panel bên. Hỗ trợ @ file, @ folder để thêm context. Output chủ yếu là text và code block (copy-paste).
Composer: Cửa sổ soạn mã chuyên sâu — mở bằng Cmd+I (Mac) hoặc Ctrl+I (Windows/Linux). Trong Composer, AI có thể tạo file mới, sửa file có sẵn, chạy lệnh terminal. Có hai chế độ: Normal mode (explore, generate) và Agent mode (Cmd+.) — AI chủ động dùng tool (đọc, sửa, chạy). Bài 6 sẽ đi sâu Agent mode.
Normal mode (Composer): AI tìm kiếm codebase, gợi ý code; có thể apply thay đổi nhưng ít "tự động" hơn Agent mode.
Agent mode (Composer): AI tự mở file, sửa, chạy lệnh; phù hợp task nhiều bước.

3. Ví dụ khi nào dùng gì

Chat: "Trong React, useEffect cleanup function viết thế nào?" → Bạn nhận giải thích + ví dụ code; bạn tự paste vào project nếu cần.
Composer: "Trong file LoginForm.tsx, thêm validation cho email: không để trống và phải có dạng email." → Bạn @ file LoginForm.tsx (hoặc mở trong Composer), AI có thể sửa trực tiếp file đó và bạn xem diff rồi accept.

Shortcut nhớ nhanh: Cmd+I (hoặc Ctrl+I) = mở Composer. Dùng Composer khi task liên quan nhiều file hoặc cần AI áp dụng thay đổi thay vì chỉ đưa ra đoạn code.

4. Workflow: Chọn Chat hay Composer

Chỉ cần câu trả lời hoặc đoạn code để copy → Chat. Có thể @ file nếu cần AI dựa trên code hiện tại.
Cần AI sửa file, tạo file, hoặc chạy lệnh → Composer (Cmd+I). Mô tả task rõ ràng; có thể @ file/folder.
Task nhiều bước, nhiều file → Composer + bật Agent mode (Cmd+.) — bài 6.
Chưa chắc → Thử Chat trước; nếu thấy cần "apply change" thì chuyển sang Composer và lặp lại prompt.

5. Ứng dụng

Sau bài này bạn đã biết: Chat = hỏi nhanh, giải thích; Composer = task sửa code, nhiều bước. Bài tiếp (4) sẽ nói cách đưa đúng context vào Chat/Composer bằng @ và # để AI trả lời đúng ý và đúng chỗ.

Bài tiếp: Context với @ và # (bài 4) — đưa đúng context để AI trả lời đúng.