This example demonstrates how to use the Vercel AI SDK with Next.js and the experimental_createProviderRegistry function. This allows developers to easily handle multiple AI providers and models within their application, enabling users to switch between them seamlessly.
Key Features:
- Multi-Provider Support: Integrate with various AI providers like OpenAI, Anthropic, and Google Generative AI.
- Dynamic Model Switching: Users can easily switch between different AI models directly within the chatbot interface.
- Vercel AI SDK Integration: Leverages the
streamTextfunction for efficient text streaming. - Next.js Framework: Built on Next.js for a robust and scalable application foundation.
Use Cases: This template is ideal for building advanced AI chatbots where flexibility in model choice is crucial. It's perfect for:
- Developers wanting to experiment with different LLMs without changing core application logic.
- Applications requiring fallback mechanisms or A/B testing of AI models.
- Educational platforms demonstrating various AI capabilities.
How to Use:
To get started, you can bootstrap the example using create-next-app:
npx create-next-app --example https://github.com/vercel-labs/ai-sdk-preview-provider-registry ai-sdk-preview-provider-registry-example
# or
yarn create next-app --example https://github.com/vercel-labs/ai-sdk-preview-provider-registry ai-sdk-preview-provider-registry-example
# or
pnpm create next-app --example https://github.com/vercel-labs/ai-sdk-preview-provider-registry ai-sdk-preview-provider-registry-exampleTo run the example locally:
- Sign up for accounts with the AI providers you want to use (e.g., OpenAI, Anthropic).
- Obtain API keys for each provider.
- Set the required environment variables (e.g.,
OPENAI_API_KEY,ANTHROPIC_API_KEY,GOOGLE_GENERATIVE_AI_API_KEY) in a new.envfile, based on the.env.example. - Run
npm installto install dependencies. - Run
npm run devto launch the development server.
Learn More:




