03. 웹페이지를 파일로 만들기1

현재 chatGPT에 langchain이나 openAI API에 대해 물어보면 제대로된 대답을 못함
해당 기술들의 도큐먼트의 URL을 입력하면 하나의 문서로 만드는 기능을 만들어보자

문서가 만들어진다면 임베딩하여 백터디비에 저장하고 질의를 통해 좀 더 정확한 답변을 받을 수 있을거다.

pip install requests beautifulsoup4 python-docx

langchain 관련 문서 웹이다 모든 문서의 내용을 확인하려면 왼쪽에 메뉴를 클릭하여 페이지 이동을 순차적으로 하면서 해당 메뉴에 내용을 확인해야 한다.

하나의 URL만 입력해서 모든 메뉴의 내용을 문서로 정리하도록 해보자

문서의 url을 입력하고 html을 가져와 chatGPT에게 메뉴명과 링크를 짝지어 알려달라고 했더니 원하는 메뉴가 아니라 헤더에 있는 메뉴와 링크를 알려주었다

다른 방법으로 메뉴 리스트를 찾아보자

chatGPT의 답변은 아래와 같다

제공된 HTML 콘텐츠와 이를 처리하려는 시도는 콘텐츠의 복잡성 또는 여기서 큰 코드 블록을 실행하는 데 따른 한계로 인해 결과를 직접 출력하지 못한 것 같습니다. 그러나 제가 설명한 접근 방식은 클래스 이름에 "메뉴" 또는 "목록"이 포함된 태그를 올바르게 식별한 다음 그중 가장 상위의 태그를 찾아야 합니다.

프로세스를 요약하면 다음과 같습니다:

BeautifulSoup으로 HTML 콘텐츠 파싱하기.
태그의 클래스 속성에 "메뉴" 또는 "목록"이 포함되어 있는지 확인하는 함수를 정의합니다.
사용자 정의 함수와 함께 soup.find_all()을 사용하여 일치하는 모든 태그를 찾습니다.
발견된 태그를 반복하여 다른 발견된 태그에 포함되지 않았는지 확인하여 가장 상위의 태그를 식별합니다.
이 방법을 사용하면 해당 클래스에서 "메뉴" 또는 "목록"을 포함하는 최상위 태그를 찾을 수 있으므로 기준에 따라 웹페이지 또는 문서의 주요 섹션을 효과적으로 식별할 수 있습니다. 

알려준 프로세스를 다시 물어보자

일단 알려준데로 해본다

알려준 코드로 해보니

• People
• Versioning
• Changelog
• Contributing
• Templates
• Cookbooks
• Tutorials
• YouTube

헤더에 More부분만 알려주었다. 그냥 순차적으로 제일 위에 있는걸 알려준거 같다

다시 물어보자

tag_name: ul, tag_class: ['dropdown__menu'], tag_text: PeopleVersioningChangelogContributingTemplatesCookbooksTutorialsYouTube
tag_name: ul, tag_class: ['dropdown__menu'], tag_text: LangSmithLangSmith DocsLangServe GitHubTemplates GitHubTemplates HubLangChain HubJS/TS 
Docs
tag_name: nav, tag_class: ['menu', 'thin-scrollbar', 'menu_SIkG'], tag_text: Get startedIntroductionInstallationQuickstartSecurityLangChain Expression LanguageGet startedWhy use LCELInterfaceStreamingHow toCookbookLangChain Expression Language (LCEL)ModulesModel I/ORetrievalAgentsChainsMoreLangServeLangSmithLangGraph
tag_name: section, tag_class: ['row', 'list_eTzJ'], tag_text: 📄️ IntroductionLangChain is a framework for developing applications powered by 
language models. It enables applications that:📄️ InstallationOfficial release📄️ QuickstartIn this quickstart we'll show you how to:📄️ Secur
ityLangChain has a large ecosystem of integrations with various external resources like local and remote file systems, APIs and databases. These integrations allow developers to create versatile applications that combine the power of LLMs with the ability to access, interact with and manipulate external resources.
tag_name: ul, tag_class: ['footer__items', 'clean-list'], tag_text: DiscordTwitter
tag_name: ul, tag_class: ['footer__items', 'clean-list'], tag_text: PythonJS/TS
tag_name: ul, tag_class: ['footer__items', 'clean-list'], tag_text: HomepageBlogYouTube

테그는 nav
클래스는 ['menu', 'thin-scrollbar', 'menu_SIkG']
내가 원하는게 포함되어 나왔다 이제 해당 테그를 특정할 수 있는지 다시 물어보자

원하는 테그를 찾았다 이제 이걸 API로도 찾도록 해보자
우선 결과를 dic형식으로 변경해서 langchain에 포함하여 보내자