FastAPI AI Chat with WebSocket

FastAPI AI Chat with WebSocket

A real-time AI chat application using Next.js (frontend), FastAPI (backend), WebSocket for streaming, and the Python AI SDK for LLM integration. Deployed on Vercel using Services.

Demo

https://fastapi-ai-chat.vercel.app/

How It Works

• The frontend is a Next.js single-page app with a chat UI that connects to the backend via WebSocket.
• The backend is a FastAPI server that accepts WebSocket connections, streams LLM responses using the Python AI SDK, and sends text deltas back to the client in real time.
• On Vercel, the frontend and backend run as separate services routed by path prefix (/ and /api).

How to Use

Local Development

1
# Clone
2
npx giget@latest gh:vercel/examples/websockets/fastapi-ai-chat fastapi-ai-chat
3
cd fastapi-ai-chat
4

5
# Set your AI Gateway API key
6
echo "AI_GATEWAY_API_KEY=your-key-here" > .env
7

8
# Run both services
9
vercel dev

Open http://localhost:3000.

Environment Variables

Learn More

• Vercel Services - learn how services work on Vercel.
• AI Gateway - learn about AI Gateway.