// README.md
A modern AI chat client built with Next.js that connects to various AI APIs. Deploy instantly on Vercel!
- 🚀 Modern, responsive UI built with Tailwind CSS
- 💬 Real-time chat interface with typing indicators
- 🔐 Secure client-side API key storage
- 📱 Mobile-friendly design
- ✨ Markdown support for formatted responses
- 🎨 Syntax highlighting for code blocks
- 🔄 Auto-resizing text input
- 💾 Persistent conversation storage across devices
- 🏷️ AI-generated conversation titles
- 🤖 Model selection for different AI providers
- ☁️ Free cloud sync with Supabase
-
Clone the repository
-
Install dependencies:
npm install
-
Run the development server:
npm run dev
-
Open http://localhost:3000 in your browser
- Get your API key from your preferred AI service provider
- Enter your API key when prompted in the app
- Start chatting!
This app uses Supabase (PostgreSQL) for persistent conversation storage across devices:
- Create a free Supabase account at supabase.com
- Create a new project in your Supabase dashboard
- Run the SQL setup in your Supabase SQL editor:
-- Copy and paste the contents of supabase-setup.sql
- Get your credentials from Settings > API in your Supabase dashboard
- Add environment variables to your Vercel project:
NEXT_PUBLIC_SUPABASE_URL
(your project URL)SUPABASE_SERVICE_ROLE_KEY
(your service role key - NOT the anon key!)
- Deploy to Vercel - the app will automatically use Supabase storage
Free Tier Benefits:
- 500MB database storage
- 50,000 monthly active users
- 2GB bandwidth
- Perfect for personal chat apps!
For server-side API key storage (optional), create a .env.local
file:
API_KEY=your-api-key-here
- Next.js 14 - React framework with App Router
- Tailwind CSS - Utility-first CSS framework
- AI APIs - Integration with various AI service providers
- React Markdown - Markdown rendering with syntax highlighting
MIT