Mục lục
Giới thiệu CopilotKit: Framework Mạnh Mẽ cho AI Agent và Hỗ Trợ Tích Hợp MCP
Chúng tôi tại đội ngũ CopilotKit vô cùng hào hứng thông báo rằng chúng tôi vừa bổ sung tính năng hỗ trợ tích hợp sâu cho Model Context Protocol (MCP) ngay trong framework của mình. Bản cập nhật này đã chính thức ra mắt, mang đến khả năng mới đầy mạnh mẽ cho các nhà phát triển.
Đối với những ai chưa biết, **CopilotKit** là một framework full-stack, có khả năng tự lưu trữ (self-hostable), được thiết kế đặc biệt để xây dựng các agent và copilot có khả năng tương tác cao với người dùng ngay trong ứng dụng của bạn. Trọng tâm của chúng tôi là cho phép các agent này nắm quyền kiểm soát ứng dụng của bạn (với sự chấp thuận của con người), truyền đạt rõ ràng những gì chúng đang làm, và tạo ra giao diện người dùng (UI) hoàn toàn tùy chỉnh cho người dùng cuối.
Với bản cập nhật mới nhất này, việc tích hợp và tận dụng sức mạnh của MCP trở nên dễ dàng hơn bao giờ hết ngay trong môi trường phát triển React hoặc Next.js của bạn.
Hãy khám phá CopilotKit trên GitHub để xem mã nguồn và đóng góp: ⭐️ GitHub của CopilotKit
Máy Khách MCP Là Gì và Tầm Quan Trọng của Nó trong Hệ Sinh Thái LLM?
Vậy, chính xác thì **Máy khách MCP (MCP Client)** là gì? Đơn giản, đó là một ứng dụng web dựa trên client (trong trường hợp này, được xây dựng với React) cho phép bạn thiết lập kênh trò chuyện và tương tác với bất kỳ máy chủ MCP nào ngay trong ứng dụng của riêng bạn. Để bắt đầu, tất cả những gì bạn cần chỉ là một URL kết nối từ nền tảng như Composio.
MCP (Model Context Protocol) là một giao thức tiên tiến được thiết kế để cung cấp một cách tiếp cận tiêu chuẩn hóa nhằm kết nối các Mô hình Ngôn ngữ Lớn (LLM) với các công cụ và dịch vụ bên ngoài. Giao thức này giúp giải quyết bài toán phức tạp khi LLM cần truy cập và sử dụng các chức năng bên ngoài để thực hiện nhiệm vụ hoặc lấy thông tin theo yêu cầu của người dùng.
Với tính năng máy khách MCP mới trong CopilotKit, bạn có thể tận dụng lợi ích này một cách trực quan. Giờ đây, bạn có thể sử dụng một giao diện chat quen thuộc để giao tiếp và ra lệnh cho bất kỳ máy chủ tương thích MCP nào, thực hiện các tác vụ phức tạp bằng LLM, ngay từ ứng dụng React của bạn. Điều đáng chú ý là bạn có thể làm điều này mà không cần phải xây dựng hoặc tích hợp một framework agent riêng biệt và phức tạp. CopilotKit đảm nhận vai trò kết nối và hiển thị, giúp quá trình phát triển trở nên nhanh chóng và hiệu quả hơn.
Bắt Đầu Nhanh Chóng: Kích Hoạt Máy Khách MCP trong Ứng Dụng Next.js của Bạn
Một trong những ưu điểm lớn nhất của việc tích hợp MCP vào CopilotKit là sự đơn giản trong quá trình thiết lập. Chúng tôi đã tối ưu hóa quy trình để bạn có thể bắt đầu thử nghiệm và sử dụng ngay lập tức.
Chỉ với một lệnh duy nhất trên terminal trong thư mục dự án Next.js của bạn, bạn có thể cấu hình và kích hoạt khả năng giao tiếp với các máy chủ MCP một cách cục bộ (locally). Điều này cho phép bạn dễ dàng kết nối ứng dụng của mình với thế giới công cụ bên ngoài thông qua giao thức MCP.
Hãy mở terminal trong dự án Next.js của bạn và chạy lệnh sau:
copilotkit@latest init -m MCP
Lệnh này sẽ tự động thiết lập các thành phần cần thiết để biến ứng dụng của bạn thành một máy khách MCP sẵn sàng hoạt động. Sự đơn giản này giúp các nhà phát triển tiết kiệm đáng kể thời gian và công sức so với việc thiết lập thủ công các kết nối và giao thức.
Ứng Dụng Thực Tế: Minh Họa Tích Hợp MCP với Asana và Typefully
Để chứng minh hiệu quả và tính ứng dụng của tính năng máy khách MCP mới trong CopilotKit, chúng tôi đã xây dựng một ứng dụng demo đơn giản. Chúng tôi đã kết nối một ứng dụng quản lý ToDo tự host (self-hosted ToDo app) với hai nền tảng phổ biến khác thông qua giao thức MCP:
- Asana: Chúng tôi đã tích hợp để có thể gửi ý tưởng bài viết blog dưới dạng các nhiệm vụ (tasks) trong Asana, gán chúng cho chính mình và thiết lập ngày đến hạn hoàn thành, tất cả thông qua giao diện chat trong ứng dụng ToDo.
- Typefully: Ứng dụng demo có khả năng lấy tiêu đề các bài viết blog và lưu chúng trực tiếp dưới dạng tweet nháp (draft tweets) trong Typefully, mở ra khả năng tự động hóa quy trình xuất bản nội dung.
Những ví dụ này chỉ là bước khởi đầu. Khả năng kết nối LLM của bạn với vô số công cụ bên ngoài thông qua MCP, được hỗ trợ bởi CopilotKit, là gần như vô hạn. Bạn có thể nghĩ đến việc tích hợp với các hệ thống CRM, công cụ quản lý dự án, nền tảng email marketing, v.v.
Bộ Công Nghệ (Stack) Sử Dụng Trong Demo Tích Hợp MCP
Dự án demo minh họa cách tích hợp MCP bằng CopilotKit sử dụng một bộ công nghệ hiện đại và phổ biến:
- UI (Giao diện người dùng): Được xây dựng bằng **CopilotKit**. CopilotKit không chỉ cung cấp framework agent mà còn bao gồm các thành phần UI sẵn sàng để tích hợp nhanh chóng giao diện chat và tương tác AI.
- Máy chủ MCP: Demo kết nối với các máy chủ MCP được cung cấp bởi **Composio**. Composio là nền tảng cung cấp các kết nối tiêu chuẩn hóa đến hàng trăm ứng dụng khác nhau thông qua MCP.
- Framework Phát Triển: Dự án demo được xây dựng trên **Next.js**, một framework React mạnh mẽ hỗ trợ Server-Side Rendering (SSR) và Static Site Generation (SSG), rất phù hợp để xây dựng các ứng dụng web hiện đại.
- Framework Agent Bổ Sung: **Không yêu cầu**. Điểm mạnh của việc sử dụng CopilotKit cho MCP là bạn không cần phải tích hợp một framework agent phức tạp riêng biệt để xử lý logic kết nối LLM và công cụ. CopilotKit đã tích hợp sẵn khả năng này.
Mã nguồn của dự án demo này là mã nguồn mở. Chúng tôi luôn chào đón sự đóng góp từ cộng đồng để cùng nhau cải thiện và phát triển.
Khám Phá Thêm: Tài Nguyên và Cộng Đồng CopilotKit
Chúng tôi khuyến khích bạn khám phá sâu hơn về tính năng máy khách MCP mới và framework CopilotKit nói chung. Dưới đây là các tài nguyên hữu ích:
- Mã Nguồn Demo trên GitHub: Xem cách ứng dụng ToDo được kết nối với Asana và Typefully thông qua MCP. Đây là nguồn tài liệu tuyệt vời để học hỏi.
https://github.com/CopilotKit/copilotkit-mcp-demo - Tài liệu Hướng dẫn (Docs): Đọc tài liệu chính thức về Model Context Protocol trong CopilotKit để hiểu rõ hơn về cách tích hợp và tùy chỉnh.
https://docs.copilotkit.ai/guides/model-context-protocol - Video Demo: Xem video ngắn minh họa trực quan tính năng này hoạt động như thế nào trong thực tế.
Xem video trên Twitter - Thông báo trên Twitter: Đọc thông báo chính thức về việc ra mắt tính năng trên tài khoản Twitter của CopilotKit.
Xem thông báo trên Twitter
Chúng tôi rất mong muốn được nghe về những gì bạn đang kết nối với MCP bằng CopilotKit! Hãy chia sẻ những dự án sáng tạo của bạn.
Kết Nối và Chia Sẻ Cùng Cộng Đồng CopilotKit
Đừng ngần ngại kết nối với chúng tôi và cộng đồng nhà phát triển CopilotKit.
Theo dõi CopilotKit trên Twitter để cập nhật tin tức mới nhất và gửi lời chào.
Nếu bạn muốn cùng xây dựng những điều tuyệt vời, đặt câu hỏi, hoặc chia sẻ kinh nghiệm, hãy tham gia cộng đồng Discord của chúng tôi: Tham gia Discord CopilotKit
Chúng tôi tin rằng tính năng hỗ trợ MCP mới trong CopilotKit sẽ mở ra cánh cửa mới cho việc phát triển các ứng dụng React/Next.js thông minh, có khả năng tương tác cao với thế giới bên ngoài thông qua sức mạnh của LLM và các công cụ hiện có. Hãy bắt đầu xây dựng ngay hôm nay!