7. 구조화된 출력 - QuizGPT 만들기

🎯 이 챕터에서 배울 것

• LLM이 생성하는 텍스트를 우리가 원하는 정확한 형식(JSON)으로 제어하는 방법
• WikipediaRetriever를 사용하여 외부 지식 소스에서 동적으로 콘텐츠를 가져오는 방법
• Pydantic/JSON Output Parser: 프롬프트 엔지니어링과 파서를 통해 LLM의 출력을 구조화하는 기법
• Function Calling: 모델이 특정 함수의 인자(argument) 형식에 맞춰 JSON을 생성하도록 강제하는 더 강력하고 안정적인 기법
• 두 개의 체인(퀴즈 생성, 채점)을 연결하여 복합적인 애플리케이션을 구축하는 방법
• Streamlit의 st.form을 사용하여 여러 개의 질문을 한 번에 제출하고 처리하는 방법

---

데이터 소스 연결 및 모델 설정

🎯 이번 단계에서 배울 것

• WikipediaRetriever를 사용하여 사용자가 입력한 주제에 대한 Wikipedia 문서를 실시간으로 가져오는 방법
• gpt-3.5-turbo-1106과 같은 최신 모델을 사용하여 성능과 비용 효율성을 높이는 방법
• Streamlit의 st.sidebar와 st.selectbox를 활용하여 사용자에게 데이터 소스(파일 또는 Wikipedia) 선택 옵션을 제공하는 방법

📝 1단계: Wikipedia Retriever 연동

전체 코드 (pages/03_QuizGPT.py):

import streamlit as st
from langchain.retrievers import WikipediaRetriever
from langchain.chat_models import ChatOpenAI

# GPT-3.5-Turbo-1106 모델 사용
llm = ChatOpenAI(
    temperature=0.1,
    model="gpt-3.5-turbo-1106",
)

with st.sidebar:
    docs = None
    choice = st.selectbox(
        "Choose what you want to use.",
        ("File", "Wikipedia Article"),
    )
    if choice == "File":
        # ... 파일 업로드 로직 ...
    else:
        topic = st.text_input("Search Wikipedia...")
        if topic:
            # Wikipedia에서 관련 문서 검색
            retriever = WikipediaRetriever(top_k_results=5)
            with st.status("Searching Wikipedia..."):
                docs = retriever.get_relevant_documents(topic)

if not docs:
    st.markdown("Get started by uploading a file or searching on Wikipedia...")
else:
    st.write(docs) # 로드된 문서 표시

🔍 코드 상세 설명

1. WikipediaRetriever

• LangChain에서 제공하는 특수한 검색기(Retriever)로, 사용자의 쿼리를 받아 Wikipedia에서 관련 문서를 검색하고 Document 객체 리스트로 반환합니다.
• top_k_results: 검색 결과 중에서 상위 몇 개의 문서를 가져올지 지정합니다.
• 이를 통해 사용자는 파일 업로드뿐만 아니라, 특정 주제에 대해 즉석에서 퀴즈를 생성할 수 있게 됩니다.

2. GPT-4 Turbo (gpt-3.5-turbo-1106)

• 이 모델은 더 긴 컨텍스트 윈도우를 지원하고, JSON 모드와 같은 새로운 기능을 제공하며, 이전 모델보다 비용 효율적입니다. 구조화된 데이터를 다루는 이번 챕터에 매우 적합합니다.

✅ 체크리스트

• wikipedia 라이브러리를 설치했나요?
• WikipediaRetriever를 사용하여 주제를 검색하고 Document를 성공적으로 가져왔나요?
• st.selectbox를 통해 두 가지 데이터 소스(파일, Wikipedia) 중 하나를 선택하는 UI를 구현했나요?

---

Output Parsers: LLM 길들이기

🎯 이번 단계에서 배울 것

• LLM이 생성한 평범한 텍스트를 엄격한 JSON 형식으로 변환하는 2단계 체인(생성 -> 포맷팅) 설계
• questions_prompt: 주어진 컨텍스트를 기반으로 특정 형식의 텍스트 퀴즈를 생성하도록 지시
• formatting_prompt: 생성된 텍스트 퀴즈를 JSON 형식으로 변환하도록 지시
• JsonOutputParser: LLM이 생성한 JSON 문자열을 Python 딕셔너리로 파싱하는 방법

📝 1단계: 2단계 체인과 JSON 파서 구현

전체 코드 (pages/03_QuizGPT.py):

import json
from langchain.schema import BaseOutputParser

# 1. 사용자 정의 JSON 파서
class JsonOutputParser(BaseOutputParser):
    def parse(self, text):
        text = text.replace("```", "").replace("json", "")
        return json.loads(text)

output_parser = JsonOutputParser()

# 2. 퀴즈 질문 생성을 위한 프롬프트와 체인
questions_prompt = ChatPromptTemplate.from_messages([
    ("system", "... Based ONLY on the following context make 10 questions... Use (o) to signal the correct answer. ... Context: {context}")
])
questions_chain = {"context": format_docs} | questions_prompt | llm

# 3. 생성된 질문을 JSON으로 포맷팅하기 위한 프롬프트와 체인
formatting_prompt = ChatPromptTemplate.from_messages([
    ("system", "... You format exam questions into JSON format. ... Example Output: ... Questions: {context}")
])
formatting_chain = formatting_prompt | llm

# 4. 최종 체인: 생성 -> 포맷팅 -> 파싱
chain = {"context": questions_chain} | formatting_chain | output_parser

# ... Streamlit 로직 ...
if start:
    response = chain.invoke(docs)
    st.write(response) # Python 딕셔너리가 출력됨

🔍 코드 상세 설명

1. 왜 2단계 체인을 사용하는가?
LLM에게 한 번의 프롬프트로 복잡한 작업(내용 기반 질문 생성 + 완벽한 JSON 형식 준수)을 모두 시키면 실패할 확률이 높습니다. 작업을 두 단계로 나누면 각 단계의 역할이 명확해져 훨씬 안정적인 결과를 얻을 수 있습니다.

• questions_chain: 내용에 집중하여 퀴즈 질문과 답변을 텍스트로 생성합니다.
• formatting_chain: 앞서 생성된 텍스트를 입력으로 받아, 오직 JSON 형식으로 변환하는 데에만 집중합니다.

2. JsonOutputParser

• LLM은 종종 JSON 응답을 ```json ... ``` 코드 블록으로 감싸서 반환합니다. 이 파서는 parse 메소드에서 이러한 불필요한 문자열을 제거하고 json.loads()를 사용하여 순수한 JSON 문자열을 Python 객체(딕셔너리/리스트)로 변환합니다.

✅ 체크리스트

• 질문 생성과 JSON 포맷팅을 위한 두 개의 분리된 ChatPromptTemplate을 만들었나요?
• BaseOutputParser를 상속받아 JsonOutputParser를 구현했나요?
• LCEL을 사용하여 questions_chain, formatting_chain, output_parser를 순서대로 연결했나요?

---

퀴즈 UI 및 채점

🎯 이번 단계에서 배울 것

• @st.cache_data를 사용하여 비용이 많이 드는 체인 실행 결과를 캐싱하는 방법
• st.form을 사용하여 여러 개의 질문과 라디오 버튼을 그룹화하고 한 번에 제출하는 방법
• 사용자가 제출한 답안을 정답과 비교하여 즉시 피드백을 제공하는 방법

📝 1단계: 퀴즈 폼(Form) 생성 및 채점 로직 구현

전체 코드 (pages/03_QuizGPT.py):

# ... (이전 코드)

@st.cache_data(show_spinner="Making quiz...")
def run_quiz_chain(_docs, topic):
    chain = {"context": questions_chain} | formatting_chain | output_parser
    return chain.invoke(_docs)

# ... (사이드바 로직)

if docs:
    response = run_quiz_chain(docs, topic if topic else file.name)
    
    with st.form("questions_form"):
        for question in response["questions"]:
            st.write(question["question"])
            # 라디오 버튼으로 선택지 표시
            value = st.radio(
                "Select an option.",
                [answer["answer"] for answer in question["answers"]],
                index=None, # 기본 선택 없음
            )
            # 정답 확인 로직
            if {"answer": value, "correct": True} in question["answers"]:
                st.success("Correct!")
            elif value is not None:
                st.error("Wrong!")
        
        button = st.form_submit_button()

🔍 코드 상세 설명

1. st.form

• with st.form(...) 블록 안에 있는 모든 위젯들은 하나의 폼으로 그룹화됩니다. 사용자가 여러 개의 라디오 버튼이나 텍스트 입력을 변경해도 앱은 재실행되지 않습니다.
• 오직 st.form_submit_button()을 클릭했을 때만 스크립트가 재실행되며, 그 시점의 모든 위젯 값들이 한 번에 제출됩니다. 이는 퀴즈나 설문조사와 같이 여러 입력을 한 번에 처리해야 할 때 매우 유용합니다.

2. 채점 로직

• st.radio는 사용자가 선택한 답변의 문자열을 value에 저장합니다.
• {"answer": value, "correct": True} in question["answers"] 코드는 사용자가 선택한 답변이 정답 리스트 안에 있는지 확인하는 간결하고 효과적인 방법입니다.

✅ 체크리스트

• run_quiz_chain 함수에 @st.cache_data를 적용하여 퀴즈 생성을 캐싱했나요?
• st.form을 사용하여 퀴즈 전체를 감쌌나요?
• for 루프 안에서 st.radio를 사용하여 각 질문에 대한 선택지를 표시했나요?
• 사용자의 선택(value)을 정답과 비교하여 “Correct!” 또는 “Wrong!” 메시지를 표시했나요?

---

Function Calling: 더 안정적인 구조화

🎯 이번 단계에서 배울 것

• OpenAI의 Function Calling 기능을 사용하여 LLM이 항상 지정된 JSON 스키마에 맞춰 응답하도록 강제하는 방법

📝 1단계: Function Calling으로 퀴즈 생성하기

전체 코드 (notebook.ipynb):

from langchain.chat_models import ChatOpenAI
from langchain.prompts import PromptTemplate

# 1. 함수 스키마 정의 (JSON 스키마 형식)
function = {
    "name": "create_quiz",
    "description": "...",
    "parameters": {
        "type": "object",
        "properties": {
            "questions": {
                "type": "array",
                "items": { # ... (질문, 답변, 정답 여부에 대한 상세 스키마) ... }
            }
        },
        "required": ["questions"],
    },
}

# 2. LLM에 함수를 "bind(연결)"하기
llm = ChatOpenAI(temperature=0.1).bind(
    function_call={"name": "create_quiz"}, # 항상 이 함수를 호출하도록 강제
    functions=[function],
)

prompt = PromptTemplate.from_template("Make a quiz about {city}")
chain = prompt | llm

response = chain.invoke({"city": "rome"})

# 3. 결과 추출
arguments = response.additional_kwargs["function_call"]["arguments"]

🔍 코드 상세 설명

1. Function Calling이란?
Function Calling은 LLM에게 단순히 텍스트로 답변하는 대신, 우리가 정의한 특정 함수의 인자(arguments) 형식에 맞는 JSON 객체를 생성하도록 요청하는 기능입니다. 이는 LLM의 출력 형식을 매우 안정적으로 제어할 수 있는 강력한 방법입니다.

• 장점: 복잡한 프롬프트 엔지니어링(예: 2단계 체인)이나 출력 파서 없이도, 모델이 거의 항상 완벽한 JSON 스키마를 준수하도록 강제할 수 있습니다.

2. .bind(function_call=...)

• LCEL의 .bind() 메소드를 사용하여 LLM을 호출할 때 특정 함수를 호출하도록 설정할 수 있습니다.
• function_call={"name": "create_quiz"}: LLM에게 create_quiz 함수의 인자 형식에 맞춰 응답하라고 강제합니다.
• functions=[function]: LLM에게 create_quiz 함수의 스키마(구조)를 알려줍니다.

3. 결과

• 체인을 실행하면, response의 content는 비어있고, additional_kwargs["function_call"]["arguments"] 안에 원하는 JSON 형식의 문자열이 담겨 반환됩니다.

✅ 체크리스트

• JSON 스키마 형식으로 함수의 이름, 설명, 파라미터를 상세히 정의했나요?
• .bind()를 사용하여 LLM에 함수 스키마와 함수 호출을 강제했나요?
• response.additional_kwargs에서 생성된 JSON 결과를 성공적으로 추출했나요?

---

출처 : https://nomadcoders.co/fullstack-gpt