Video: Cloudflare에 꽂혔더니 역대급 AI 에이전트 만들었음 ⭐
Channel: 노마드 코더 Nomad Coders
Duration: 6m 0s
Source: subtitle (auto, ko)
Transcript:
저는 제 인생에서 가장 진보된 AI 에이전트를 만들었습니다 . 이 제품에는 수많은 기능이 있지만, 그중에서도 가장 놀라운 다섯 가지 기능을 보여드리겠습니다 . 에이전트가 웹에서 작동하므로 Nomad Cloud XYZ를 엽니다. 저는 상담원에게 nomadcolors.com으로 가라고 말했고, 그러자 브라우저 창이 떴습니다. 하지만 이 브라우저는 제 컴퓨터에 설치되어 있지 않습니다. 클라우드 서버에서 실행 중이며 저와 상담원 모두 클릭할 수 있습니다. 우리는 같은 크롬 탭을 공유하고 있습니다. 이제 상담원에게 스크린샷을 찍어달라고 요청하면 바로 확인할 수 있습니다. 우리가 지금 보고 있는 페이지의 사진입니다 . 정신 이상의. 저는 bot@nomadcloud.xyz로 이메일을 보냅니다 30초 후에 운동하라고 나에게 상기시켜 달라고 말합니다. 음악을 보내고 기다립니다. 답장이 왔고 채팅창에 그 내용이 나와 있어요. 에이전트가 알림을 설정했고 30초 후에 음악이 재생되었습니다. 정신 이상의. 상담원은 이메일을 수신할 수 있습니다.

자, 이제부터 정말 멋진 일이 벌어집니다. 우리는 모든 에이전트가 도구를 가지고 있으며 에이전트가 서버에서 해당 도구를 호출한다는 것을 알고 있습니다. 하지만 이 [음악] 에이전트는 서버에서 실행되는 도구 와 내 브라우저에서 실행되는 도구를 모두 가지고 있습니다. 제가 보여드리겠습니다 . 내가 어디에 있는지 물어보면 상담원이 내 브라우저에 접속해서 [음악] 코드를 실행해 위치를 파악합니다. 내 브라우저가 권한을 요청합니다. 내가 허락했더니 그대로 됐어 . 상담원이 내 브라우저에서 내 위치 정보를 가져왔습니다. 에이전트는 클라우드 서버와 내 브라우저에서 동시에 실행됩니다. 미친. 하지만 이게 다가 아닙니다 . 상담원들이 사용할 도구를 우리가 제공하고, 상담원이 그중 하나를 선택해서 사용한다는 것은 우리 모두가 알고 있습니다 . 하지만 에이전트가 음악이라는 도구를 필요로 하는데, 그 도구가 존재하지 않는다면 어떻게 될까요? 이것 좀 봐. 저는 제 에이전트에게 섭씨를 화씨로 변환하는 도구를 만들어 달라고 부탁했습니다 .

에이전트가 도구용 코드를 작성하고 [음악]을 로드합니다. 이제 새 도구를 사용하도록 요청했더니 제대로 작동합니다. 이 도구는 클라우드 서버의 격리된 샌드박스 환경에서 실행됩니다 . 요원은 스스로 도구를 만들어 사용한 것입니다 . 이 에이전트는 스스로를 확장합니다. 이건 말도 안 돼. 그리고 그 상담원도 목소리를 가지고 있습니다. 통화 시작 버튼을 누르고, "안녕하세요"라고 말하면 상대방이 대답합니다 . 같은 두뇌, 같은 기억, 같은 도구. 채팅, 이메일, 음성 통화. [음악] 미쳤어. 그게 다가 아닙니다. 또한 메모리와 기술을 갖추고 있으며 PDF를 읽을 수 있고 클라우드 서버에 격리된 파일 시스템을 가지고 있으며 하위 에이전트를 생성할 수 있습니다. 클라우드 또는 ChatGPT에 MCP 서버로 연결하여 웹에서 모든 기능을 사용할 수 있습니다. 보기에는 정말 화려하고 첨단 기술처럼 보이지만, 사실 만드는 건 그렇게 어렵지 않았어요. 이 모든 것이 클라우드플레어 덕분에 가능합니다. 몇 주 전에 클라우드플레어는 에이전트 주간 행사를 진행했습니다.

그리고 내가 본 것은 정말 충격적이었다. 샌드박스, 브라우저 자동화, 음성, [음악] 이메일, 메모리, 새로운 에이전트 SDK. 에이전트를 위해 구축된 전체 스택입니다. Cloudflare는 에이전트 구축을 위한 최고의 [음악] 플랫폼으로 자리매김하고 있습니다. 그래서 저는 플랫폼 전체를 배워야겠다고 결심했습니다. 나는 그들의 문서를 꼼꼼히 살펴보았다. 며칠 동안 음악에 푹 빠져 지냈고, 거기서 배운 모든 것을 ' 클로 클론(Claw Clone)'이라는 강좌에 담았습니다. 이 강좌에서는 방금 여러분께 보여드린 에이전트를 직접 만들어 봅니다 . 나중에 얘기해 줄게. 먼저, 50줄도 안 되는 코드로 실시간, 메모리, 도구 호출 및 웹 프런트엔드를 갖춘 Cloudflare 에이전트를 구축하는 방법을 보여드리겠습니다 비결은 바로 이거예요. 에이전트는 Cloudflare 워커 내의 클래스일 뿐입니다 . AI 챗 에이전트를 가져와서 기능을 확장하면 에이전트가 완성됩니다. 프런트엔드에는 ' 에이전트 사용'이라는 후크가 있습니다.

Agent를 임포트하고 Agent 클래스의 이름을 전달하면 WebSockets를 통해 실시간으로 Agent에 연결되고, 재연결 기능도 지원되는 지속적인 연결이 설정됩니다. 당신은 그 내용을 전혀 쓰지 않았지만, 무료로 받게 됩니다. 이제 이 에이전트를 채팅 에이전트로 만들기 위해 위에 또 다른 후크를 추가합니다 . Use Agent는 사용자의 에이전트에 연결합니다 . 에이전트 채팅 사용 [음악]은 에이전트를 채팅으로 전환하고 싶을 때 사용합니다 . 메시지 전체 대화 내용을 보여주고, 새 메시지를 보낼 수 있는 '메시지 보내기' 버튼도 제공합니다. 우리는 메시지를 매핑하고 각각을 렌더링합니다. 입력값이 하나인 폼을 드롭합니다. 메시지를 보냈는데 아무 일도 일어나지 않아요. 에이전트에게 메시지 도착 시 어떻게 반응해야 하는지 알려주지 않았기 때문입니다. 그래서 서버에 채팅 메시지에 대한 메서드를 하나 추가합니다 . 이 프로그램은 사용자가 메시지를 보낼 때마다 실행됩니다 . 내부적으로는 모델을 사용하여 스트림 텍스트를 호출합니다 .

우리는 대화 기록을 전달하고, 스트림과 [음악]을 반환하는 것으로 끝입니다. 참고로, 여기에 사용된 모델은 클라우드 플레어 자체 모델 호스팅 서비스인 클라우드플레어 워커스 AI에서 가져온 것입니다 Llama, Mistral, Gemma, Gwen, DeepSeek 등 수십 가지 모델 중에서 선택할 수 있습니다. 코드는 같지만 모델이 다릅니다. OpenAI 또는 Anthropic을 선호하는 경우에만 해당 AI SDK가 해당 도구도 지원합니다. 자, 보세요. 제가 메시지를 보내면, 응답이 토큰 단위로 순차적으로 전송됩니다. 창을 닫았다가 다시 열어도 대화 내용이 그대로 남아있어요 . 나는 두 번째 탭을 열고, 그중 하나에서 메시지를 보낸다. 두 탭 모두에서 볼 수 있습니다. 스트리밍, 데이터 영구 저장, 웹을 통한 실시간 동기화, 스토리지 등 모든 기능이 기본적으로 무료로 제공됩니다. 이제 저는 제 에이전트가 날씨를 알았으면 좋겠어요. 그래서 저는 그것에 도구를 제공합니다. 도구란 이름, 설명, 입력 스키마를 가진 함수일 뿐입니다.

나는 그것을 스트림 텍스트로 전달합니다. 제가 서울 날씨가 어떤지 물어보면 , 모델은 도구에 전화를 걸어 답을 받고 응답합니다. 그것은 툴 콜링입니다. 자, 이제 제 머리를 혼란스럽게 만든 부분입니다. 모든 에이전트는 상태를 가지고 있습니다. 상태는 에이전트가 기억해야 할 모든 것을 담는 JavaScript 객체입니다 . 카운터, 작업 목록, [음악] 사용자 환경 설정, 게임 점수. 상태 정보는 SQLite 데이터베이스에 자동으로 저장되며 , 모든 에이전트는 무료로 이를 사용할 수 있습니다. 상태가 변경되면 연결된 모든 프런트엔드는 새로운 [음악] 상태를 즉시 수신합니다. 카운터를 하나 추가하겠습니다 . 초기 상태는 상태의 형태를 정의하고 , 앱 호출 가능 데코레이터는 프런트엔드에 메서드를 노출합니다. 내부적으로는 setstate를 호출합니다. 프런트 엔드에서는 에이전트 상태를 직접 읽습니다. 저는 agent.stops.increment를 일반 함수처럼 호출합니다. 저는 탭 두 개를 엽니다. 한 탭에서 버튼을 클릭하면 두 탭이 동시에 업데이트됩니다.

그리고 저는 음악 동기화 코드를 단 한 줄도 작성하지 않았습니다 . 이게 얼마나 어이없는 일이야? 그리고 훨씬 더 많은 기능들이 있습니다. 나중에 작업을 예약하고 싶으신가요? 한 줄. 그 요원은 내년 1월에 잠에서 깨어나 스스로에게 전화를 걸 겁니다. 이메일을 받아보시겠습니까? 한 가지 방법. 이제 상담원에게 받은 편지함이 생겼습니다. 병렬 로 작업할 하위 에이전트를 생성하시겠습니까 ? 두 줄. 이제 에이전트가 작업자를 생성합니다. 자, 그럼 수업에 대해 이야기해 볼까요. Clock Clone은 제가 처음에 시연했던 에이전트를 구축하는 곳입니다 . [음악] 함께 12가지 기능을 만들어 냅니다. 실시간 채팅, 메모리, 하위 상담원 및 워크플로, 음성 및 브라우저 자동화, PDF 읽기 및 쓰기, 일정 관리 및 이메일 MCP를 통해 Claude 또는 ChatGPT가 상담원에게 전화를 걸 수 있으며, 더 많은 도구를 개발하는 도구도 제공합니다. 이 과정을 마치면 어떤 용도에든 원하는 에이전트를 구축하는 방법을 알게 될 것입니다.

고객에게 판매하거나 , 제품으로 배송하거나, 직접 사용하세요. 모든 서비스가 클라우드플레어에서 월 몇 센트의 비용으로 운영됩니다 . 링크는 설명란에 있습니다 . 현재 에이전트 구축에 있어 가장 어려운 부분은 규정이 아닙니다. Cloudflare가 그 부분을 처리해 줍니다. 가장 어려운 부분은 무엇을 만들지 결정하는 것입니다 . [음악] 그리고 그것이 당신의 유일한 임무입니다. 무슨 말인지 알겠지만, 다음에 또 봐요. 모두 안녕히 계세요. 안녕.