Copilot 기술을 활용한 AI CoAgent 및 애플리케이션 생성
CoAgent는 React 애플리케이션에 LanGraph 에이전트를 통합하기 위한 필수 툴킷을 제공하여 Agent-Native 애플리케이션 개발을 용이하게 합니다. 이 글에서는 이 강력한 도구를 살펴보고 Copilot으로 강화된 AI CoAgent 또는 애플리케이션을 만드는 방법을 안내합니다 .
CoAgent란 무엇인가요?
이전에 언급했듯이 CoAgent는 AI 에이전트를 애플리케이션에 통합하여 Agent-Native 앱을 만드는 툴킷 역할을 합니다. 그 기능을 살펴보겠습니다.
- CoAgent에는 Shared State 라는 기능이 포함되어 있어 애플리케이션이 단 한 줄의 코드로 에이전트에서 인사이트를 검색할 수 있습니다. 이 동기화를 통해 애플리케이션과 에이전트 간의 실시간 상호 작용이 가능합니다.
- 툴킷은 또한 사용자 컨텍스트와 애플리케이션 상태에 따라 프런트엔드와 백엔드 작업을 모두 실행할 수 있는 실시간 프런트엔드 에이전트를 제공합니다. 이 생성 UI를 사용하면 필요에 따라 도구 호출을 자동으로 분산할 수 있습니다.
- 또한, 실시간으로 에이전트의 사고 과정을 시각화하여 투명성을 보장하고 사용자 참여를 향상시키는 Stream Intermediate Agent State 옵션도 있습니다 . 이는 사용자 기대치에 맞춰 에이전트 성과를 높이는 데 필수적인 측면입니다.
- CoAgent의 Agentic Generative UI는 사용자 요구 사항과 에이전트 응답에 맞춰 조정되는 동적인 AI 기반 인터페이스를 구축하여 에이전트 상태에 대한 투명성을 높이고 사용자 신뢰를 강화합니다.
이러한 기능이 마음에 든다면, 비즈니스 설정에 CoAgents를 구현하는 것을 고려해 보는 것이 좋습니다. 그 방법을 살펴보겠습니다.
Copilot에서 구동되는 AI CoAgent 또는 애플리케이션 생성
Copilot으로 구동되는 AI CoAgent 또는 애플리케이션을 생성하려면 다음 단계를 따르세요.
- CopilotKit 설치
- 원격 백엔드 엔드포인트 설정
- LangGraph 에이전트 통합
이제 각 단계를 더 자세히 살펴보겠습니다.
1] CopilotKit 설치
CoAgents에 뛰어들기 전에, 첫 번째 작업은 시스템에 CopilotKit을 설치하는 것입니다. Node.js와 npm이 이미 설정되어 있고 React 애플리케이션용 폴더도 있다고 가정합니다. 하지만 이 초기 단계에서는 마지막 부분이 선택 사항입니다. 이 튜토리얼은 CopilotKit이 오픈 소스 LLM 모델에 의존하기 때문에 OpenAI의 API 키를 활용합니다. 계속 진행해 보겠습니다.
- Windows 터미널을 시작하고 cd (디렉토리 변경) 명령을 사용하여 React 앱이 있는 디렉토리로 이동합니다 .
cd C:\React\myapplication
- 다음으로, 다음 명령을 실행하세요.
npm install @copilotkit/react-core @copilotkit/react-ui @copilotkit/runtime
- 그런 다음 이 명령을 실행하여 OpenAI 지원을 설치합니다.
npm install openai
- 루트 디렉토리에 있는 프로젝트의 .env 파일로 이동하여 다음 줄을 포함합니다.
OPENAI_API_KEY=your_api_key_here
이렇게 편집한 후에는 docs.copilot.ai/quickstart를 방문하여 애플리케이션에서 엔드포인트를 구성하고 CopilotKit 공급자를 설정하는 방법을 알아보는 것이 좋습니다.
2] 원격 백엔드 엔드포인트 설정
Copilot 애플리케이션을 Python 기반 서비스(또는 호환되는 Node.js 대안)에 연결하려면 원격 백엔드 엔드포인트와 연결을 설정해야 합니다. 시작하려면 Windows Terminal을 사용하여 필요한 Copilot 종속성을 설치해 보겠습니다.
pip install copilotkit fastapi uvicorn --extra-index-url https://copilotkit.gateway.scarf.sh/simple/
다음으로, FastAPI 서버를 설정합니다. 이를 위해 아래 명령을 실행합니다.
mkdir my_copilotkit_remote_endpoint
cd my_copilotkit_remote_endpoint
echo. > server.py
echo 명령이 실패하면 Visual Studio Code에서 폴더를 열고 수동으로 server.py 파일을 만들 수 있습니다.
VSCode에서 server.py 파일을 열고 다음 코드를 입력합니다.
from fastapi import FastAPI
app = FastAPI()
@app.get("/")
def read_root():
return {"Hello": "World"}
다음으로, Windows 터미널로 돌아가서 다음을 실행하여 FastAPI와 Uvicorn을 설치합니다.
pip install fastapi uvicorn
완료되면 docs.copilot.ai 에서 자세한 내용을 확인하세요.
3] LangGraph Agent 통합
마지막 단계는 server.py 파일에 LangGraph 에이전트를 포함하는 것입니다. Python Remote Endpoint 내에서 CopilotKitSDK 인스턴스를 찾는 것으로 시작합니다. 일반적으로 server.py에 있습니다. 다음으로, 다음 코드 줄을 추가하여 LangGraph 에이전트를 수용하도록 CopilotKitSDK 인스턴스를 수정합니다.
agents=[
LangGraphAgent(
name="basic_agent",
description="An agent that provides weather information",
graph=the_langraph_graph,
# copilotkit_config={ # Uncomment this line if using Google Gemini (don't forget to import `copilotkit_messages_to_langchain`)
# "convert_messages": copilotkit_messages_to_langchain(use_function_call=True)
# }
)
],
이 코드는 CopilotKitSDK 정의에 포함되어야 합니다.
자세한 내용은 docs.copilotkit.ai/coagents에서 제공하는 가이드를 참조하세요.
나만의 조종사를 만드는 방법?
새로운 조종사를 만들려면 Copilot Studio 홈페이지(/copilotstudio.microsoft.com)를 방문하여 왼쪽 탐색 메뉴에서 만들기를 선택한 다음 Copilots 페이지로 이동합니다. 또는 Copilots 페이지에서 + 새 조종사를 클릭할 수 있습니다. 채팅을 사용하여 질문에 제공된 지침에 따라 조종사를 설명하거나 건너뛰기를 선택하여 수동으로 양식을 작성합니다. 마지막으로 “만들기”를 클릭하여 프로세스를 마무리합니다.
Copilot이 코드를 생성할 수 있나요?
물론, Copilot은 코드를 생성할 수 있습니다. 그러나 완벽하지는 않습니다. 사용자는 결함과 버그를 만날 수 있습니다. 따라서 포괄적인 수동 검증 없이 AI 챗봇이 제공하는 코드를 직접 통합하지 않는 것이 중요합니다. 통합 애플리케이션인 Edge에서 Microsoft의 Copilot을 활용하거나 확장 기능을 통해 Visual Studio에서 GitHub Copilot을 사용할 수 있습니다.
답글 남기기