Family GPT Chat

A ChatGPT-like chat application built for Val Town using React and Hono with OpenAI integration.

• 💬 Real-time chat interface with ChatGPT-like styling
• 🤖 OpenAI GPT-3.5-turbo integration via Val Town's standard library
• 📱 Responsive design with Tailwind CSS
• ⚡ Fast TypeScript development with Deno
• 🔄 Conversation history maintained during session
• ⏳ Loading states and error handling
• ✅ Full type safety with TypeScript

family-gpt/
├── backend/
│   ├── index.ts          # Hono server with chat API
│   └── index.test.ts     # Backend tests
├── frontend/
│   ├── components/
│   │   ├── App.tsx       # Main chat interface
│   │   ├── ChatMessage.tsx # Individual message component
│   │   └── MessageInput.tsx # Message input form
│   ├── index.html        # Bootstrap HTML file
│   └── index.tsx         # React entry point
├── shared/
│   └── types.ts          # Shared TypeScript types
└── deno.json             # Deno configuration

• GET / - Serves the React frontend
• POST /api/chat - Chat with OpenAI (requires message and optional conversation history)
• GET /api/health - Health check endpoint
• GET /frontend/* - Static file serving

• Deno runtime
• Val Town account (for deployment)

# Type check
deno task check

# Format code
deno task fmt

# Lint code
deno task lint

# Run tests
deno task test

# Run all quality checks
deno task quality

# Deploy (runs quality checks first)
deno task deploy

• Backend: Hono framework
• Frontend: React with TypeScript
• Styling: Tailwind CSS (via CDN)
• AI: OpenAI GPT-3.5-turbo via Val Town's standard library
• Runtime: Deno
• Platform: Val Town

1. Open the application in your browser
2. Type a message in the input field
3. Press Enter or click Send
4. The AI will respond with helpful information
5. Continue the conversation - history is maintained during the session

• Streaming responses for real-time chat feel
• Conversation persistence across sessions
• Message editing and deletion
• Export conversation history
• Custom system prompts
• Multiple conversation threads

This project follows Val Town development best practices:

• TypeScript everywhere
• Testable code with dependency injection
• SOLID principles
• Quality checks before deployment

🤖 Generated with opencode