KMED Tours Chat with AI
이 웹 앱은 사용자와 대화하는 AI 챗봇을 구현한 것입니다. OpenAI의 GPT-4를 활용하여 사용자의 질문에 대한 답변을 생성합니다.
기술 스택
- React.js (프론트엔드)
- Next.js (백엔드와 서버사이드 렌더링)
- Tailwind CSS (스타일링)
- Vercel (배포)
- OpenAI GPT-4 (AI 모델)
설치 및 실행 방법
Prerequisites
- Node.js 14.x 이상
- npm 6.x 이상
Installation
# 프로젝트 복제
git clone https://github.com/ComBba/kmed-tours-chat-service.git
# 디렉토리 이동
cd kmed-tours-chat-service
# 의존성 설치
npm install
# 환경설정
.env.example를 복사해서 .env.local 내용을 알맞게 변경
OPENAI_API_KEY=sk-xxxx
# 로컬에서 실행
npm run dev
openai API키는 https://platform.openai.com/account/api-keys에서 찾아 볼 수 있습니다.
이제 http://localhost:3000에서 앱을 볼 수 있습니다.
배포 방법
이 프로젝트는 Vercel을 사용하여 배포할 수 있습니다.
# Vercel CLI 설치 npm i -g vercel
# 배포 vercel
특징
- 사용자와의 대화는 세션별로 관리되며, 각 세션에서 AI는 이전의 대화를 기억합니다.
- 사용자가 메시지를 전송한 후 AI의 응답이 올 때까지 "..."가 표시됩니다.
- 사용자가 처음 앱에 접속하면, AI는 사용자의 이름, 나이, 국가에 대해 물어봅니다. 이후로는 사용자의 메시지에 대한 응답을 생성합니다.