A fullstack React + Hono app that lets you chat with ChatGPT, with user authentication and thread history.
Features
š Authentication via LastLogin (Google OAuth)
š¬ Chat with ChatGPT (GPT-4o-mini)
š Thread-based conversation history
šļø SQLite storage for persistence
š± Responsive design with TailwindCSS
Project Structure
āāā backend/
ā āāā index.ts # Main Hono server with API routes
āāā frontend/
ā āāā index.html # Main HTML template
ā āāā index.tsx # React frontend app
āāā README.md
Current Status: Phase 3 Complete ā
Backend Foundation:
ā Hono app with LastLogin authentication
ā SQLite schema for threads and messages
ā Basic API endpoints for threads CRUD
ā Static file serving for React frontend
Frontend Foundation:
ā React app with authentication UI
ā Basic layout with sidebar for threads
ā Login/logout flow with LoginWithGoogleButton
ā Thread listing and creation
ā Responsive design with TailwindCSS
Chat Interface:
ā Chat message display with user/assistant styling
ā Message input with textarea and send button
ā OpenAI API integration (GPT-4o-mini)
ā Real-time message updates
ā Loading states and typing indicators
ā Conversation history context
API Endpoints
GET / - Main React app
GET /api/threads - List user's threads
POST /api/threads - Create new thread
GET /api/threads/:id/messages - Get messages for thread
POST /api/threads/:id/messages - Send message and get AI response
Database Schema
Tables:
last-login-chat-threads - User chat threads
last-login-chat-messages - Individual messages in threads
Next Steps
Phase 4: Thread management and auto-titles
Phase 5: Final polish and responsive design
Debug Routes
/debug - Check authentication status
/api/test-create-thread - Create a test thread (when logged in)