AIUI/README.md

AIUI - Web Chat Interface

A modern, responsive web interface for AI chat with OpenAI-compatible API support and streaming responses.

Features

• 💬 Real-time streaming chat responses
• 🌙 Beautiful dark theme
• 📱 Fully responsive (desktop + mobile)
• 🔧 Customizable API settings (base URL, model, API key)
• 📜 Multiple conversation support
• ✨ Markdown rendering with syntax highlighting
• ⚡ Built with React + TypeScript + Tailwind CSS + Vite

Project Structure

AIUI/
├── frontend/          # React frontend
│   ├── src/
│   │   ├── components/    # React components
│   │   ├── hooks/         # Custom hooks
│   │   ├── services/      # API services
│   │   ├── stores/        # State management (Zustand)
│   │   ├── types/         # TypeScript types
│   │   └── utils/         # Utilities
│   └── package.json
├── backend/           # Express proxy server
│   └── src/
│       └── index.js
├── package.json       # Root package.json with workspace scripts
└── README.md

Quick Start

Prerequisites

• Node.js 18+
• npm

1. Install Dependencies

# Install root dependencies
npm install

# Install backend dependencies
cd backend && npm install && cd ..

# Install frontend dependencies
cd frontend && npm install && cd ..

2. Start the Application

# Start both frontend and backend
npm run dev

Or start them separately:

# Terminal 1 - Backend (port 3001)
npm run backend

# Terminal 2 - Frontend (port 3000)
npm run frontend

3. Open in Browser

Navigate to http://localhost:3000

Usage

1. Configure API: Click the settings icon (⚙️) in the top right to set your:

   • API Base URL (e.g., https://api.openai.com/v1)
   • API Key
   • Model name (e.g., gpt-4o-mini, gpt-4o)

2. Start Chatting: Click "New Chat" and send a message!

3. Mobile: The sidebar is collapsible - use the ☰ button to toggle it.

Development

Build for Production

npm run build

Build Frontend Only

cd frontend && npm run build

API Configuration

The interface supports any OpenAI-compatible API:

Provider	Base URL	Example Models
OpenAI	https://api.openai.com/v1	gpt-4o-mini, gpt-4o
OpenRouter	https://openrouter.ai/api/v1	varies
Local (Ollama)	http://localhost:11434/v1	llama2, mistral
Custom	Your endpoint	Your models

Tech Stack

• Frontend: React 18, TypeScript, Tailwind CSS, Vite, Zustand, Lucide Icons
• Backend: Express, CORS, node-fetch
• Build: TypeScript Compiler, Vite

License

MIT