[AI 프로젝트 #1] PDF Q&A #1: 프로젝트 개요와 서비스 구조

---

서론

 

• LangChain + MCP + React 를 활용해 PDF 문서를 기반으로 질문에 답변하는 RAG 기반 AI 서비스를 만드는 과정
• AI가 단순히 '기억된 정보'만 답하는 게 아니라, 업로드 PDF 내용을 이해하고 요약 / 분석한 뒤 답변을 주는 구조 설계

---

서비스 목표

• 사용자는 PDF 문서를 업로드한 뒤 다음과 같은 작업이 진행 가능
  • 여러 PDF를 업로그 가능
  • 여러 PDF 중 '관련성이 높은 문서'를 사용자에게 제안
  • 사용자가 선택 문서의 내용으로 답변 생성
  • React UI에서 바로 결과 확인
• 사용자가 'PDF 문서 기반 AI 도우미'를 쉽게 구축할 수 있는 형태

 

---

전체 서비스 구조

• 시스템 아키텍처

사용자 (브라우저)
        │
        ▼
React + Vite (프론트엔드)
        │  HTTP / WebSocket
        ▼
FastMCP + LangChain (백엔드)
        │
        ▼
OpenAI GPT-4o / Embedding-3-Large
        │
        ▼
Chroma VectorDB (문서 임베딩 저장소)

 

---

서비스 동작 흐름

1. pdf 업로드

• 사용자가 여러개의 pdf 파일 업로드
• LangChain의 pyPDFLoader가 문서를 페이지 단위로 로드
• RecursiveCharacterTextSplitter로 500자 단위로 분할

2. 벡터 임베딩

• 분할된 텍스트는 OpenAI의 text-embedding-3-large 모델을 통해 벡터로 변환
• 벡터는 ChromaDB에 파일명, 페이지, 문단 등의 메타데이터와 함께 저장

3. 질문 입력

• 예) 1세대 스마트팜이 뭐야?
• LangChain은 질문 임베딩 후 ChromaDB에서 유사도 검색 수행
• 결과 문서별 관련도 점수 계산

4. 문서 추천 리스트 생성

• AI는 관련도 점수가 높은 상위 N개를 추천
• 프론트엔드로 전달되어 리스트 표현

Top1. 스마트팜_기술백서.pdf (관련도 0.92)
Top2. 스마트팜_개요.pdf (관련도 0.88)
Top3. IoT_센서_매뉴얼.pdf (관련도 0.71)

5. 사용자가 문서 선택

• AI가 제안한 문서 중 하나 선택
• 선택된 문서의  chunk만 LangChain Retriever로 전달

6. GPT 응답 생성

• LangChain의 RetrievalQA 체인이 선택 문서 내용을 컨텍스트로 사용
• 실제 답변을 생성하고, 답변과 참조 문서 페이지 정보 반환

 

---

기술 스텍

구분	기술	설명
Frontend	React + Vite (TypeScript)	PDF 업로드, 질문 입력, 문서 선택, 답변 표시
Backend	Python + LangChain + MCP	RAG 체인 구성 및 문서 벡터화
DB	Chroma VectorDB	문서 임베딩 저장 및 검색
AI Model	OpenAI GPT-4o / Embedding-3-Large	응답 생성 및 의미 기반 검색
Build	Turborepo	모노레포 멀티앱 관리
Style	Emotion (CSS-in-JS)	공통 테마 및 다크모드 지원

---

폴더 구조

ai-projects/
 ├─ frontend/
 │   ├─ apps/
 │   │   └─ pdf/
 │   ├─ packages/
 │   │   ├─ ui/
 │   │   ├─ styles/
 │   │   └─ utils/
 │   └─ turbo.json
 │
 └─ backend/
     └─ pdf_server/
         ├─ app.py
         ├─ rag_chain.py
         ├─ requirements.txt
         └─ venv/

---

MCP의 역할

• MCP는 AI 모델이 외부 데이터나 도구에 접근 가능하도록 하는 표준 프로토콜
• MCP를 이용해 백엔드 LangChain 서버를 IDE와 연결하여 사용 할 수 있도록 추가 구성 예정