ChatGPT Clone with LastLogin Authentication

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)