Astro Quickstart | Firecrawl

Prerequisites

Astro project with SSR enabled (output: "server" or "hybrid")
A Firecrawl API key — get one free

Install the SDK

npm install firecrawl

Add your API key to .env:

FIRECRAWL_API_KEY=fc-YOUR-API-KEY

Search the web

Create src/pages/api/search.ts:

import type { APIRoute } from "astro";
import { Firecrawl } from "firecrawl";

const firecrawl = new Firecrawl({
  apiKey: import.meta.env.FIRECRAWL_API_KEY,
});

export const POST: APIRoute = async ({ request }) => {
  const { query } = await request.json();
  const results = await firecrawl.search(query, { limit: 5 });
  return new Response(JSON.stringify(results), {
    headers: { "Content-Type": "application/json" },
  });
};

Or search at request time in a server-rendered page (src/pages/search.astro):

---
import { Firecrawl } from "firecrawl";

const firecrawl = new Firecrawl({
  apiKey: import.meta.env.FIRECRAWL_API_KEY,
});

const query = Astro.url.searchParams.get("q");
let results = [];

if (query) {
  const searchData = await firecrawl.search(query, { limit: 5 });
  results = searchData.web || [];
}
---

<html>
  <body>
    <h1>Search Results</h1>
    {results.length > 0 ? (
      <ul>
        {results.map((r) => (
          <li><a href={r.url}>{r.title}</a></li>
        ))}
      </ul>
    ) : (
      <p>Pass ?q= to search the web</p>
    )}
  </body>
</html>

Scrape a page

Create src/pages/api/scrape.ts:

import type { APIRoute } from "astro";
import { Firecrawl } from "firecrawl";

const firecrawl = new Firecrawl({
  apiKey: import.meta.env.FIRECRAWL_API_KEY,
});

export const POST: APIRoute = async ({ request }) => {
  const { url } = await request.json();
  const result = await firecrawl.scrape(url);
  return new Response(JSON.stringify(result), {
    headers: { "Content-Type": "application/json" },
  });
};

Or scrape at request time in a server-rendered page (src/pages/scrape.astro):

---
import { Firecrawl } from "firecrawl";

const firecrawl = new Firecrawl({
  apiKey: import.meta.env.FIRECRAWL_API_KEY,
});

const target = Astro.url.searchParams.get("url");
let markdown = null;

if (target) {
  const result = await firecrawl.scrape(target);
  markdown = result.markdown;
}
---

<html>
  <body>
    <h1>Scraped Content</h1>
    {markdown ? <pre>{markdown}</pre> : <p>Pass ?url= to scrape a page</p>}
  </body>
</html>

Interact with a page

Create src/pages/api/interact.ts:

import type { APIRoute } from "astro";
import { Firecrawl } from "firecrawl";

const firecrawl = new Firecrawl({
  apiKey: import.meta.env.FIRECRAWL_API_KEY,
});

export const POST: APIRoute = async () => {
  const result = await firecrawl.scrape("https://www.amazon.com", {
    formats: ["markdown"],
  });

  const scrapeId = result.metadata?.scrapeId;

  await firecrawl.interact(scrapeId, {
    prompt: "Search for iPhone 16 Pro Max",
  });

  const response = await firecrawl.interact(scrapeId, {
    prompt: "Click on the first result and tell me the price",
  });

  await firecrawl.stopInteraction(scrapeId);

  return new Response(JSON.stringify({ output: response.output }), {
    headers: { "Content-Type": "application/json" },
  });
};

Next steps

Scrape docs

All scrape options including formats, actions, and proxies

Search docs

Search the web and get full page content

Interact docs

Click, fill forms, and extract dynamic content

Node SDK reference

Full SDK reference with crawl, map, batch scrape, and more

Get Started

Core Endpoints

More

Quickstarts

Developer Guides

Webhooks

Use Cases

Other

Contributing

Astro

Prerequisites

Install the SDK

Search the web

Scrape a page

Interact with a page

Next steps

Scrape docs

Search docs

Interact docs

Node SDK reference

​Prerequisites

​Install the SDK

​Search the web

​Scrape a page

​Interact with a page

​Next steps

Scrape docs

Search docs

Interact docs

Node SDK reference

Prerequisites

Install the SDK

Search the web

Scrape a page

Interact with a page

Next steps