Vercel AI

image

Vercel AI SDK

The Vercel AI SDK is a library for building edge-ready AI-powered streaming text and chat UIs.

Features

  • SWRpowered React, Svelte and Vue helpers for streaming text responses and building chat and completion UIs
  • First-class support for LangChain and OpenAI, Anthropic, and HuggingFace
  • Edge Runtime compatibility
  • Callbacks for saving completed streaming responses to a database (in the same request)

Installation

pnpm install ai

View the full documentation and examples on sdk.vercel.ai/docs

Example: An AI Chatbot with Next.js and OpenAI

With the Vercel AI SDK, you can build a ChatGPT-like app in just a few lines of code:

// ./app/api/chat/route.js
import { Configuration, OpenAIApi } from 'openai-edge'
import { OpenAIStream, StreamingTextResponse } from 'ai'

const config = new Configuration({
 apiKey: process.env.OPENAI_API_KEY
})
const openai = new OpenAIApi(config)

export const runtime = 'edge'

export async function POST(req) {
 const { messages } = await req.json()
 const response = await openai.createChatCompletion({
 model: 'gpt-4',
 stream: true,
 messages
 })
 const stream = OpenAIStream(response)
 return new StreamingTextResponse(stream)
}
// ./app/page.js
'use client'

import { useChat } from 'ai/react'

export default function Chat() {
 const { messages, input, handleInputChange, handleSubmit } = useChat()

 return (
 <div>
 {messages.map(m => (
 <div key={m.id}>
 {m.role}: {m.content}
 </div>
 ))}

 <form onSubmit={handleSubmit}>
 <input
 value={input}
 placeholder="Say something..."
 onChange={handleInputChange}
 />
 </form>
 </div>
 )
}

View the full documentation and examples on sdk.vercel.ai/docs

Authors

This library is created by Vercel and Next.js team members, with contributions from:

Contributors