Connect Firecrawl to scrape web data for your app
Firecrawl helps your Lovable app get information from websites, even those that load content dynamically. You can use it to turn web pages into clean text or structured data, crawl entire sites, or search the web.
Anyone building an app that needs to regularly fetch and organize data from websites will find this useful.
Do this, in order
- 1
Decide if you want Lovable to manage your Firecrawl account or if you want to use your own Firecrawl account.
This choice affects how you pay for Firecrawl usage and whether you need to create your own Firecrawl API key.
- 2
Go to the 'Connectors' section in your Lovable dashboard and select 'Firecrawl'.
This is where you start the process of adding a new connection to Firecrawl.
- 3
Click 'Add connection' and choose 'App + chat connector'.
This creates a shared connection that you can use both while building in chat and in your finished apps.
- 4
Give your connection a name that helps you identify it, like 'Firecrawl for Product Tracking'.
This name is only for your internal use within Lovable.
- 5
If Lovable manages it: Select 'Managed by Lovable' under 'Configure connection'.
This option means Lovable handles the Firecrawl account and billing for you, using your Lovable credits.
- 6
If using your own: Select 'Use your own credentials' and paste your Firecrawl API key into the 'API key' field.
This option connects your existing Firecrawl account, and you manage billing directly with Firecrawl. You'll need to get an API key from your Firecrawl dashboard first.
- 7
Choose who can use this connection within your Lovable workspace.
You can make it private, share it with specific people, or make it available to everyone in your workspace.
- 8
Click 'Connect' to finalize the setup.
This establishes the link between your Lovable project and Firecrawl.
- 9
In your project chat, ask Lovable to link your project to the Firecrawl connection you just created.
This makes the Firecrawl connection available for your app to use within that specific project.
Paste this into your project
Connect my project to Firecrawl using the connection named 'Firecrawl for Product Tracking'.
Words decoded
- Web scraping
- Automatically collecting specific information from websites.
- Web crawling
- Automatically exploring a website by following links to discover all its pages.
- Structured data
- Information organized in a predictable way, like in a table or a database, making it easy for computers to understand and use.
- API key
- A secret code that identifies you or your app when you want to use a service like Firecrawl, proving you have permission.
- Workspace credits
- A form of payment used within Lovable for services like connectors, where usage is deducted from a pre-purchased balance.
Where people get stuck
- Running out of Lovable credits if you use the 'Managed by Lovable' option, which will stop your app from scraping until you top up.
- Running out of Firecrawl credits if you use your own credentials, which will stop your app from scraping until you buy more.
- Not securing your Firecrawl API key, as it acts like a password and should never be shared publicly.
- Trying to use Firecrawl Monitor with a 'Managed by Lovable' connection; this feature requires your own Firecrawl account.
- Forgetting to link the Firecrawl connection to your specific project after creating it, which means your app won't be able to use it.
The short version, steps, decoder and prompt on this page are written automatically from Lovable's own documentation and can lag or misread it. The official page is always the authority.