Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.scrapegraphai.com/llms.txt

Use this file to discover all available pages before exploring further.

Bolt.new by StackBlitz is an AI-powered full-stack development environment that runs entirely in the browser. You can use ScrapeGraphAI to add live web scraping capabilities to any Bolt.new application.

​
How it works

Bolt.new can generate Node.js / Express backends alongside your frontend. Make ScrapeGraphAI API calls from the backend to keep your API key secret and avoid CORS errors.

​
Setup

​
1. Tell Bolt to create an Express backend

Start a new Bolt project and prompt it:
Create a full-stack app with an Express backend. Install scrapegraph-js. Add a POST endpoint at /api/scrape that accepts url and prompt fields, calls sgai.extract from ScrapeGraphAI v2, and returns the structured JSON result.

​
2. Backend endpoint

Bolt will generate something like this — make sure the API key is loaded from an environment variable: 
import express from "express";
import { ScrapeGraphAI } from "scrapegraph-js";

const app = express();
app.use(express.json());

// Reads SGAI_API_KEY from process.env
const sgai = ScrapeGraphAI();

app.post("/api/scrape", async (req, res) => {
  const { url, prompt } = req.body;

  const result = await sgai.extract({ url, prompt });

  if (result.status === "success") {
    res.json({ data: result.data?.json, usage: result.data?.usage });
  } else {
    res.status(502).json({ error: result.error });
  }
});

app.listen(3001);
If you prefer fetch over the SDK, call the v2 REST endpoint directly: 
const response = await fetch("https://v2-api.scrapegraphai.com/api/extract", {
  method: "POST",
  headers: {
    "Content-Type": "application/json",
    "SGAI-APIKEY": process.env.SGAI_API_KEY,
  },
  body: JSON.stringify({ url, prompt }),
});

​
3. Add your API key

In Bolt.new, open the environment variables panel and add: 
SGAI_API_KEY=your-api-key-here

​
4. Call from the frontend

const response = await fetch("/api/scrape", {
  method: "POST",
  headers: { "Content-Type": "application/json" },
  body: JSON.stringify({
    url: "https://example.com",
    prompt: "Extract the product name and price",
  }),
});

const { data } = await response.json();
console.log(data);

​
Example prompt for Bolt

Build a price tracker UI. It should have an input for a product URL and a button. When clicked, it calls the backend /api/scrape endpoint and shows the extracted product name and price in a card.