Chat UI (React + Vite)

A minimal React chat interface that talks to Fastify API at /api/chat. The Vite dev server proxies /api/* to http://localhost:3000 to avoid CORS during development.

Prerequisites

• Node 18+
• Fastify API running locally on port 3000

Getting started

1. Install deps

npm install

2. Start the UI

npm run dev

Open http://localhost:5173

The UI calls your Fastify endpoint POST /api/chat with a body like:

{
  "messages": [
    { "role": "system", "content": "You are a helpful AI assistant." },
    { "role": "user", "content": "Hello!" }
  ]
}

The server should respond with:

{
  "response": "...assistant text...",
  "usage": { /* optional token usage object from the server */ }
}

Notes

• Dev proxy is configured in vite.config.ts to forward /api to http://localhost:3000.
• The backend uses Vercel AI SDK (ai) to generate text; the frontend uses a minimal fetch. If we later switch API to the Vercel chat completion streaming format, we can replace this with the useChat hook from ai/react.