LangFlow | UI for LangChain to Develop Applications with LLMs
LangFlow: Integrating Zapier NLA and Bubble.io with Custom Components
대용량 언어 모델(Large Language Models, LLMs)은 세계를 폭풍처럼 몰아치고 있다. ChatGPT, GPT3, Bard 및 기타 대용량 언어 모델의 등장으로 개발자들은 이러한 모델들과 지속적으로 협력하여 새로운 제품 솔루션을 창출하고 있다. 새로운 하루가 오면 새로운 대용량 언어 모델이나 기존 LLMs의 새로운 버전이 나온다. 이러한 새 버전이나 새 모델들을 따라잡는 것은 각 대용량 언어 모델의 문서를 살펴봐야 하기 때문에 문제가 될 수 있다. LangChain은 모든 다양한 LLMs를 둘러싸는 라이브러리로, 작업을 더 쉽게 만들어준다. 더욱이, LangChain을 기반으로 한 UI인 LangFlow가 도입되어, 직접 작업하고 애플리케이션을 생성하게 되어 상황이 훨씬 나아졌다.
학습 목표
- LangFlow UI 이해
- LangFlow 설치 및 작업
- LangFlow의 내부 작동 방식 배우기
- LangFlow를 사용하여 애플리케이션 생성
- LangFlow를 통해 만든 애플리케이션 공유
What is LangFlow and Why LangFlow?
LangFlow는 react-flow로 설계된 Python 패키지 LangChain을 기반으로 한 그래픽 사용자 인터페이스(UI)입니다. LangChain은 대용량 언어 모델(Large Language Models, LLMs)과 함께 애플리케이션을 생성하기 위해 작동하는 Python 패키지입니다. 이는 에이전트(Agents), LLMs, 체인(Chains), 메모리(Memory), 및 프롬프트(Prompts)와 같은 다양한 컴포넌트로 구성되어 있습니다. 개발자들은 이러한 블록을 연결하여 애플리케이션을 생성합니다. LangChain은 거의 모든 유명한 대용량 언어 모델에 대한 래퍼를 포함하고 있습니다. 이제 LangChain을 사용하려면 애플리케이션을 생성하기 위해 코드를 작성해야 합니다. 코드 작성은 때때로 시간이 많이 소요되고 실수가 발생하기 쉽습니다.
이 부분에서 LangFlow의 필요성이 드러납니다. LangFlow는 LangChain을 기반으로 한 그래픽 UI입니다. LangChain에 포함된 모든 컴포넌트를 포함하고 있습니다. LangFlow는 드래그 앤 드롭 기능을 제공하여 화면에 컴포넌트를 드래그하고 대용량 언어 모델에서 애플리케이션을 구축하기 시작할 수 있습니다. 심지어 모두가 시작할 수 있도록 풍부한 예제도 포함되어 있습니다. 이 글에서는 이 UI를 살펴보고 이를 통해 애플리케이션을 어떻게 구축하는지 알아보겠습니다.
LangFlow는 기능을 향상시키고 애플리케이션의 개발 및 배포를 간소화하기 위해 다른 도구와 통합할 수 있습니다. 다음은 다른 도구와의 통합 및 상호 작용 중 일부입니다:
- Zapier NLA 및 Bubble.io 통합:
LangFlow는 Zapier NLA와 Bubble.io와 함께 작동하여 동적이고 자동화된 솔루션을 구축할 수 있습니다. 이 통합을 통해 개발자들은 이러한 도구들의 기능을 LangFlow와 함께 활용하여 더 복잡하고 자동화된 워크플로우를 생성할 수 있습니다.- Hugging Face 및 Railway 통합:
LangFlow는 교육 목적으로 Hugging Face와 프로덕션 환경에서 LangFlow 기반 애플리케이션을 배포하기 위한 Railway와 같은 도구와 통합할 수 있는 옵션을 제공합니다. 이 통합은 LangFlow 애플리케이션의 배포와 실험을 더 쉽게 만들어줍니다.- 데이터베이스 및 API 래퍼:
LangFlow에는 데이터베이스와 API와 상호 작용하기 위한 다양한 래퍼와 도구가 포함되어 있습니다. 예를 들어, 특정 API와 상호 작용하기 위한GoogleSerperAPIWrapper컴포넌트와 SQL 데이터베이스에서 메타데이터를 검색하기 위한InfoSQLDatabaseTool도구가 있습니다.- Langfuse 통합:
Langfuse는 LLM 애플리케이션용으로 설계된 오픈 소스 추적 및 분석 도구로, LangFlow와 통합하여 제품의 품질, 비용, 및 지연에 대한 상세한 생산 추적 및 세밀한 인사이트를 제공합니다. 이 통합은 LangFlow 애플리케이션의 관찰 및 디버깅 기능을 향상시킵니다.- Langfuse 모니터링:
Langfuse 통합을 통해 개발자들은 LangFlow의 채팅이나 API를 모니터링하고 디버깅할 수 있으며, LangFlow 애플리케이션의 관찰 및 디버깅 기능을 더욱 향상시킬 수 있습니다.- Langfuse를 통한 프로토타이핑 및 모니터링:
react-flow로 설계된 LangFlow는 흐름의 무리없는 실험과 프로토타이핑을 허용합니다. 생성 후 개발자들은 Langfuse를 사용하여 LangFlow 애플리케이션을 모니터링하고 개선할 수 있어 개발에서 모니터링 및 개선 단계로의 원활한 전환을 제공합니다.이러한 통합들은 개발자들이 LangFlow와 기타 대용량 언어 모델을 사용하여 애플리케이션을 생성, 배포, 모니터링 및 개선할 수 있는 유리한 환경을 제공하며, 전체 개발 수명주기를 간소화합니다.
Let’s Start with Langflow
이제 LangFlow가 무엇인지, 그리고 어떻게 활용될 수 있는지 살펴보았으니, 그 기능성을 더 잘 이해하기 위해 실제로 사용해 보겠습니다. LangFlow UI는 자바스크립트와 파이썬 모두에서 사용할 수 있습니다. 둘 중 하나를 선택하여 작업을 시작할 수 있습니다. 파이썬 버전을 사용하려면 시스템에 파이썬이 설치되어 있어야 하며, LangChain 라이브러리가 필요합니다.
LangFlow를 pip를 통해 설치할 수 있습니다:
# 이 명령은 로컬 모델에 대한 종속성 없이 패키지를 설치합니다 pip install langflow
위의 명령을 사용하면 langflow 패키지가 설치됩니다. 이는 로컬 모델에 대한 종속성 없이 LangFlow 패키지만 설치합니다. 필요한 경우 추가 패키지와 종속성을 따로 설치해야 할 수 있습니다.
위의 명령을 사용하면 Langflow 패키지와 LangChain 패키지가 설치됩니다. 이제 UI를 시작하려면 다음 명령을 사용합니다.
python -m langflow
(또는)
langflow run
이제 LangFlow UI가 실행되고 있습니다. 로컬 호스트의 포트 번호 7860에서 실행됩니다. 이렇게 하면 LangFlow를 설치하고 작업을 시작할 수 있습니다.
위의 화면 오른쪽 상단 “New Project”를 클릭합니다. 아래처럼 LangFlow UI를 볼 수 있습니다.
여기서 오른쪽 공백은 컴포넌트를 드래그하여 애플리케이션을 생성할 공간입니다. 그리고 컴포넌트들은 왼쪽에 위치해 있으며 (에이전트(Agents), 체인(Chains), 로더(Loaders) 등) 포함되어 있습니다. ‘컴포넌트(Comps)’를 클릭하면 다양한 유형의 컴포넌트들이 표시되며, 이 중 하나를 선택하고 공백으로 드래그합니다. 공백에서는 다양한 컴포넌트들을 조합하여 전체 애플리케이션을 구성합니다.
이러한 방식은 사용자에게 직관적이고 시각적인 방식으로 애플리케이션을 구성하고 조작할 수 있는 유연성을 제공합니다. 각 컴포넌트는 특정 기능을 수행하며, 이를 통해 사용자는 필요에 따라 컴포넌트들을 연결하고 조합할 수 있습니다. 이는 복잡한 작업을 단순화하고, 개발자와 사용자 모두에게 애플리케이션 개발 및 수정을 더 쉽게 만들어줍니다.
LangFlow UI 이해하기
이 섹션에서는 LangFlow의 UI, 그 안에 존재하는 요소들, 그리고 UI가 어떻게 작동하는지 간략하게 이해하여 LangFlow를 사용하여 대용량 언어 애플리케이션을 빠르게 구축하는 방법에 대해 더 잘 이해하겠습니다.
- 컴포넌트 선택 및 드래그:
LangFlow의 UI는 컴포넌트를 선택하고 드래그하여 애플리케이션을 구축할 수 있는 공간을 제공합니다. 컴포넌트는 왼쪽 패널에 위치하며, 사용자는 이를 선택하고 중앙의 공백으로 드래그하여 애플리케이션을 구성할 수 있습니다. - 컴포넌트 조합:
선택한 컴포넌트들은 중앙의 공백에서 서로 연결될 수 있으며, 이를 통해 사용자는 다양한 컴포넌트들을 조합하여 애플리케이션을 구축할 수 있습니다. - 에이전트, 체인, 로더 등의 컴포넌트:
LangFlow는 에이전트(Agents), 체인(Chains), 로더(Loaders) 등과 같은 다양한 유형의 컴포넌트를 제공합니다. 이러한 컴포넌트들은 각각 특정 기능을 수행하며, 서로 연결되어 복잡한 작업을 수행할 수 있습니다. - 프로젝트 생성 및 관리:
LangFlow의 UI는 새 프로젝트를 생성하고, 저장하며, 다시 로드할 수 있는 기능을 제공합니다. 이를 통해 사용자는 여러 프로젝트를 쉽게 관리하고, 이전 작업을 계속할 수 있습니다. - 실시간 피드백:
LangFlow는 작업을 수행하면서 실시간으로 피드백을 제공하여, 사용자가 애플리케이션의 작동 방식을 쉽게 이해하고 수정할 수 있게 합니다.
LangFlow의 UI는 직관적이고 사용하기 쉬우며, 대용량 언어 모델과 함께 빠르고 효율적으로 애플리케이션을 구축할 수 있게 도와줍니다. 이러한 기능들을 이해하고 활용하면, 개발자와 사용자 모두 LangFlow를 통해 강력하고 유용한 애플리케이션을 쉽게 생성할 수 있습니다.
위의 그림에서 LangFlow UI의 오른쪽 상단 부분을 볼 수 있습니다. 두 번째 아이콘은 ‘내보내기(Export)’ 옵션을 나타냅니다. LangFlow를 통해 애플리케이션을 구축하고 이제 로컬 머신에 다운로드하려고 할 때, 애플리케이션 구성을 JSON 파일로 변환하여 이를 수행할 수 있습니다. ‘내보내기(Export)’ 옵션을 클릭하면 애플리케이션의 정보가 포함된 JSON 파일을 다운로드할 수 있습니다. 이제 다른 사용자가 동일한 애플리케이션을 구축하려고 하면, 첫 번째 옵션인 ‘가져오기(Import)’를 클릭하고, JSON 파일을 전달할 수 있습니다.
이러한 기능은 LangFlow를 통해 생성된 애플리케이션의 구성을 쉽게 공유하고 재사용할 수 있도록 도와줍니다. 또한 이는 협업을 더 쉽게 만들고, 다른 사람들과 작업을 공유하고, 다양한 환경에서 애플리케이션을 쉽게 배포하고 테스트할 수 있도록 합니다.
세 번째 옵션은 애플리케이션을 파이썬 코드로 변환하는 기능을 제공합니다. 이를 통해 LangFlow 웹사이트에 매번 접속하지 않고도 로컬 시스템에서 직접 애플리케이션을 사용하고 작업할 수 있습니다. 이 기능은 개발자에게 애플리케이션의 코드 버전을 제공하여, 자신의 로컬 환경에서 더욱 효과적으로 작업을 수행할 수 있도록 도와줍니다. 또한 이는 애플리케이션의 코드를 이해하고, 필요에 따라 코드를 수정하고 확장하는데 도움이 됩니다.
파이썬 코드 변환 옵션은 LangFlow의 유연성과 확장성을 더욱 강화하며, 웹 기반 UI와 로컬 개발 환경 간의 부드러운 전환을 제공하여 개발자의 작업 흐름을 더욱 향상시킵니다. 이러한 기능은 LangFlow를 사용하여 대용량 언어 모델 기반의 애플리케이션을 더욱 효율적으로 개발, 테스트, 배포할 수 있도록 지원합니다.
LangChain은 많은 대용량 언어 모델(Large Language Models, LLMs)에 대한 래퍼를 제공합니다. 각 대용량 언어 모델은 작업을 수행하기 위한 자체 API를 가지고 있습니다. 따라서 LangFlow에서 LLM을 사용하려고 시도할 때, 위에서 볼 수 있듯이 API 키를 추가할 수 있는 옵션을 제공합니다. 더불어 대용량 언어 모델의 유형을 선택할 수 있는 옵션도 제공됩니다.
이러한 기능은 개발자들에게 다양한 LLMs와 상호 작용할 수 있는 유연성을 제공하며, 필요에 따라 특정 LLM을 선택하고 해당 LLM의 API 키를 입력하여 작업을 수행할 수 있도록 돕습니다. 이는 LangFlow를 사용하여 빠르고 쉽게 다양한 LLMs와의 통합 애플리케이션을 구축할 수 있도록 지원합니다. 또한 이는 애플리케이션의 구성과 실행을 더욱 쉽게 만들어 주며, 다양한 LLMs를 통해 새로운 기능과 서비스를 쉽게 탐색하고 테스트할 수 있도록 합니다.
OpenAI 대용량 언어 모델 래퍼
OpenAI 대용량 언어 모델 래퍼는 LangFlow의 LLM 섹션에서 찾을 수 있습니다. 이를 흰색 영역으로 드래그할 수 있습니다. 여기서 우리는 작업하려는 모델 유형을 선택할 수 있습니다. 지금은 Davinci 모드로 설정하겠습니다. 그리고 온도(temperature), 즉 모델이 얼마나 창의적으로 작동해야 하는지를 0.7로 설정하고 최대 토큰(max tokens)을 256으로 설정합니다. Open API Key 필드에는 Open API Key를 제공해야 하며, 그 아래의 필드는 비워둘 수 있습니다.
- 모델 선택:
- 작업하려는 모델 유형을 선택하십시오. 여기서는 Davinci 모델을 선택했습니다.
- 온도 설정:
- 모델의 창의성을 제어하기 위해 온도를 0.7로 설정하십시오.
- 최대 토큰 설정:
- 모델이 생성할 수 있는 토큰의 최대 수를 256으로 설정하십시오.
- Open API Key 입력:
- Open API Key 필드에 API 키를 입력하십시오. 이 키는 OpenAI의 대용량 언어 모델과 상호 작용하는 데 필요합니다.
이러한 설정을 완료하면 LangFlow를 사용하여 OpenAI 대용량 언어 모델과 함께 작업을 시작할 준비가 되었습니다. 이 설정들은 모델의 작동 방식과 출력을 제어하며, LangFlow UI를 통해 쉽게 액세스하고 조정할 수 있습니다.
프롬프트 템플릿
그림에서 볼 수 있듯이, 우리는 프롬프트 템플릿을 흰색 영역으로 드래그했습니다. 여기서 개발 중인 애플리케이션은 유머 있게 답변하는 간단한 봇이므로 프롬프트 템플릿을 그에 따라 작성해야 합니다.
프롬프트 템플릿:
당신은 인간의 각 쿼리에 유머러스하게 응답하는 AI 봇입니다.
인간: {query}
AI:
이 템플릿은 Large Language Model에게 사용자의 쿼리에 어떻게 반응해야 하는지 알려줍니다. 특히, 이 템플릿은 모델에게 유머러스한 방식으로 응답하도록 지시합니다. 사용자의 쿼리는 {query} 플레이스홀더를 통해 전달되며, 모델은 이 템플릿을 기반으로 유머러스한 응답을 생성합니다.
이 템플릿을 LangFlow의 프롬프트 템플릿 영역에 드래그하고, 필요한 정보를 입력함으로써, 애플리케이션은 사용자의 쿼리에 유머러스하게 응답할 수 있도록 설정됩니다. 이후에는 이 템플릿과 Large Language Model, 그리고 이들을 연결하는 LLM 체인을 조정하여 애플리케이션을 완성할 수 있습니다.
LLM 체인
이제 마지막 요소인 체인(Chain) 요소로 이동합니다. LLM 체인은 우리의 OpenAI 대용량 언어 모델과 프롬프트 템플릿을 함께 연결하는 것입니다. UI의 왼쪽에 있는 체인(Chains) 섹션에서 LLMChain을 찾을 수 있습니다. 마침내 모든 것을 함께 연결할 시간입니다.
- LLMChain 드래그:
- 왼쪽 패널의 체인(Chains) 섹션에서 LLMChain 컴포넌트를 찾아 흰색 영역으로 드래그합니다.
- 모델 및 템플릿 연결:
- LLMChain을 사용하여 OpenAI 대용량 언어 모델과 프롬프트 템플릿을 연결합니다. 이를 통해 두 요소가 서로 상호 작용할 수 있도록 설정합니다.
- 체인 구성:
- 필요한 설정을 입력하고 체인을 구성하여 모델이 템플릿을 올바르게 사용하고 사용자의 쿼리에 응답할 수 있도록 합니다.
- 테스트 및 검증:
- 모든 것이 올바르게 연결되었는지 확인하고, 필요에 따라 체인의 구성을 조정하여 애플리케이션의 작동을 최적화합니다.
이 단계를 완료하면 애플리케이션의 모든 요소가 연결되어 작동하며, 사용자의 쿼리에 유머러스하게 응답하는 간단한 채팅봇 애플리케이션을 완성할 수 있습니다. LLMChain은 모델과 템플릿 사이의 통신을 관리하며, 애플리케이션의 로직과 흐름을 제어합니다. 이를 통해 개발자는 LangFlow UI를 사용하여 빠르고 쉽게 대용량 언어 모델 기반의 애플리케이션을 구축할 수 있습니다.
위의 이미지처럼, 프롬프트 템플릿을 LLMChain의 프롬프트에 연결하고 OpenAI 끝을 LLMChain의 LLM 끝에 연결합니다.
애플리케이션 테스트
이제 애플리케이션을 테스트할 시간입니다. 애플리케이션을 실행하려면 UI의 오른쪽 하단에 있는 Thunderbolt 아이콘을 클릭합니다. OpenAI 키가 유효하다면 각 요소의 상단에, 요소 이름 근처에 초록색 점이 표시됩니다(초기에는 노란색) 그런 다음 Thunderbolt 아이콘 아래에 파란색 채팅 아이콘을 볼 수 있습니다. 파란색 채팅 아이콘을 클릭합니다.
- 애플리케이션 실행:
- Thunderbolt 아이콘을 클릭하여 애플리케이션을 실행합니다. 이 아이콘은 애플리케이션을 실행하고 테스트하는 데 사용됩니다.
- 상태 확인:
- OpenAI 키가 유효하면 각 요소에 초록색 점이 표시됩니다. 이는 애플리케이션의 각 부분이 올바르게 구성되고 작동 중임을 나타냅니다.
- 채팅 아이콘 클릭:
- 파란색 채팅 아이콘을 클릭하여 애플리케이션의 채팅 인터페이스를 엽니다. 여기서 사용자의 쿼리를 입력하고 애플리케이션의 응답을 테스트할 수 있습니다.
이 단계를 완료하면 애플리케이션을 테스트하고 어떻게 작동하는지 확인할 수 있습니다. 필요에 따라 추가 조정을 수행하여 애플리케이션의 작동을 최적화할 수 있습니다. LangFlow의 이러한 기능은 개발자가 빠르게 프로토타입을 생성하고 테스트할 수 있도록 도와줍니다.
채팅 창
클릭하면 채팅 창이 열리며, 이제 UI에서 제공한 대용량 언어 모델과 채팅할 수 있습니다. 봇에게 “어떻게 지내?”라고 물어보면, 봇은 유머러스하게 답변해야 합니다.
- 채팅 창 사용:
- 채팅 창에서 “어떻게 지내?”라고 입력하고 엔터를 누릅니다.
- 봇의 응답 확인:
- 봇은 설정된 프롬프트 템플릿에 따라 유머러스한 방식으로 답변할 것입니다.
- 응답 조정 (필요한 경우):
- 봇의 응답이 기대한 것과 다르다면, 프롬프트 템플릿을 조정하거나 LLMChain 설정을 변경하여 봇의 응답을 개선할 수 있습니다.
이 프로세스를 통해 애플리케이션을 테스트하고 봇이 사용자의 쿼리에 어떻게 응답하는지 확인할 수 있습니다. 또한, 이는 애플리케이션을 더 나은 사용자 경험으로 튜닝하는 데 필요한 피드백을 제공합니다. LangFlow의 채팅 인터페이스는 대화형 애플리케이션을 빠르고 쉽게 테스트하고 디버깅할 수 있게 도와줍니다.
결론
LangFlow UI는 Python의 LangChain 프레임워크 위에 구축되었으며, 이 패키지는 대용량 언어 모델을 사용하여 애플리케이션을 생성하기 위해 광범위하게 활용됩니다. UI의 컴포넌트를 살펴보았고, UI를 사용하여 모델을 구축하고 JSON 파일로 내보내어 다른 사람과 공유하는 방법을 확인했습니다. 이 UI를 사용하면 고급 애플리케이션을 생성할 수 있는 가능성은 무한합니다.
LangFlow UI는 개발자들에게 대용량 언어 모델과 함께 작업할 때 중요한 유연성과 편의성을 제공하며, 빠르게 프로토타입을 만들고 테스트할 수 있게 해줍니다. 또한, 모델을 JSON 파일로 내보내어 다른 사람과 쉽게 공유할 수 있어 협업을 간소화하고 효율성을 높여줍니다. LangFlow의 드래그 앤 드롭 인터페이스와 구성 요소 기반 아키텍처는 대용량 언어 모델 기반의 애플리케이션 개발을 접근하기 쉽고 덜 복잡하게 만들어, 다양한 애플리케이션과 솔루션을 탐색하고 구축할 수 있는 무대를 제공합니다.
주요 내용 정리
- LangFlow는 LLM(대용량 언어 모델)과 함께 애플리케이션을 구축하기 위해 쉬운 드래그 앤 드롭 기능을 제공합니다.
- LangFlow UI는 Python과 JavaScript 두 가지에서 사용할 수 있습니다.
- 이 UI는 사용자가 애플리케이션을 JSON 파일로 변환할 수 있게 해서 공유하기 쉽게 만들어 줍니다.
- LangFlow는 Python 패키지도 함께 제공하며, 사용자는 이를 설치하고 JSON 파일의 경로를 제공함으로써 LangFlow에서 구축한 애플리케이션을 실행할 수 있습니다.
- LangFlow는 비개발자에게도 대용량 언어 모델을 활용한 애플리케이션 구축을 용이하게 해줍니다.
