피드로 돌아가기
Giving Your Accounting App a Brain: NestJS "MCP"
Dev.toDev.to
AI/ML

Generative UI 기반의 Custom Tool-calling 구조를 통한 ERP AI 에이전트 구현

Giving Your Accounting App a Brain: NestJS "MCP"

ShatilKhan2026년 4월 23일4intermediate

Context

레거시 ERP 시스템의 복잡도와 유지보수 비용으로 인해 표준 MCP SDK 도입 대신 자체 도구 호출 레이어 설계가 필요했던 상황. 기존 서버 구조를 유지하며 AI 기능을 통합하기 위해 LLM 기반의 Function Calling 인터페이스를 백엔드에 내장한 아키텍처를 채택함.

Technical Solution

  • OpenAI function spec 기반의 Tool-calling façade를 구현하여 Claude Haiku 3.5 모델과 NestJS 백엔드 간의 상호작용 최적화
  • tools.json 파일을 통한 도구 정의 및 switch 패턴 기반의 Dispatcher를 설계하여 런타임 시 도구 실행 로직 분리
  • Data Tools와 Component Tools로 역할을 구분하여 단순 데이터 조회와 UI 렌더링 요청을 차별화한 구조 설계
  • Backend에서 특정 component_name과 props를 전달하고 Frontend의 Static Registry에서 이를 매핑하는 Generative UI 메커니즘 구축
  • LLM이 직접 HTML/코드 생성 없이 미리 정의된 React 컴포넌트를 선택하게 함으로써 보안성 확보 및 렌더링 일관성 유지
  • list_tool과 call_tool이라는 최소화된 엔드포인트를 통해 AI 모델이 시스템 기능을 동적으로 파악하고 실행하는 인터페이스 제공

1. LLM의 직접적인 코드 생성이 부담스러운 경우, 컴포넌트 레지스트리를 통한 Generative UI 패턴 검토

2. 복잡한 레거시 환경에서는 표준 프로토콜 도입보다 인터페이스 façade를 통한 점진적 통합 전략 고려

3. 도구 정의(JSON)와 실행 로직(Service)의 분리를 통한 기능 확장성 확보 여부 확인

4. AI 응답의 일관성을 위해 LLM에게는 컴포넌트 식별자와 파라미터만 요청하는 제약 조건 설정

원문 읽기