Building AI-Powered Features with the Vercel AI SDK

The AI SDK Advantage

The Vercel AI SDK provides a unified interface for working with AI models. It handles streaming, structured output, and tool calling — so you can focus on building features, not infrastructure.

Streaming Chat in 20 Lines

"use client"

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

return ( <div> {messages.map((m) => ( <div key={m.id}> <strong>{m.role}:</strong> {m.content} </div> ))} <form onSubmit={handleSubmit}> <input value={input} onChange={handleInputChange} /> </form> </div> ) } ```

Structured Data Extraction

Extract typed data from unstructured text:

import { generateObject } from "ai"

const result = await generateObject({ model: openai("gpt-4o"), schema: z.object({ sentiment: z.enum(["positive", "negative", "neutral"]), summary: z.string(), topics: z.array(z.string()), }), prompt: Analyze this customer review: "${review}", }) ```

Tool Calling

Let the AI invoke your functions:

const result = await generateText({
  model: openai("gpt-4o"),
  tools: {
    getWeather: tool({
      description: "Get current weather for a location",
      parameters: z.object({ city: z.string() }),
      execute: async ({ city }) => fetchWeather(city),
    }),
  },
  prompt: "What's the weather in San Francisco?",
})

Production Considerations

• Rate limiting — protect your API routes
• Streaming — always stream for better UX
• Caching — cache deterministic results
• Cost monitoring — track token usage per user