Gradio 와 LangChain 을 이용한 챗봇

이 글은 Gradio 와 LangChain 을 이용한 챗봇 예제이다.

터미널에서 다음 라이브러리를 설치한다.

pip install gradio langchain

다음을 코딩하고 실행한다. 

from langchain.chat_models import ChatOpenAI

from langchain.schema import AIMessage, HumanMessage, SystemMessage

import os

import gradio as gr

os.environ["OPENAI_API_KEY"] = "<input your openai key" 

llm = ChatOpenAI(temperature=1.0, model='gpt-4o-mini')

def response(message, history, additional_input_info):

    history_langchain_format = []

    history_langchain_format.append(SystemMessage(content= additional_input_info))

    for human, ai in history:

            history_langchain_format.append(HumanMessage(content=human))

            history_langchain_format.append(AIMessage(content=ai))

    history_langchain_format.append(HumanMessage(content=message))

    gpt_response = llm(history_langchain_format)

    return gpt_response.content

gr.ChatInterface(

    fn=response,

    textbox=gr.Textbox(placeholder="Talk", container=False, scale=7),

    chatbot=gr.Chatbot(height=1000),

    title="ChatBot",

    description="I'm a chatbot that can chat with you. I'm lovely chatbot.",

    theme="soft",

    examples=[["Hi"], ["I'm good"], ["What's your name?"]],

    retry_btn="resend",

    undo_btn="delete❌",

    clear_btn="delete all💫",

    additional_inputs=[

        gr.Textbox("", label="Input System Prompt", placeholder="I'm chatbot.")

    ]

).launch()

결과는 다음과 같다.

레퍼런스

• Quickstart
• Gradio | 🦜️🔗 LangChain

LangChain 기본 개념 및 동작 코드 분석하기

주요 구성 요소
도구(Tools)
LangChain에서 도구는 에이전트가 자연어 처리 이상의 작업을 수행할 수 있도록 제공되는 기능이나 API이다. 이 코드는 이를 명확히 정의하고 에이전트가 사용할 수 있도록 등록하고 있다.

코드에서의 예시:
functions = {
    "getWeather": {
        "name": "getWeather",
        "description": "Realtime info about the weather.",
        "parameters": CITY_PARAM,
        "function": partial(get_request, "/api/weather")
    },
    "getPopulation": {
        "name": "getPopulation",
        "description": "Realtime info about the population.",
        "parameters": CITY_PARAM,
        "function": partial(get_request, "/api/population")
    },
}
이름(name): 각 도구를 고유하게 식별할 수 있는 이름이다.
설명(description): 도구가 수행하는 작업을 설명한다.
매개변수(parameters): 도구가 받는 입력의 JSON 스키마를 정의한다.
함수(function): 도구가 실제로 실행할 작업이다. 여기서는 partial을 사용해 API 엔드포인트를 바인딩하였다.
LangChain과의 대응: LangChain에서 Tool 클래스 또는 tool 데코레이터로 도구를 정의하며, 위 코드와 유사한 방식으로 도구를 등록한다.

메모리(Memory)
메모리는 에이전트가 대화의 문맥을 유지하도록 돕는다. 제공된 코드에서는 messages 리스트가 이러한 역할을 한다.
코드에서의 예시:
messages = []
messages.append({"role": "system", "content": "You are an AI assistant with multiple tools..."})
messages 리스트는 대화 이력을 저장하며, 시스템 프롬프트, 사용자 입력, 모델 응답을 순차적으로 기록한다.
LangChain과의 대응: LangChain에서는 ConversationBufferMemory, ConversationSummaryMemory와 같은 메모리 모듈을 사용해 대화 이력을 관리한다.

에이전트 루프(Agent Loop)
에이전트 루프는 모델의 응답을 처리하고, 필요한 경우 도구를 호출하며, 사용자가 원하는 결과를 도출할 때까지 반복한다.
코드에서의 예시:
iter = 0
while iter < MAX_ITERATIONS:
    response = openai.ChatCompletion.create(...)
    if message.get("function_call"):
        function_name = message["function_call"]["name"]
        results = call_function(function_name, function_input)
        messages.append({"role": "function", "name": function_name, "content": results})
        iter += 1
    else:
        return message['content']

모델이 도구 호출 여부를 판단하며, 호출한 결과를 메시지 이력에 추가한 후 루프를 반복한다.
LangChain과의 대응: LangChain의 AgentExecutor는 에이전트의 도구 호출 및 반복 작업을 자동으로 관리한다.

확장된 구성 요소
동적 도구 호출
도구를 동적으로 호출하기 위해 도구 이름과 매개변수를 사용하여 실행하는 로직이 포함되어 있다.
코드에서의 예시:
def call_function(name, params):
    f = functions[name]
    return f['function'](json.loads(params))
도구 이름과 입력 데이터를 기반으로 적절한 함수를 실행한다.
LangChain과의 대응: LangChain은 등록된 도구의 run 메서드를 사용해 자동으로 호출하며, 이를 에이전트 실행 플로우에 통합한다.

반복적 추론
에이전트는 도구 결과를 기반으로 추가적인 작업을 수행하며, 원하는 결과를 얻기 위해 여러 차례 도구를 호출한다.
코드에서의 예시:
while 루프에서 반복적으로 도구를 호출하거나 모델의 응답을 처리한다.
LangChain과의 대응: LangChain은 이러한 작업을 지원하는 에이전트 프레임워크를 제공하며, react 기반 에이전트가 이러한 반복적 추론을 처리한다.

LangChain의 주요 기능과 비교
a. 도구 통합
제공된 코드에서 functions와 get_functions_for_model은 LangChain의 도구 등록 및 사양 정의와 유사하다.
b. 메모리 관리
대화 이력을 messages 리스트로 관리하는 방식은 LangChain의 메모리 모듈과 직접 대응된다.
c. 에이전트 루프
제공된 코드의 루프는 LangChain의 AgentExecutor와 구조적으로 유사하며, 사용자 정의 작업과 도구 호출을 통합한다.
d. 프롬프트 설계
시스템 메시지와 도구 사양이 포함된 구조는 LangChain의 프롬프트 엔지니어링 방식과 맞닿아 있다.

결론
제공된 코드는 LangChain의 구조와 철학을 잘 반영한 사례로, 도구 통합, 메모리 관리, 에이전트 루프의 구현 방식을 보여준다. LangChain은 이와 같은 구조를 확장 가능하고 재사용 가능한 방식으로 제공하며, 코드 작성과 관리의 복잡성을 줄이는 데 도움을 준다. LangChain을 사용하면 이러한 구성 요소를 더 간결하게 관리할 수 있으며, 다양한 에이전트 유형과 도구를 손쉽게 통합할 수 있다. 

레퍼런스

• Why you don’t need LangChain for building a RAG bot | Artificial Intelligence in Plain English
• Unexpected value passed to LangChain Tool argument - Stack Overflow
• Challenges in Tool Selection for Multi-Tool Agents with Langchain : r/LangChain
• Langchain is pointless : r/LangChain
• Is anyone actually using Langchain in production? : r/LangChain

Polygonjs 기반 인터랙티브 3D 앱 만들기

요즘 디지털 환경에서 인터랙티브 3D 경험은 다양한 산업에서 필수 요소가 되고 있다. 과학 시각화, 제품 쇼케이스, 비디오 게임, 디지털 트윈, 설정 도구(Configurators), 그리고 예술 작품까지, 3D 콘텐츠는 어디에서나 볼 수 있으며 그 활용 범위는 점점 넓어지고 있다.

그러나 이러한 몰입형 경험을 만드는 일은 쉽지 않다. 3D 디자인과 웹 기술 모두에 대한 전문 지식이 필요하며, 단순히 기능적으로 만드는 것조차 어려울 수 있다. 여기에 더해 텍스처 아티스트, 모델러, 리거, 애니메이터, 룩데브(look dev), 쉐이더 개발자 등 3D 분야의 다양한 전문성을 요구하기 때문에 작업은 금세 복잡해질 수밖에 없다.

머리말

Polygonjs는 이러한 과정을 단순화하고 쉽게 만들어주는 도구이다. Polygonjs는 다음과 같은 특징으로 웹용 3D 제작을 지원한다.

• 사용하기 쉬움: 누구나 쉽게 접근할 수 있는 직관적인 도구이다.
• 확장 가능: 특정 요구 사항과 워크플로에 맞게 확장할 수 있다.
• 강력함: 아름답고 성능이 뛰어난 3D 경험을 만들 수 있다.

Polygonjs는 복잡함을 줄이고 창의성에 집중할 수 있도록 돕는다. 이제 Polygonjs를 사용하여 더 간단하고 빠르게, 그리고 멋진 3D 경험을 만들어 본다.

Modeling/CAD_basics

만들어보기

다음 명령을 실행해 본다. 

npm create polygonjs@latest

npm add polygonjs-editor

npm run polygon

레퍼런스

• Polygonjs: WebGL Design & Animation Tool
• polygonjs: node-based WebGL design tool
• Polygonjs - node-based WebGL design tool
• Simple yet powerful CAD (Computer Aided Design) library, written with Python.