데브허브 | DEVHUB | How to Build an Agent with Auth and Payments - LangGraph.jsHow to Build an Agent with Auth and Payments - LangGraph.js
- LLM 기반 챗 앱에 사용량 기반 결제(크레딧 시스템)를 통합하는 방법을 소개합니다. 💰
- Superbase 인증, Stripe 결제, Superbase 크레딧 관리, LangGraph.js 챗 에이전트, Chad CN UI의 5가지 핵심 영역으로 구성됩니다. 🧩
agents (LangGraph 에이전트, 인증 미들웨어)와 web (UI, Stripe, Superbase 인증, 크레딧) 두 앱을 포함하는 모노레포 구조입니다. 🏗️
- Superbase JWT 토큰을 LangGraph 미들웨어(
auth.ts)를 통해 에이전트 보호에 활용하며, 사용자 로그인/로그아웃을 처리합니다. 🔐
- Stripe를 통해 구독을 구매하고, 웹훅으로 구독 이벤트를 처리하여 Superbase 사용자 테이블의 크레딧을 업데이트합니다. 💳
- Superbase 테이블에 크레딧을 저장하고, UI에서 낙관적 업데이트를 지원하며, 크레딧 추가/새로고침/제거 기능을 제공합니다. ✨
- Tavi 웹 검색 기능을 포함하는 React 기반의 LangGraph TypeScript 챗 에이전트입니다. 🤖
ThreadProvider 및 StreamProvider를 통해 Superbase JWT 토큰을 LangGraph 클라이언트에 전달하여 에이전트와의 인증된 상호작용을 가능하게 합니다. 🔄
- 상세 문서와 README를 제공하여 개발자가 쉽게 설정하고 자신만의 풀스택 애플리케이션을 구축할 수 있도록 지원합니다. 🚀