A clean AI chat interface built with React, Hono, and Vercel's AI SDK.

• ✅ Clean, minimal chat interface
• ✅ AI Chat powered by OpenAI GPT-4o-mini
• ✅ Real-time streaming responses
• ✅ Responsive sidebar layout (1/3 screen width)
• ✅ Input anchored to bottom
• ✅ Tailwind CSS styling

Get a copy of this starter template by clicking the Remix button in the top-right.

• The entrypoint is /backend/index.ts. That's the backend HTTP server, which also serves the all the frontend assets.

• The client-side entrypoint is /frontend/index.html

  • which in turn imports /frontend/index.tsx
  • which in turn imports the React app from /frontend/components/App.tsx.

• The chat feature uses:

  • /frontend/components/Chat.tsx - React component with useChat hook
  • /api/chat endpoint in /backend/index.ts - Streaming AI responses

The chat interface features:

• Sidebar layout - Takes up 1/3 of screen width and full height
• useChat hook from Vercel AI SDK handles message state and streaming
• OpenAI integration via Val Town's standard library
• Streaming responses for real-time chat experience
• Bottom-anchored input for optimal UX
• Clean design with Tailwind CSS

• Vercel AI SDK Documentation for more chat features and customization options.