Claude Code + MCP cho vibe coding: Figma, Jira, Drive, Slack chỉ khi có ranh giới

MCP là phần rất dễ bị nói quá trong các bài AI coding. Nghe như protocol phức tạp, server, transport, schema, OAuth. Với non-tech đang vibe coding, bạn không cần bắt đầu ở đó.

Cách hiểu đủ dùng: MCP là cách nối Claude Code với tool hoặc data source bên ngoài. Ví dụ Figma, Jira, Google Drive, Slack, local folder, database read-only, internal docs. Khi đã nối đúng, Claude Code có thể đọc context từ nơi đó hoặc gọi một số hành động được server expose.

Điểm nguy hiểm cũng nằm ở đó: “đọc context” và “làm hành động” là hai mức rủi ro khác nhau. Một tool đọc Figma spec khác hẳn một tool deploy production. Một tool draft Jira issue khác hẳn một tool transition ticket và ping cả team.

Với non-tech, MCP chỉ đáng bật khi ranh giới rõ.

MCP hữu ích ở đâu trong vibe coding

Vibe coding hỏng nhiều nhất vì thiếu context. Bạn nói “làm giống thiết kế”, nhưng thiết kế nằm trong Figma. Bạn nói “theo requirement cũ”, nhưng requirement nằm trong Drive. Bạn nói “bug này giống ticket trước”, nhưng ticket nằm trong Jira. Bạn nói “khách feedback ở Slack”, nhưng Claude Code không thấy Slack.

MCP giải quyết vấn đề này bằng cách cho Claude Code access context có cấu trúc hơn copy paste.

Use case tốt:

• Đọc Figma frame để hiểu layout và component naming.
• Đọc Google Drive spec hoặc markdown handoff.
• Đọc Jira ticket để lấy acceptance criteria.
• Tìm Slack thread liên quan rồi tóm tắt decision.
• Inspect docs nội bộ trước khi sửa repo.
• Tạo draft issue hoặc draft comment để user review.

Use case không nên giao thẳng:

• Auto-deploy.
• Xóa data.
• Chạy migration.
• Gửi thông báo hàng loạt.
• Update production config.
• Tạo payment/refund.
• Đổi permission hoặc role.

MCP không làm tool an toàn hơn chỉ vì nó có schema. Nó chỉ làm tool rõ hơn. Safe hay không phụ thuộc scope, credential, approval, và hành động bạn cho phép.

Ba scope trong Claude Code MCP

Theo docs Claude Code hiện tại, MCP config có thể nằm ở nhiều scope. Tên UI hoặc command cụ thể có thể đổi theo version, nhưng mental model nên giữ:

Scope	Dùng khi nào	Rủi ro chính
Local	Cấu hình cá nhân cho một project, thử nghiệm, credential nhạy cảm	Chỉ bạn thấy, dễ quên đã bật
Project	Team cần share cùng server cho repo này	Cần tránh commit secret
User	Tool cá nhân dùng ở nhiều project	Dễ vô tình available ở repo không liên quan

Với non-tech, rule thực tế:

• Tool nhạy cảm hoặc đang thử: để local.
• Tool team cần dùng chung: project scope, nhưng config phải không chứa secret thật.
• Tool tiện ích cá nhân ít rủi ro: user scope.

Nếu cùng tên server xuất hiện ở nhiều scope, Claude Code ưu tiên local trước, rồi project, rồi user. Điều này hữu ích vì bạn có thể override config cá nhân, nhưng cũng có nghĩa là “máy tôi chạy khác máy bạn” nếu không document rõ.

Secret không được nằm trong file share

MCP server thường cần credential: API key, OAuth token, file path, org id. Đừng paste token vào config được commit.

Claude Code docs hỗ trợ environment variable expansion trong .mcp.json, ví dụ dùng ${VAR} hoặc default ${VAR:-default} ở command, args, env, url, headers. Ý nghĩa thực tế: team có thể share config template, còn secret nằm trong environment của từng máy.

Ví dụ an toàn về mặt format:

{
  "mcpServers": {
    "internal-docs": {
      "type": "http",
      "url": "${DOCS_MCP_URL}",
      "headers": {
        "Authorization": "Bearer ${DOCS_MCP_TOKEN}"
      }
    }
  }
}

Đây không phải token thật. Token thật nằm trong env local, password manager, hoặc secret manager mà team dùng. Nếu env var chưa set và không có default, config sẽ fail thay vì âm thầm dùng credential rỗng. Fail sớm tốt hơn leak secret.

Với non-tech, câu cần nói với Claude Code:

Nếu cần credential cho MCP, không ghi token vào repo.
Hãy dùng environment variable hoặc chỉ dẫn tôi đặt secret ở local config.
Không in token ra màn hình.

Import từ Claude Desktop: tiện nhưng vẫn phải review

Claude Desktop hiện hỗ trợ connectors và desktop extensions cho local MCP servers. Một số tool local chỉ chạy trên máy bạn, ví dụ filesystem, app desktop, folder cá nhân. Theo docs hiện tại, local extensions có thể dùng trong Claude Desktop và Claude Code tùy loại plugin/connector.

Nếu bạn đã cấu hình MCP server trong Claude Desktop, Claude Code có thể import hoặc reuse config trong một số workflow. Đây là đường tiện: không cần cấu hình lại từ đầu.

Nhưng tiện không có nghĩa là bật hết.

Trước khi import, hỏi:

• Server này đọc được folder nào?
• Có tool nào write/delete/send không?
• Credential nằm ở đâu?
• Server này nên available cho mọi repo hay chỉ repo này?
• Có log hoặc debug file chứa data nhạy cảm không?

Ví dụ filesystem MCP. Nếu bạn expose cả home folder, Claude có thể thấy quá nhiều. Nếu bạn expose một folder handoff riêng, rủi ro nhỏ hơn nhiều.

Pattern an toàn cho non-tech

Tôi sẽ chia MCP tool thành ba nhóm.

Nhóm 1: read-only context. Đây là nhóm nên bắt đầu.

• Read Figma design.
• Read spec docs.
• Search internal docs.
• Read ticket acceptance criteria.
• Read local handoff folder.

Prompt:

Dùng MCP chỉ để đọc context từ Figma/spec/ticket.
Tóm tắt thông tin liên quan tới task.
Chưa tạo, sửa, gửi, deploy, hoặc update gì ở tool bên ngoài.

Nhóm 2: draft side effect. Tool có thể tạo nội dung, nhưng bạn review trước.

• Draft Jira issue.
• Draft Slack update.
• Draft checklist.
• Draft PR description.

Prompt:

Hãy draft nội dung trước trong chat.
Không gửi hoặc tạo thật nếu tôi chưa approve rõ.

Nhóm 3: real side effect. Tool thay đổi hệ thống thật.

• Create/update issue thật.
• Send Slack message thật.
• Modify Drive file.
• Trigger workflow.
• Deploy.

Với non-tech, default là không cho Claude Code tự làm nhóm này. Nếu bắt buộc, hãy yêu cầu nó show payload trước và chờ approval cụ thể.

Ví dụ workflow Figma + repo

Một workflow tốt:

Đọc Figma frame qua MCP, chỉ summarize layout và component intent.
Sau đó inspect repo read-only để tìm component/design token tương ứng.
Viết plan mapping:
- Figma section nào map vào component nào
- API/hook nào cần dùng
- File nào dự kiến sửa
Chưa edit file.

Workflow này dùng MCP để lấy context, không dùng MCP để thay đổi hệ thống. Phần edit repo vẫn đi qua plan/diff/test như bài trước.

Ví dụ workflow Jira + Claude Code

Tốt:

Đọc ticket ABC-123 qua MCP.
Tóm tắt acceptance criteria.
So sánh với repo hiện tại.
Viết plan implement.
Không update trạng thái ticket.
Không comment lên Jira.

Chưa tốt:

Làm ticket ABC-123, update Jira khi xong, push luôn.

Câu thứ hai gom quá nhiều quyền: đọc, sửa code, chạy test, update hệ thống ngoài, có thể cả git. Non-tech nên tách từng bước.

Checklist trước khi bật MCP

Trước khi thêm server mới, trả lời ngắn:

• Tool này cần đọc gì?
• Tool này có quyền ghi/xóa/gửi không?
• Có thể cấu hình read-only không?
• Scope nên là local, project hay user?
• Secret có nằm ngoài repo không?
• Nếu Claude gọi nhầm tool, hậu quả là gì?
• Có cần developer/admin review config không?

Nếu bạn không trả lời được hậu quả của tool call sai, đừng bật tool đó cho workflow vibe coding.

MCP làm Claude Code mạnh hơn. Nhưng với non-tech, mạnh hơn không phải mục tiêu cuối. Mục tiêu là context tốt hơn, review nhanh hơn, handoff rõ hơn, trong một phạm vi mà bạn hiểu được.

Tham khảo

• Claude Code MCP docs
• Getting Started with Local MCP Servers on Claude Desktop
• When to use desktop and web connectors
• Claude Code overview