웹 스크래핑 및 크롤링 플랫폼 Firecrawl에 앱을 연결해 페이지를 스크래핑하고, 사이트를 크롤링하고, 웹사이트에서 구조화된 데이터를 추출합니다.
Firecrawl을 연결해 앱에서 쓸 웹 데이터 스크래핑하기
웹 스크래핑 및 크롤링 플랫폼 Firecrawl에 앱을 연결해 페이지를 스크래핑하고, 사이트를 크롤링하고, 웹사이트에서 구조화된 데이터를 추출하세요.
Firecrawl은 웹 스크래핑 및 크롤링 플랫폼입니다. Firecrawl 커넥터를 사용하면 Lovable 앱이 URL을 깔끔한 Markdown이나 구조화된 JSON으로 스크래핑하고, 전체 사이트를 크롤링하고, 웹을 검색하고, 사이트 구조를 map할 수 있습니다. 일회성 가져오기나 정적 데이터셋에 의존하지 않고 웹사이트에서 정보를 가져오고, 업데이트하고, 구조화해야 하는 앱을 위해 설계되었습니다.
Firecrawl은 앱 + 채팅 커넥터로 제공됩니다. 하나의 공유 연결이 빌드 중 채팅과 게시된 앱 모두에서 작동합니다.
Firecrawl을 사용하면 앱에서 다음을 할 수 있습니다.
- JavaScript로 콘텐츠를 로드하는 페이지를 포함해 모든 웹 페이지를 깨끗한 텍스트나 구조화된 데이터로 변환
- 페이지와 sitemap을 따라가며 전체 웹사이트 크롤링
- 웹을 검색하고 찾은 페이지의 콘텐츠 가져오기
- 크롤링 전에 사이트의 모든 URL 나열
- 일정에 따라 페이지를 다시 확인해 데이터를 최신 상태로 유지
Firecrawl은 앱이 실시간 또는 자주 변경되는 웹사이트 콘텐츠에 의존할 때 적합합니다.
일반적인 사용 사례 및 예시 앱
| 예시 앱 | 예시 프롬프트 | 설명 |
|---|---|---|
| 경쟁사 트래커 | 경쟁사 트래커를 만들어주세요. 사용자가 경쟁사 URL을 추가합니다. Firecrawl로 각 URL을 스크래핑하고, 스냅샷을 저장하고, 일정에 따라 다시 확인하고, 변경된 내용을 표시합니다. | 웹사이트 변경을 추적하여 해당 분야의 경쟁사를 모니터링하고 분석합니다. 사용자가 추적할 경쟁사 URL을 추가하면 앱이 시간이 지남에 따라 해당 URL을 다시 스크래핑하여 가격 페이지, 제품 업데이트, 문서 수정 또는 기능 발표와 같이 변경된 내용을 강조 표시합니다. |
| 채용 공고 수집기 | 채용 공고 수집기를 만들어주세요. 사용자가 사전 설정 목록에서 회사를 선택합니다. Firecrawl을 사용하여 각 회사의 채용 페이지에서 목록을 가져오고, 결과를 구조화하고, 최신 상태로 유지하고, 새 역할을 강조합니다. | 여러 소스(예: Greenhouse, Lever 또는 Workday)에서 채용 목록을 가져와 하나의 통합 인터페이스로 제시합니다. 사용자가 사전 설정 목록에서 회사를 선택하면 앱이 목록을 구조화된 결과로 스크래핑하고 새 역할이 나타나면 피드를 업데이트합니다. |
| 리드 보강 도구 | 리드 보강 도구를 만들어주세요. 사용자가 회사 도메인을 입력합니다. Firecrawl로 주요 페이지(소개, 팀, 채용, 연락처)를 크롤링하고 공개적으로 사용 가능한 회사 세부 정보를 구조화된 프로필로 추출합니다. | 회사 웹사이트에서 공개적으로 사용 가능한 정보를 사용하여 회사 프로필을 보강합니다. 사용자가 회사 도메인을 붙여넣거나(또는 목록을 업로드하면) 앱이 주요 페이지를 스캔하여 사람 및 회사 정보, 기술 스택 신호, 위치, 채용 및 연락처 세부 정보를 추출하고 각 회사에 대해 추출된 필드를 저장합니다. |
| 이커머스 가격 모니터 | 가격 모니터를 만들어주세요. 사용자가 제품 URL을 저장합니다. Firecrawl을 사용하여 가격 및 재고를 추출하고, 일정에 따라 확인하고, 기록을 저장하고, 변경 시 알립니다. | 이커머스 사이트 전반에서 제품 가용성 및 가격을 추적합니다. 사용자가 제품 URL을 저장하면 앱이 일정에 따라 확인하고, 스냅샷을 기록하고, 변경을 플래그하고, 가격이 하락하거나 제품이 재입고되면 사용자에게 알립니다. |
| 브랜드 자산 추출기 | 브랜드 키트 추출기를 만들어주세요. 사용자가 웹사이트 URL을 입력합니다. Firecrawl을 사용하여 색상, 글꼴 및 로고를 추출하고 간단한 브랜드 키트를 출력합니다. | 모든 웹사이트에서 경량 브랜드 키트를 생성합니다. 사용자가 회사 URL을 입력하면 앱이 브랜드 관련 페이지를 스크래핑하여 글꼴, 색상, 로고 및 스타일 토큰을 추출합니다. |
| 지식 추출기 | 지식 추출기를 만들어주세요. 사용자가 URL을 붙여넣습니다. Firecrawl을 사용하여 깨끗한 markdown + 메타데이터를 반환하고, 저장하고, 다시 동기화할 수 있게 합니다. | 모든 웹페이지를 깨끗하고 재사용 가능한 콘텐츠로 변환합니다. 사용자가 URL을 붙여넣으면 앱이 페이지를 깨끗한 markdown, 구조화된 메타데이터, 읽기 가능한 텍스트 및 테이블과 같은 유용한 구조화된 요소로 변환하여 검색, 요약 또는 재사용에 사용할 수 있게 합니다. |
Firecrawl 연결 방법
Firecrawl 연결을 만들 수 있는 사용자는 플랜과 워크스페이스 설정에 따라 달라집니다. 앱 + 채팅 커넥터는 Free, Pro, Business 플랜에서 기본으로 사용할 수 있습니다. Enterprise 플랜에서는 처음에 사실상 비활성화되어 있습니다. admin이 Connectors → Admin settings → App + chat connectors에서 변경하기 전까지 connection과 client를 만들 수 있는 사람이 No one으로 기본 설정되기 때문입니다.
connection을 추가할 때 다음 중에서 선택합니다.
- Managed by Lovable: Lovable이 자격 증명을 제공하고 관리합니다. 별도 등록이 필요 없습니다.
- Use your own credentials: 자체 Firecrawl API 키로 연결하고 Firecrawl에서 직접 결제를 관리합니다.
connection이 만들어지면 사용하려는 프로젝트에 링크할 수 있습니다. 프로젝트에서 빌드하는 사용자는 누구나 채팅에서 Lovable에 해당 프로젝트를 연결해 달라고 요청할 수 있습니다.
Firecrawl 연결 방법에 따라 아래 설정 단계를 따르세요.
가장 빠른 설정을 원하면 이 옵션을 선택하세요. Firecrawl 계정이나 API 키를 생성할 필요가 없습니다. Lovable이 자격 증명을 제공하고 관리합니다.
Lovable이 관리하는 Firecrawl connection은 워크스페이스당 하나만 만들 수 있습니다. 이미 하나가 있다면 삭제하기 전까지 양식에서 Managed by Lovable 옵션을 사용할 수 없습니다.
Connectors에서 Firecrawl 열기
Connectors를 열고 Firecrawl을 선택합니다. 카탈로그를 여는 다른 위치는 커넥터를 찾는 위치를 참고하세요.
연결 추가
Add connection을 클릭합니다.
연결 이름 지정
Display name에 connection 이름을 지정합니다(예: Firecrawl). 이 이름은 Lovable 안에서 connection을 식별하는 데만 사용됩니다.
Managed by Lovable 선택
Authentication에서 Managed by Lovable을 선택합니다. 이 옵션에는 자격 증명 필드가 표시되지 않습니다.
이 연결을 사용할 사용자 선택
Managed connection은 기본적으로 워크스페이스 전체와 공유됩니다. connection을 사용할 수 있는 사람을 제한하려면 Sharing 아래에서 Restrict to specific people을 클릭합니다.
자세한 내용은 연결 및 클라이언트를 사용할 수 있는 사용자를 참고하세요.
연결
Connect를 클릭합니다.
자체 Firecrawl 계정을 사용하고 결제를 직접 관리하려면 이 옵션을 선택하세요.
다른 API 키를 사용하여 여러 Firecrawl 연결을 생성할 수 있으며, 이는 환경 분리(예: 개발 및 프로덕션) 또는 속도 제한 관리에 유용합니다.
전제 조건
자체 자격 증명으로 Firecrawl을 연결하기 전에 다음을 준비하세요.
- Firecrawl 계정
- Firecrawl API 키
- Lovable 워크스페이스에서 연결을 만들 수 있는 권한(연결 및 클라이언트를 만들 수 있는 사용자 참고)
이 connection을 통한 모든 스크래핑과 크롤링은 Firecrawl credit을 소비합니다. 청구와 할당량은 Lovable이 아닌 Firecrawl에서 직접 처리합니다.
단계 1: Firecrawl API 키 가져오기
Firecrawl API 키를 사용하면 Lovable 앱이 Firecrawl API에 인증할 수 있습니다. 환경별로 여러 키를 만들 수 있습니다.
Firecrawl 계정 열기
Firecrawl에 로그인합니다. 새 계정은 connection 테스트에 충분한 무료 credit으로 시작합니다.
API Keys 페이지 열기
Firecrawl 대시보드에서 API Keys 페이지로 이동합니다.
키 생성
Create를 클릭하고 키에 설명적인 이름을 지정합니다(예: Lovable integration).
키 복사
생성된 API 키를 복사하고 안전하게 저장합니다. 키는 fc-로 시작합니다.
API 키는 비밀번호처럼 작동합니다. 안전하게 보관하고 절대 공개적으로 공유하지 마세요. 다음 단계에서 필요합니다.
자세한 내용은 Firecrawl API reference를 참고하세요.
단계 2: Firecrawl을 Lovable에 연결
Connectors에서 Firecrawl 열기
Connectors를 열고 Firecrawl을 선택합니다. 카탈로그를 여는 다른 위치는 커넥터를 찾는 위치를 참고하세요.
연결 추가
Add connection을 클릭합니다.
연결 이름 지정
Display name에 연결 이름을 지정합니다(예: Firecrawl Prod).
자체 자격 증명 선택
Authentication에서 Use your own credentials를 선택합니다.
API 키 입력
API key에 Firecrawl API 키(fc-xxxxxxxx…)를 붙여넣습니다.
이 연결을 사용할 사용자 선택
Sharing에서 워크스페이스 내 누가 이 연결을 사용할 수 있는지 정합니다. 새 연결은 기본적으로 본인에게만 비공개이며 Private 라벨이 표시됩니다.
- Private(기본값): 접근 목록을 그대로 두면 본인만 연결과 관련 데이터를 사용할 수 있습니다.
- Share with others: 이메일로 워크스페이스 멤버를 추가합니다. 본인과 추가한 사람만 연결과 관련 데이터를 사용할 수 있습니다.
- Invite entire workspace: Lovable 워크스페이스의 모든 사용자가 연결을 사용할 수 있게 합니다.
자세한 내용은 연결 및 클라이언트를 사용할 수 있는 사용자를 참고하세요.
연결
Connect를 클릭합니다.
연결되면 프로젝트에서 빌드하는 사람은 누구나 채팅에서 Lovable에게 프로젝트를 Firecrawl에 링크해 달라고 요청할 수 있습니다(구성된 연결 수준 접근 권한 기준). 그러면 Lovable 앱에서 Firecrawl을 사용하여 웹사이트 데이터를 스크래핑하고, 크롤링하고, 최신 상태로 유지할 수 있습니다.
가격
Managed by Lovable과 통합 결제를 사용할 때 사용량은 Firecrawl credit 1,000개당 Lovable credit 4개, Business 플랜에서는 Lovable credit 2개가 듭니다.
Firecrawl credit은 API 사용량을 측정하며, 사용하는 기능에 따라 소비량이 달라집니다. 기능별 자세한 가격과 credit 사용량은 Firecrawl billing documentation을 참고하세요.
Use your own credentials를 사용하면 Firecrawl이 사용량을 Firecrawl 계정에 직접 청구합니다.
제한 사항
Firecrawl 커넥터는 다음을 할 수 없습니다.
- Managed by Lovable으로 Firecrawl Monitor 제품 사용. Monitor를 사용하려면 Use your own credentials와 자체 Firecrawl API 키로 연결하세요.
- 자체 자격 증명을 쓰는 connection의 API 키 자동 교체. 교체하려면 Firecrawl에서 새 키를 만들고 Lovable connection을 업데이트하세요.
- 최종 사용자별 Firecrawl 로그인 지원. 각 connection은 링크된 모든 프로젝트가 공유하는 단일 Firecrawl 계정을 나타냅니다.
Firecrawl 연결 관리
연결은 Connectors에서 관리합니다. **Firecrawl**을 선택한 다음 연결을 여세요.
- Unlink projects를 사용하면 다른 프로젝트에서 연결을 계속 사용할 수 있도록 유지하면서 특정 프로젝트의 Firecrawl 접근 권한만 제거할 수 있습니다. 단계별 절차는 연결에서 프로젝트 연결 해제를 참고하세요.
- Delete the connection을 사용하면 워크스페이스에서 연결을 완전히 제거할 수 있습니다. 삭제는 영구적이며 연결된 모든 프로젝트에서 자격 증명이 제거되고, Firecrawl을 사용하는 앱 기능은 새 연결을 추가할 때까지 작동하지 않습니다. 단계와 삭제 권한은 연결 삭제를 참고하세요.