Quickstart Guide

npm install @mcp-ts/sdk

import { createNextMcpHandler } from '@mcp-ts/sdk/server';

export const { GET, POST } = createNextMcpHandler({
  getUserId: (req) => "user_123", // Replace with actual auth
});

'use client';
import { useMcp } from '@mcp-ts/sdk/client/react';

export function McpApp() {
  const { connections, connect, callTool, status } = useMcp({
    url: '/api/mcp',
    userId: 'user_123',
  });

  const handleConnect = () => {
    connect({
      serverId: 'everything-server',
      serverName: 'Everything Server',
      serverUrl: 'https://everything.mcp.run',
    });
  };

  return (
    <div>
      <h3>Status: {status}</h3>
      <button onClick={handleConnect}>Connect to Server</button>

      {connections.map(conn => (
        <div key={conn.sessionId}>
          <h4>{conn.serverName} ({conn.state})</h4>
          {conn.tools.map(tool => (
            <button key={tool.name} onClick={() => callTool(conn.sessionId, tool.name, {})}>
              Run {tool.name}
            </button>
          ))}
        </div>
      ))}
    </div>
  );
}

REDIS_URL=redis://localhost:6379