TanStack Start quickstart

Install the E2 SDK and add search, routing, and compute to a TanStack Start application.

Documentation navigation

Start with E2

SDK guides

CLI guides

MCP guides

Applications

Framework quickstarts

Install

terminal

npm install @embed-earth/sdk-test

Install the normal TanStack Start dependencies from the framework starter, then add the E2 SDK.

Example

src/routes/index.tsx

import { useEffect, useState } from "react";
import { createFileRoute } from "@tanstack/react-router";
import { E2 } from "@embed-earth/sdk-test";

const e2 = new E2();

export const Route = createFileRoute("/")({
  component: Home,
});

function Home() {
  const [summary, setSummary] = useState("");

  useEffect(() => {
    (async () => {
      const places = await e2.search({
        feature: "restaurant",
        area: "Manhattan",
        mode: "auto",
        limit: 100,
      });

      const route = await e2.route.route({
        locations: [{ lat: 40.74, lon: -73.99 }, { lat: 40.71, lon: -74.01 }],
        mode: "walking",
      });

      const count = await e2.compute.feature("restaurant")
        .region("Manhattan")
        .near("park", 500)
        .count();

      setSummary(`${places.features.length} restaurants, ${count} near parks`);
    })();
  }, []);

  return <p>{summary}</p>;
}

Search example

src/search.ts

import { E2 } from "@embed-earth/sdk-test";

const e2 = new E2({ searchUrl: "/search" });
const places = await e2.search({
  feature: ["restaurant", "hospital"],
  area: ["Manhattan", "Brooklyn"],
  mode: "auto",
  limit: 100,
});

console.log(places.features);

The universal E2 import routes browser search to HTTP /search. Set searchUrl to your API route when it lives elsewhere.

Next steps

Replace the example coordinates and feature with your own values. Continue with the SDK guide for search, routing, compute, storage, catalogs, and cells.

All developer interfaces