Bolt.new AI and SEMrush integration: Step-by-Step Guide 2025

To integrate Bolt.new with SEMrush, you do it the same way you integrate any external SaaS API inside a Bolt.new full‑stack project: you call the SEMrush REST API from your server-side code (Node.js inside Bolt’s backend), using a real SEMrush API key stored in environment variables. There is no native or automatic “Bolt ⇄ SEMrush” connector — you build the integration the standard way using HTTP requests. The key steps are: get a SEMrush API key, expose it to your Bolt backend through environment variables, create backend routes that call SEMrush endpoints, and then call those backend routes from your Bolt UI.

 

What SEMrush actually offers for integrations

 

SEMrush exposes data only through their REST API. You must have:

• Paid SEMrush subscription that includes API units.
• API Key from your SEMrush profile (Account → API). This key is what authorizes your backend to call SEMrush.
• Understanding API units: each API hit costs units depending on data type. Bolt cannot bypass that.

Your backend must call URLs like:

https://api.semrush.com/

with query parameters including your API key, the database, the type of request, and the domain/keyword.

 

How this maps into a Bolt.new full‑stack app

 

You will:

• Store your SEMrush API key as an environment variable in Bolt.new.
• Write a server-side API route inside Bolt that acts as a proxy so your SEMrush key is never exposed to the browser.
• Call SEMrush using fetch (Node fetch, built-in) from that backend route.
• From your frontend (React/Vue/Svelte/etc.), call your own backend route instead of calling SEMrush directly.

This is the safest and correct architecture since SEMrush API keys must not be exposed to the client.

 

Step-by-step: full working integration (minimal example)

 

Step A — Add environment variable in Bolt.new:

• Open Bolt.new
• Go to Project Settings → Environment Variables
• Add SEMRUSH_API_KEY = your_real_key\_here

 

Step B — Create backend route that calls SEMrush:

// backend/routes/semrush.js
import express from "express";
const router = express.Router();

router.get("/domain-overview", async (req, res) => {
  const { domain } = req.query;

  if (!domain) {
    return res.status(400).json({ error: "Domain is required" });
  }

  try {
    // Build SEMrush API URL
    const url = `https://api.semrush.com/?type=domain_ranks
      &key=${process.env.SEMRUSH_API_KEY}
      &export_columns=Dn,Rk,Or,Ot,Oc
      &domain=${encodeURIComponent(domain)}
      &database=us`
      .replace(/\s+/g, ""); // remove whitespace

    const response = await fetch(url);
    const text = await response.text(); // SEMrush often returns CSV-like text

    res.send({ raw: text });
  } catch (err) {
    console.error("SEMrush error:", err);
    res.status(500).json({ error: "Failed to fetch SEMrush data" });
  }
});

export default router;

 

Step C — Register backend route inside server.js (or app.js depending on template):

// backend/server.js
import express from "express";
import semrushRoutes from "./routes/semrush.js";

const app = express();
app.use("/api/semrush", semrushRoutes);

app.listen(3000, () => {
  console.log("Server running on port 3000");
});

 

Step D — Call your backend route from the frontend:

// frontend example (React)
async function fetchDomainOverview(domain) {
  const res = await fetch(`/api/semrush/domain-overview?domain=${domain}`);
  const data = await res.json();
  console.log("SEMrush data:", data);
}

 

How authentication works in this setup

 

SEMrush uses simple API key authentication through query parameters. There is no OAuth.

• That key must stay server-side.
• Bolt.new will inject environment variables into your Node backend runtime.
• Your frontend never touches or sees the real SEMrush key.

This architecture keeps you safe and compliant with SEMrush API rules.

 

Common pitfalls to avoid

 

• SEMrush rate limits strictly based on API units. Watch consumption.
• SEMrush returns many responses in CSV-like text, not JSON. You may need to parse it.
• Do not call SEMrush directly from the browser — it exposes your secret key.
• When deploying outside Bolt, you must re-set the SEMRUSH_API_KEY in your real hosting environment.

 

Summary

 

You integrate Bolt.new with SEMrush by storing your SEMrush API key as an environment variable, creating a backend route that calls the SEMrush REST API, and calling that backend from your frontend. There is no built-in connector — you perform standard authenticated HTTP requests. This pattern works cleanly inside bolt.new and also scales when you later deploy the project to production hosting.