RSS DEV 커뮤니티

AI의 도래 2025 - 17일차: Goose와 MCP-UI를 사용한 위시리스트 앱 구축

"AI의 출현" 시리즈는 엔지니어링 작업을 자동화하고 코드 제안을 넘어선 오픈 소스 AI 에이전트인 Goose를 활용합니다. Goose는 처음부터 전체 프로젝트를 구축하고, 코드를 작성하고 실행하며, 실패를 디버깅하고, 외부 API와 상호 작용할 수 있는 로컬, 확장 가능하고 오픈 소스 AI 에이전트입니다. "AI의 출현" 챌린지 17일차를 위해, 저자는 사용자가 소원을 추가하고, 보기 좋게 형식화된 UI에서 보고, 소원이 이루어지면 승인하고, 더 이상 원하지 않는 소원을 삭제할 수 있는 Winter Wishlist 앱을 MCP-UI를 사용하여 구축했습니다. 이 앱은 ChatGPT 앱 TypeScript 템플릿을 기반으로 구축되었으며, 이를 통해 위시리스트 서버를 훨씬 빠르게 시작할 수 있었습니다. 구현은 MCP 세션 ID를 기반으로 메모리에 소원을 저장하지만, 프로덕션 환경에서는 더 강력한 솔루션이 필요할 것입니다. 저자는 Goose에서 iframe 크기 조정과 관련된 문제를 겪었지만, ResizeObserver를 사용하고 상위 프레임에 메시지를 게시하여 해결할 수 있었습니다. 이 경험을 통해 얻은 주요 학습 내용은 시각적 인터페이스를 생성하는 MCP UI의 강력함과 견고한 템플릿으로 시작하는 것의 중요성입니다. 저자는 독자들에게 이전 날짜를 놓쳤더라도 "AI의 출현" 챌린지에 참여하고, 소셜 미디어 채널을 통해 연락을 유지하도록 권장합니다. 이 프로젝트의 개발 워크플로우도 강조되었으며, Storybook에서 컴포넌트를 구축하고 편집하고 Goose에서 실시간으로 업데이트되는 것을 확인할 수 있었습니다. 전반적으로 이 프로젝트는 Goose와 MCP UI가 혁신적이고 대화형 애플리케이션을 구축하는 데 잠재력을 보여줍니다. 저자의 프로젝트 경험은 개발 속도를 높이고 보다 효율적인 워크플로우를 만들기 위해 오픈 소스 도구와 템플릿을 사용하는 것의 이점을 보여줍니다."
favicon
dev.to
Advent of AI 2025 - Day 17: Building a Wishlist App with Goose and MCP-UI
기사 이미지: AI의 도래 2025 - 17일차: Goose와 MCP-UI를 사용한 위시리스트 앱 구축
Create attached notes ...