AI Agent: A witty code reviewer that speaks Afrikaans
# A witty code reviewer that speaks Afrikaans
A React-based chat interface for an AI agent with client-side API integration.
## Features
- 🤖 Real AI integration with Anthropic Claude and OpenAI GPT-4
- 🔐 Client-side API key management (stored in browser localStorage)
- 💬 Clean, modern chat UI with markdown support
- 📱 Responsive design for mobile and desktop
- 🚀 One-command deployment to Vercel
## Quick Start
### Local Development
1. Install dependencies:
```bash
npm install
```
2. Start the development server:
```bash
npm run dev
```
3. Open your browser to `
localhost`
4. Configure your API key in the settings modal
## Getting an API Key
### Anthropic (Claude)
1. Visit console.anthropic.com
2. Sign up or log in
3. Go to API Keys section
4. Create a new API key
5. Copy the key (starts with `sk-ant-`)
### OpenAI (GPT-4)
1. Visit platform.openai.com
2. Sign up or log in
3. Go to API Keys section
4. Create a new API key
5. Copy the key (starts with `sk-`)
## Deployment to Vercel
### Manual Deployment
1. Install Vercel CLI (if not already installed):
```bash
npm install -g vercel
```
2. Login to Vercel:
```bash
vercel login
```
3. Deploy:
```bash
vercel --prod
```
## GitHub Integration
This project is version-controlled with Git and deployed via GitHub:
- **Repository**: Your code is stored in a GitHub repository
- **Continuous Deployment**: Vercel automatically deploys when you push to the main branch
- **Version Control**: Track changes and collaborate using Git
### Updating Your Agent
To make changes to your agent:
```bash
# 1. Make your code changes
# 2. Commit and push to GitHub
git add .
git commit -m "Description of your changes"
git push origin main
# 3. Vercel will automatically deploy the changes
```
Your changes will be live within 1-2 minutes after pushing to GitHub!
## Built With
- React - UI library
- Vite - Build tool
- React Markdown - Markdown rendering
- Vercel - Hosting and serverless functions
## License
This p …