Something went wrong: {error.message}
);
}
}
```
### Provider Fallback
```typescript
async function generateWithFallback(prompt: string) {
const providers = [
() => generateText({ model: anthropic('claude-3-sonnet-20240229'), prompt }),
() => generateText({ model: openai('gpt-4'), prompt }),
() => generateText({ model: google('gemini-pro'), prompt }),
];
for (const provider of providers) {
try {
return await provider();
} catch (error) {
console.warn('Provider failed, trying next:', error);
}
}
throw new Error('All providers failed');
}
```
## Testing Strategies
### API Route Testing
```typescript
import { POST } from '@/app/api/chat/route';
describe('/api/chat', () => {
it('should stream responses', async () => {
const request = new Request('http://localhost', {
method: 'POST',
body: JSON.stringify({ messages: [{ role: 'user', content: 'Hello' }] }),
});
const response = await POST(request);
expect(response.status).toBe(200);
expect(response.headers.get('content-type')).toBe('text/plain; charset=utf-8');
});
});
```
### React Hook Testing
```typescript
import { renderHook, act } from '@testing-library/react';
import { useChat } from 'ai/react';
describe('useChat', () => {
it('should handle message submission', async () => {
const { result } = renderHook(() => useChat({ api: '/api/chat' }));
act(() => {
result.current.setInput('Test message');
});
await act(async () => {
await result.current.handleSubmit();
});
expect(result.current.messages).toHaveLength(2);
});
});
```
## Deployment Considerations
1. **Environment Variables**
- Configure all provider API keys
- Set appropriate CORS headers
- Configure rate limiting
- Set up monitoring and alerting
2. **Edge Runtime**
- Use Edge Runtime for better performance
- Implement proper error boundaries
- Handle cold starts gracefully
- Monitor execution time limits
3. **Scaling Considerations**
- Implement proper caching strategies
- Use connection pooling for databases
- Monitor API usage and costs
- Set up automatic scaling rules
## Common Issues and Solutions
### Streaming Interruption
```typescript
// Handle aborted requests properly
export async function POST(req: Request) {
const controller = new AbortController();
req.signal.addEventListener('abort', () => {
controller.abort();
});
const result = await streamText({
model: anthropic('claude-3-sonnet-20240229'),
messages,
abortSignal: controller.signal,
});
return result.toDataStreamResponse();
}
```
### Type Safety
```typescript
// Define message types
interface ChatMessage {
id: string;
role: 'user' | 'assistant';
content: string;
timestamp: Date;
}
// Use proper typing for tools
const weatherTool = tool({
description: 'Get weather information',
parameters: z.object({
location: z.string().describe('The city name'),
unit: z.enum(['celsius', 'fahrenheit']).optional(),
}),
execute: async ({ location, unit = 'celsius' }) => {
// Implementation
},
});
```
## Resources
- [Vercel AI SDK Docs](https://sdk.vercel.ai/docs)
- [Provider Documentation](https://sdk.vercel.ai/providers/ai-sdk-providers)
- [Examples Repository](https://github.com/vercel/ai/tree/main/examples)
- [Community Discord](https://discord.gg/vercel)
## Development Lifecycle
This configuration includes comprehensive hooks for:
- **Automatic formatting** of TypeScript/JavaScript files
- **API route validation** and security checks
- **Dependency management** and installation notifications
- **Development reminders** for streaming and error handling
- **Session completion** checklists for quality assurance
## Quick Start Guide
### 1. Basic Chat Setup
```bash
/ai-chat-setup basic
```
### 2. Streaming Implementation
```bash
/ai-streaming-setup chat
```
### 3. Tool Integration
```bash
/ai-tools-setup api
```
### 4. Provider Configuration
```bash
/ai-provider-setup multi anthropic
```
### 5. RAG System
```bash
/ai-rag-setup basic
```
## Best Practices Summary
- ✅ **Always implement streaming** for better user experience
- ✅ **Use proper error handling** with retry mechanisms
- ✅ **Validate all inputs** with Zod schemas
- ✅ **Implement provider fallbacks** for reliability
- ✅ **Add comprehensive testing** for production readiness
- ✅ **Monitor usage and costs** for optimization
- ✅ **Secure API keys** and implement rate limiting
- ✅ **Document APIs** and provide usage examples
Remember: **Build robust, streaming-first AI applications with comprehensive error handling, security, and monitoring!** 🚀