LangGraph - Firecrawl Docs

This guide shows how to integrate Firecrawl with LangGraph to build AI agent workflows that can scrape and process web content.

Setup#

npm install @langchain/langgraph @langchain/openai firecrawl

Create .env file:

FIRECRAWL_API_KEY=your_firecrawl_keyOPENAI_API_KEY=your_openai_key

Note: If using Node < 20, install dotenv and add import 'dotenv/config' to your code.

Basic Workflow#

This example demonstrates a basic LangGraph workflow that scrapes a website and analyzes the content.

import { Firecrawl } from 'firecrawl';import { ChatOpenAI } from '@langchain/openai';import { StateGraph, MessagesAnnotation, START, END } from '@langchain/langgraph';// Initialize Firecrawlconst firecrawl = new Firecrawl({ apiKey: process.env.FIRECRAWL_API_KEY });// Initialize LLMconst llm = new ChatOpenAI({    model: "gpt-5-nano",    apiKey: process.env.OPENAI_API_KEY});// Define the scrape nodeasync function scrapeNode(state: typeof MessagesAnnotation.State) {    console.log('Scraping...');    const result = await firecrawl.scrape('https://firecrawl.dev', { formats: ['markdown'] });    return {        messages: [{            role: "system",            content: `Scraped content: ${result.markdown}`        }]    };}// Define the analyze nodeasync function analyzeNode(state: typeof MessagesAnnotation.State) {    console.log('Analyzing...');    const response = await llm.invoke(state.messages);    return { messages: [response] };}// Build the graphconst graph = new StateGraph(MessagesAnnotation)    .addNode("scrape", scrapeNode)    .addNode("analyze", analyzeNode)    .addEdge(START, "scrape")    .addEdge("scrape", "analyze")    .addEdge("analyze", END);// Compile the graphconst app = graph.compile();// Run the workflowconst result = await app.invoke({    messages: [{ role: "user", content: "Summarize the website" }]});console.log(JSON.stringify(result, null, 2));

Multi-Step Workflow#

This example demonstrates a more complex workflow that scrapes multiple URLs and processes them.

import { Firecrawl } from 'firecrawl';import { ChatOpenAI } from '@langchain/openai';import { StateGraph, Annotation, START, END } from '@langchain/langgraph';const firecrawl = new Firecrawl({ apiKey: process.env.FIRECRAWL_API_KEY });const llm = new ChatOpenAI({ model: "gpt-5-nano", apiKey: process.env.OPENAI_API_KEY });// Define custom stateconst WorkflowState = Annotation.Root({    urls: Annotation<string[]>(),    scrapedData: Annotation<Array<{ url: string; content: string }>>(),    summary: Annotation<string>()});// Scrape multiple URLsasync function scrapeMultiple(state: typeof WorkflowState.State) {    const scrapedData = [];    for (const url of state.urls) {        const result = await firecrawl.scrape(url, { formats: ['markdown'] });        scrapedData.push({ url, content: result.markdown || '' });    }    return { scrapedData };}// Summarize all scraped contentasync function summarizeAll(state: typeof WorkflowState.State) {    const combinedContent = state.scrapedData        .map(item => `Content from ${item.url}:\n${item.content}`)        .join('\n\n');    const response = await llm.invoke([        { role: "user", content: `Summarize these websites:\n${combinedContent}` }    ]);    return { summary: response.content as string };}// Build the workflow graphconst workflow = new StateGraph(WorkflowState)    .addNode("scrape", scrapeMultiple)    .addNode("summarize", summarizeAll)    .addEdge(START, "scrape")    .addEdge("scrape", "summarize")    .addEdge("summarize", END);const app = workflow.compile();// Execute workflowconst result = await app.invoke({    urls: ["https://firecrawl.dev", "https://firecrawl.dev/pricing"]});console.log(result.summary);

For more examples, check the LangGraph documentation.