AI Agent 개발을 위한 JavaScript 활용 가이드: Tool Calling과 MCP 연동

1. AI Agent 개발에서 JavaScript의 역할

AI Agent 개발에서 JavaScript는 단순한 웹 언어가 아닙니다. 요즘은 LLM 호출, Tool 실행, MCP 연동, 실시간 UI, 서버 API, 워크플로우 자동화까지 한 번에 묶는 에이전트 접착제 역할을 합니다.

특히 TypeScript 기반 생태계가 빠르게 커지고 있습니다. Vercel AI SDK는 React, Next.js, Vue, Svelte, Node.js 환경에서 AI 앱과 에이전트를 만들기 위한 TypeScript 툴킷을 제공하고, MCP 도구 연동도 지원합니다.

OpenAI도 Responses API와 Agents SDK를 통해 도구 호출, 상태 관리, 다중 에이전트 패턴을 지원합니다.

2. AI Agent란?

AI Agent는 단순히 질문에 답하는 챗봇이 아닙니다. 사용자의 목표를 이해하고, 필요한 작업을 나누고, 외부 도구를 호출하고, 결과를 바탕으로 다음 행동을 결정하는 프로그램입니다.

즉, Agent는 LLM + 도구 + 메모리 + 실행 로직으로 구성됩니다.

3. JavaScript가 AI Agent 개발에 적합한 이유

LangChain은 LLM 기반 앱과 에이전트 개발을 위한 구성 요소와 통합 기능을 제공하며, 더 복잡한 오케스트레이션에는 LangGraph를 안내하고 있습니다.

4. AI Agent 기본 구조

핵심은 Agent Orchestrator입니다.

5. 기본 프로젝트 구성

mkdir js-ai-agent
cd js-ai-agent

npm init -y
npm install openai dotenv zod
npm install -D typescript ts-node @types/node

package.json

{
  "type": "module",
  "scripts": {
    "dev": "ts-node src/index.ts"
  }
}

.env

OPENAI_API_KEY=your_api_key_here

6. 가장 단순한 LLM 호출 예시

import OpenAI from "openai";
import "dotenv/config";

const client = new OpenAI({
  apiKey: process.env.OPENAI_API_KEY,
});

async function main() {
  const response = await client.responses.create({
    model: "gpt-4.1-mini",
    input: "AI Agent를 한 문장으로 설명해줘.",
  });

  console.log(response.output_text);
}

main();

이 단계는 아직 Agent라기보다는 LLM 호출입니다. Agent가 되려면 외부 행동, 즉 Tool 사용 능력이 필요합니다.

7. Tool Calling 개념

Tool은 Agent가 사용할 수 있는 함수입니다. LLM은 사용자의 요청을 보고 어떤 도구가 필요한지 판단하고, 실제 실행은 JavaScript 코드가 담당합니다.

8. JavaScript Tool 예시

type ToolResult = {
  success: boolean;
  data?: unknown;
  error?: string;
};

async function getServerStatus(serverName: string): Promise<ToolResult> {
  const mockStatus = {
    name: serverName,
    cpu: "34%",
    memory: "68%",
    status: "running",
  };

  return {
    success: true,
    data: mockStatus,
  };
}

이런 식으로 사내 시스템, DB, API, 로그 서버와 연결할 수 있습니다.

9. Agent 실행 흐름 예시

async function runAgent(userInput: string) {
  if (userInput.includes("서버 상태")) {
    const result = await getServerStatus("web-01");

    return `
서버 상태 확인 결과입니다.

- 서버명: ${(result.data as any).name}
- CPU: ${(result.data as any).cpu}
- Memory: ${(result.data as any).memory}
- 상태: ${(result.data as any).status}
`;
  }

  return "요청을 처리할 수 있는 도구가 아직 없습니다.";
}

실무에서는 이렇게 단순한 if 문으로 끝나지 않습니다. LLM에게 도구 목록을 알려주고, LLM이 직접 어떤 도구를 호출할지 결정하게 만듭니다.

10. Vercel AI SDK 활용

Next.js 기반 AI Agent를 만든다면 Vercel AI SDK가 매우 편합니다. Vercel AI SDK는 TypeScript 기반이며, 여러 UI 프레임워크와 Node.js 런타임에서 AI 앱과 Agent를 만들 수 있도록 설계되어 있습니다.

npm install ai @ai-sdk/openai zod

도구 정의 예시

import { generateText, tool } from "ai";
import { openai } from "@ai-sdk/openai";
import { z } from "zod";

const serverStatusTool = tool({
  description: "서버 상태를 조회합니다.",
  inputSchema: z.object({
    serverName: z.string(),
  }),
  execute: async ({ serverName }) => {
    return {
      serverName,
      cpu: "31%",
      memory: "72%",
      status: "running",
    };
  },
});

const result = await generateText({
  model: openai("gpt-4.1-mini"),
  tools: {
    serverStatus: serverStatusTool,
  },
  prompt: "web-01 서버 상태 확인해줘.",
});

console.log(result.text);

이 구조의 장점은 도구 정의, 타입 검증, 실행 로직을 TypeScript로 안전하게 관리할 수 있다는 점입니다.

11. MCP와 JavaScript

AI Agent 개발에서 중요한 흐름 중 하나가 MCP입니다. MCP는 Model Context Protocol의 약자로, LLM 애플리케이션이 외부 도구와 데이터 소스에 표준 방식으로 연결되도록 돕는 프로토콜입니다. 공식 TypeScript SDK는 Node.js, Bun, Deno에서 실행됩니다.

쉽게 말하면 MCP는 AI Agent용 도구 연결 규격입니다.

12. AI Agent 개발에 자주 쓰는 JavaScript 기술

13. 실무형 Agent 예시: 뉴스 수집 Agent

최신 뉴스 사이트를 만든다면 JavaScript Agent를 이렇게 설계할 수 있습니다.

News Agent
├─ collectNews()
├─ deduplicateNews()
├─ factCheck()
├─ summarize()
├─ classifyCategory()
├─ generateBlogDraft()
└─ saveToDatabase()

중요한 점은 Agent가 바로 게시하지 않도록 하는 것입니다. 뉴스는 저작권과 정확성이 중요하므로 Human Review 단계를 반드시 넣는 것이 안전합니다.

14. Agent 개발 시 주의할 점

AI Agent는 편리하지만 자동 실행 범위가 커질수록 예기치 않은 작업을 수행할 수 있습니다. 따라서 실행 전 검증과 추적이 중요합니다.

Agent가 어떤 판단으로 어떤 Tool을 호출했는지 추적할 수 있어야 합니다.

15. 추천 아키텍처

초기 개발 단계라면 아래 구성을 추천합니다.

복잡도가 높아지면 LangGraph, 멀티 Agent 구조, MCP 기반 도구 분리로 확장하면 됩니다.

16. 결론

JavaScript는 AI Agent 개발에서 매우 실용적인 선택입니다. 특히 웹 UI, API 서버, 실시간 스트리밍, Tool Calling, MCP 연동까지 한 언어로 처리할 수 있다는 점이 강력합니다.

AI Agent 개발에서 JavaScript는 이제 조연이 아니라 실행 흐름을 연결하는 핵심 기술입니다. LLM이 더 잘 작동하도록 도구, 데이터, UI, 실행 흐름을 연결하는 역할을 맡습니다.