뒤로
Cailyn Yong
Cailyn Yong ·

심심해서 해커톤 참여해서 10분 안에 아이디어 만들고 논 후기

10분 안에 웹사이트 글 정리해주는 AI 에이전트 만들기

안녕하세요! 오랜만에 개발글로 돌아왔습니다.

오늘은 정말 간단하게 10분 안에

  • 웹사이트 링크 데이터를 스크레이프하고

  • faiss와 같은 백터스페이스 (데이터베이스)에 저장한 다음

  • 웹사이트 데이터를 한번에 요약해주는 LLM 체인

만드는 법에 대해 올릴 예정입니다.

예전에 만들었던 몇가지 사이드프로젝트 중에 웹사이트를 그 사이트 내용에 맞는 트위터 홍보용 게시물로 자동으로 만들어주는 AI Agent 툴을 빌드했었는데 이번에 ETH Con이라는 블록체인 해커톤을 참여하면서 비슷한 아이디어로 빌딩했습니다.

2.jpeg

이번에는 제가 최근에 알게된 기업, FiscalNote라는 곳을 참고하면서 아이디어를 떠올리게 됐습니다. FiscalNote는 Tim Hwang이 창업한 AI 기반 법률·정책 빅데이터 미디어 기업으로 정부 정책을 매일매일 업데이트 받아야하고 자세하게 알아야하는 국회의원 혹은 비즈니스들을 위해 정리, 요약, 분석해주는 서비스입니다.

마찬가지로 블록체인 업계에서는 매일매일 새로운 governance proposal이 올라오는데요, 이 정책들은 블록체인을 어떻게 운영할 것인지, 어떤 기술을 새로 접목시킬 건지, 토큰 수량은 몇개를 배포할건지 등에 대한 것들입니다.

그래서 특정 블록체인 위에서 빌딩을 하고 있는 개발자나 창업가는 새롭게 결정되는 정책들에 대해 무조건 알고 있어야만 하죠. 하지만 매일 올라오는 정책들을 매번 알고 있기가 어려워 아예 따로 이런 정책들만 요약해주는 비서를 두기도 합니다.

이걸 해결하기 위해 저는 이런 정책들을 한번에 요약해주는 AI 에이전트를 LLM을 활용해서 만들었습니다.

바로 빌딩 들어가시죠! :)

저번과 마찬가지로 저희는 가상환경을 만들고 그 안에서 python 코드를 돌릴 예정입니다.

가상 환경을 만드는 과정은 제 전 포스트에서 확인하실 수 있습니다.

1) VSCode를 열어서 새로운 폴더를 만드세요.

2) 폴더 내에서 터미널을 열어 python -m venv venv 명령어를 입력합니다.

3) 다음 source venv/bin/activate 를 입력해서 가상환경을 실행시켜줍니다.

4) 우리에게 필요한 library들을 다운로드 해줍니다.

pip install openai langchain
pip install openai chromadb
pip install bs4
pip install python-dotenv
pip install tiktoken
pip install streamlit

다 install 하셨다면 이제 본격적으로 코드로 들어갈게요! 이번 프로젝트는 코드가 50줄밖에 안됩니다 ㅎㅎ

예전 프로젝트들과 마찬가지로 저희는 OpenAI의 API key를 써야하기 때문에 만든 폴더 내에서 .env라는 파일을 만들어주세요.

그러고 .env 파일 내에 API key를 저장해주세요. 아래 이미지와 같은 형태로.

Screenshot 2023-09-12 at 8.02.04 PM.png폴더 내에 새로운 코드 파일을 만들어주세요. 저는 파일 이름을 summarizer.py 라고 이름 지었습니다. 다음 필요한 library 모듈들을 불러옵니다.

import dotenv
dotenv.load_dotenv()
from langchain.text_splitter import RecursiveCharacterTextSplitter
from langchain.embeddings import OpenAIEmbeddings
from langchain.vectorstores import Chroma
from langchain.document_loaders import WebBaseLoader
from langchain.chains import RetrievalQA
from langchain.chat_models import ChatOpenAI
from langchain.prompts import PromptTemplate
import streamlit as st

그 다음 저희는 streamlit이라는 python 코드를 바로 프론트엔드 UI로 만들어주는 패키지를 쓸겁니다. 위에서 맨 마지막 줄에 import streamlit as st 보이시죠? 저희는 앞으로 코드에 st를 쓸때마다 streamlit 패키지를 쓴다고 이해하시면 됩니다.

st.title("Chain Reporter")

def get_text():
    input_text = st.text_input("Type in the governance proposal below", key="input")
    return input_text 

user_input = get_text()
  • 첫번째 코드 줄, st.title("Chain Reporter")은 웹사이트 제목이 됩니다.

  • 그 다음 def get_text() 함수는 유저가 웹사이트 링크를 텍스트 박스에 넣었을때 불러와서 input_text라는 변수에 저장하는 것입니다.

  • user_input = get_text() 에서는 get_text()라는 함수를 콜해서 그 결과값인 url 링크를 user_input이라는 곳에 저장하는 겁니다.

이렇게 하고 나서 터미널에 가상환경을 실행시켰다면 streamlit run summarizer.py 를 돌리면 새로운 웹사이트가 아래 이미지처럼 뜹니다.

Screenshot 2023-09-12 at 7.43.18 PM.png다음 유저가 준 url 링크에 있는 웹사이트 내용을 백터스토어에 저장한 다음 그 내용을 정리해주는 llm 체인을 만들겁니다.

if(user_input):
    loader = WebBaseLoader(user_input)
    data = loader.load()

    text_splitter = RecursiveCharacterTextSplitter(chunk_size = 500, chunk_overlap = 0)
    all_splits = text_splitter.split_documents(data)

    vectorstore = Chroma.from_documents(documents=all_splits, embedding=OpenAIEmbeddings())

    question = "Summarize the main points of this proposal"
    docs = vectorstore.similarity_search(question)
    len(docs)

    template = """Use the following pieces of context to answer the question at the end. 
    If you don't know the answer, just say that you don't know, don't try to make up an answer. 
    Use three sentences maximum. Return the result as a list. 
    {context}
    Question: {question}
    Helpful Answer:"""
    QA_CHAIN_PROMPT = PromptTemplate.from_template(template)

    llm = ChatOpenAI(model_name="gpt-3.5-turbo", temperature=0)
    qa_chain = RetrievalQA.from_chain_type(
        llm,
        retriever=vectorstore.as_retriever(),
        chain_type_kwargs={"prompt": QA_CHAIN_PROMPT}
    )
  • 맨 처음 if(user_input)은 유저 인풋이 있어야만 llm이 실행된다는 것입니다.

  • 다음 loader = WebBaseLoader(user_input)은 유저가 준 링크의 내용을 스크레이프해서 loader라는 값에 저장하고,

  • data = loader.load()는 loader에 저장돼있는 내용을 로딩해서 data 값에 저장하는 것입니다.

  • 다음줄에서는 내용이 많은 경우 split을 해주는 것입니다. split을 한다음 vectorstore이라는 값에 저장을 해줍니다.

  • 그 다음 question 변수에는 "이 정책의 핵심 내용들을 정리해줘"라는 명령을 저장합니다.

  • 그럼 docs에서는 질문의 요지에 맞게 답을 찾기 위해 아까 백터스토어에 저장한 내용 내에서 similarity search를 합니다.

  • 이제 LLM을 만들 차례입니다. template에서는 "컨텍스트에 맞게 질문에 대한 알맞는 답을 알려줘. 만약 답을 모른다면 모른다고 말하고 본 내용과 관련없는 새로운 이상한 결과물을 출력하지 마."라고 써있습니다.

  • 이 템플릿을 이제 QA_CHAIN_PROMPT에 넣어주고, 다음 줄에서는 ChatOpenAI 기반의 llm을 만들어줍니다. 저희는 gpt-3.5을 썼습니다.

  • 마지막으로 qa_chain에서는 RetrievalQA이라는 질의응답이 가능한 형태의 llm을 써서 아까 만든 템플릿을 저장한 QA_CHAIN_PROMPT을 넣어줍니다.

이제 이 function을 실제 웹사이트에서 쓸 수 있도록 해줍니다!

if(user_input):
    result = qa_chain({"query": question})
    result["result"]

이렇게 한다음, 아까 뜬 웹사이트에서 텍스트 박스에 url 링크를 입력하고 엔터키를 누르면 llm체인이 돌아가기 시작하고, 몇 초 후에는 내용을 요약한 결과값이 나옵니다.

Screenshot 2023-09-12 at 7.58.38 PM.png이런식으로 블록체인 정책 뿐만 아니라 template의 내용을 바꿔가면서 논문 요약 정리를 해주는 에이전트를 만들 수도 있고, 빠르게 마케팅 홍보 트윗도 생성해주는 에이전트도 만들 수 있습니다.

이렇게 만들고 발표까지 야심차게 하고 놀았습니다. ㅋㅋㅋㅋ

KakaoTalk_Photo_2023-09-12-20-15-56.jpeg풀 투토리얼 동영상은 유투브에서 확인하실 수 있습니다! (영어 주의) https://youtu.be/MeRXRDQU-2A?si=O6fpZiTwmhF44zui

전체 코드 이미지입니다.

Screenshot 2023-09-12 at 8.03.55 PM.png오늘도 긴글 읽어주셔서 감사합니다! 혹시 질문이 있거나 코드가 안된다면 답글로 남겨주세요. 최대한 도와드리겠습니다 :)

10X AI Club 그룹의 글
20

댓글

로그인 후 댓글을 남길 수 있습니다.

Daeseung Lee
Daeseung Lee

웹 사이트 정보 가져오는 부분은 html 파일에서 텍스트만 읽어오는 것인가요? 그리고 chunk_size는 500이 적절한 값인 건가요?? 저도 비슷한 코드 짜고 있는데 html에서 핵심적인 부분(여기서는 법률 데이터가 될 것 같습니다.)만 가져오는 건 없는지 궁금하네요 ㅎㅎ

Cailyn Yong
Cailyn Yong

안녕하세요! 네 WebBaseLoader()는 html에 있는 텍스트만 읽어옵니다. chunk_size는 GPT-3.5-turbo의 총 토큰 사이즈인 4096보단 작은 사이즈로 맞춰야합니다. 보통 ~2000 토큰까지는 안전하게 쓸 수 있고 나머지 2000 토큰은 llm이랑 대화 기록을 저장하거나 대화 결과값들을 저장해두기 위해 빼놓습니다. 도움될만한 링크 첨부합니다: https://github.com/langchain-ai/langchain/issues/2026 특정 데이터만 따로 저장하고 싶다면 먼저 WebBaseLoader()로 모든 데이터를 불러온 다음에 코드 함수로 따로 그 부분만 추출해서 저장하셔야할 것 같아요. 예를 들어 그 핵심 부분의 첫 내용과 끝 내용을 변수에 저장하고 그 사이의 내용들만 가져온다든지.. 등

Daeseung Lee
Daeseung Lee

글쿤용 요약 자동화 시키면 편할 것 같네요. 감사합니다 !!

ReSeT
ReSeT

source venv/bin/activate 저번 알려준 설치 링크 해봤는데 으흠..간단한 이슈일거 같은데...아직 진도 못나감.... 역시 간단한거 바로 잡아줄수 있는 오프 사수가 필요할때도 ㅋㅋㅋ 있는듯요.... 뭐든 해보는 스턀인데 가끔 간단한 저런 문제 해결 못하고 스킵한게 몇가지 더 되는듯

ReSeT
ReSeT

NFT컨트렉트 관련 기타 제너레티브 관련등등 완전 개발자 지망이면 목숨걸고 파헤 치겠지만 ㅋㅋ

Cailyn Yong
Cailyn Yong

챗gpt 물어보셨나요 ! ㅠㅠ

ReSeT
ReSeT

ㅋㅋ챗이 바보가 되어가는 느낌이라. 요즘 바드만 쓰는데 생각난김에 바드에 해봤더니 드디어!!!!!!!!!!!!!!!!!!!!!!! (venv) PS C:\Users\variv\AI-AGENT\venv> 가상환경 들어 온거 같네요 ㅋㅋㅋ 역시 구글이 장악해 갈거 같은 느낌적인 느낌

ReSeT
ReSeT

바드용 ㅋㅋ

Cailyn Yong
Cailyn Yong

오오오 대박 해결하신거 축하합니다 ㅎㅎ

William Jung
William Jung

엄청난 혜림님

최훈민
최훈민

10분이라니 무서운 속도네요!

이정민
이정민

아 정말 열정적이시네요..! 재밌게 읽었습니다 :)

Cailyn Yong
Cailyn Yong

풀 투토리얼 동영상은 유투브에서 확인하실 수 있습니다! https://youtu.be/MeRXRDQU-2A?si=O6fpZiTwmhF44zui