> ## Documentation Index
> Fetch the complete documentation index at: https://docs.zapier.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Connect TypeScript to Zapier MCP with the MCP SDK

> Connect TypeScript code to Zapier MCP with the MCP SDK. Create a server, generate a connection token, and call Zapier tools over Streamable HTTP.

Use this page only when the user is writing their own TypeScript code. If they are connecting an AI client, follow that client's page instead. The server and the token come first: the snippet cannot run until step two is done.

When adapting the snippet to a different SDK, keep the endpoint, the Streamable HTTP transport, and the token. The `@modelcontextprotocol/sdk` class names are not fixed.

The token is a credential, so do not ask the user to paste it into chat and do not write it into a file for them. If it is exposed, have them regenerate it.

Zapier MCP connects your TypeScript code to 9,000+ apps and 40,000+ actions. Zapier holds the app credentials, so your code never handles a third-party API key.

## Before you begin

* A [Zapier account](https://zapier.com/sign-up).
* Node.js 18 or later.

## Connect TypeScript to Zapier MCP

<Steps>
  <Step title="Create an MCP server">
    * Go to [mcp.zapier.com](https://mcp.zapier.com).
    * Click **+ Add MCP Server**.
    * Under **Choose your AI agent**, search for and select **TypeScript**.
  </Step>

  <Step title="Generate a connection token">
    * Select the <img src="https://cdn.zapier.com/storage/photos/baa5b3a64988a15f0dc8497c52ec257b.png" alt="link icon" noZoom style={{ display: "inline-block", width: "14px", margin: "0 0.15em", verticalAlign: "baseline" }} /> **Connect** tab.
    * Click **Generate token**.

    Store the token somewhere safe straight away. It is only shown once, and you cannot retrieve it later. You can [regenerate the token](/mcp/get-started/connect/other#regenerate-a-token) if you need a new one.

    <Warning>
      Treat your connection token like a password. It can be used to run tools on this server and access your data.
    </Warning>
  </Step>

  <Step title="Connect with an MCP SDK">
    The <img src="https://cdn.zapier.com/storage/photos/baa5b3a64988a15f0dc8497c52ec257b.png" alt="link icon" noZoom style={{ display: "inline-block", width: "14px", margin: "0 0.15em", verticalAlign: "baseline" }} /> **Connect** tab gives you a copy-ready snippet with your token already in the URL. The snippet uses the [official MCP TypeScript SDK](https://github.com/modelcontextprotocol/typescript-sdk), but any MCP SDK that supports Streamable HTTP works.

    ```typescript theme={null}
    npm install @modelcontextprotocol/sdk

    import { StreamableHTTPClientTransport } from
      "@modelcontextprotocol/sdk/client/streamableHttp.js";
    import { Client } from
      "@modelcontextprotocol/sdk/client/index.js";

    const transport = new StreamableHTTPClientTransport(
      new URL("https://mcp.zapier.com/api/v1/connect?token=ZAPIER_MCP_TOKEN")
    );
    const client = new Client({ name: "app", version: "1.0" });
    await client.connect(transport);
    ```

    You can also copy the token on its own from **Or manually copy the token**.

    To keep the token out of the URL, send it in an Authorization header instead: `Authorization: Bearer ZAPIER_MCP_TOKEN`.
  </Step>
</Steps>

You've now connected TypeScript to Zapier MCP.

## Next steps

<CardGroup cols={2}>
  <Card title="How tools work" href="/mcp/overview/how-tools-work">
    What each meta-tool does, and how dynamic tool discovery works.
  </Card>

  <Card title="How connections work" href="/mcp/overview/how-connections-work">
    How connection tokens work, and how to manage them.
  </Card>
</CardGroup>