Introduction to Vercel AI SDK and Unified Frameworks

Writing individual wrappers for every LLM provider (such as OpenAI, Anthropic, or Gemini) leads to duplicate boilerplate code. The Vercel AI SDK solves this by providing a unified, type-safe framework to call any LLM, handle stream buffering, and bind outputs to frontend components.

1. Core Package Architecture

The SDK is divided into three main modules:

• ai (Core SDK): Contains model-agnostic functions (such as generateText, streamText, and generateObject) and type schemas.
• Provider Adapters: Packages (like @ai-sdk/openai or @ai-sdk/anthropic) that convert provider-specific payloads to the SDK standard format.
• ai/react (UI Hooks): Pre-designed frontend hooks (such as useChat and useCompletion) that handle connection states, streaming typewriter effects, and errors.

2. Why Choose Vercel AI SDK?

• Unified API: Call gpt-4o or claude-3 using the exact same code structure. Changing models only requires swapping the provider adapter parameter.
• Robust Streaming: Built-in support for streaming text directly to standard Response objects without manual buffer encoding.
• Generative UI Support: Stream structured JSON components directly into React interfaces.

3. Basic Installation

Install the core SDK along with the required provider adapters inside your project:

# Install the core Vercel AI SDK and the OpenAI provider
npm install ai @ai-sdk/openai