FrameworksFrontend
TanStack Start
Use Integrate with TanStack Start
Installation
Install the Integrate SDK in your TanStack Start project:
bun add integrate-sdkSetup
1. Server Configuration
Create a server configuration file with your OAuth credentials:
// lib/integrate.ts
import { createMCPServer, githubIntegration } from "integrate-sdk/server";
export const { client: serverClient } = createMCPServer({
apiKey: process.env.INTEGRATE_API_KEY,
integrations: [
githubIntegration({
scopes: ["repo", "user"],
}),
],
});TanStack Start supports automatically importing the environment variables from the .env file.
You can get an API key from the Integrate Dashboard.
2. Mount the Handler
Create a catch-all route at routes/api/integrate/$.ts:
import { createFileRoute } from "@tanstack/react-router";
import { serverClient } from "@/lib/integrate";
export const Route = createFileRoute("/api/integrate/$")({
server: {
handlers: {
GET: ({ request }) => {
return serverClient.handler(request);
},
POST: ({ request }) => {
return serverClient.handler(request);
},
},
},
});Configuration
Add your OAuth credentials to your .env file:
GITHUB_CLIENT_ID=your_github_client_id
GITHUB_CLIENT_SECRET=your_github_client_secretUsage Examples
Client-Side Authorization
The client is automatically configured when making requests to the server.
import { client } from "integrate-sdk";
await client.authorize("github");