Step 3 — Stream Text

typescript import { streamText } from "ai"; const result = await streamText({ model: openai("gpt-5"), prompt: "Write a poem", }); for await (const chunk of result.textStream) { process.stdout.write(chunk); }

Step 4 — React Hooks

tsx "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} onChange={handleInputChange} / </form </div ); } Three lines of state, streaming chat works.

typescript import { tool } from "ai"; import { z } from "zod"; const weather = tool({ description: "Get weather for a city", parameters: z.object({ city: z.string() }), execute: async ({ city }) = fetchWeather(city), }); const { text } = await generateText({ model: openai("gpt-5"), tools: { weather }, prompt: "Weather in Istanbul?", });

typescript import { embedMany } from "ai"; import { openai } from "@ai-sdk/openai"; const { embeddings } = await embedMany({ model: openai.embedding("text-embedding-3-small"), values: chunks, });

Wire production env to use Claude in fallback to GPT-4 — same API.

The SDK is free. You pay the provider directly.

Use it in a Next.js app — see [Next.js + AI tutorial](https://vibecodingturkey.com/en/rehberler/how-to-deploy-vercel).

How to Use Vercel AI SDK 2026 — Guide

Q: Step 1 — Install

bash pnpm add ai @ai-sdk/openai @ai-sdk/anthropic

Q: Step 2 — Generate Text

typescript import { generateText } from "ai"; import { openai } from "@ai-sdk/openai"; const { text } = await generateText({ model: openai("gpt-5"), prompt: "Hello", }); Provider-agnostic — swap openai for anthropic or google without changing the rest.

Q: Step 5 — Tool Use

typescript import { tool } from "ai"; import { z } from "zod"; const weather = tool({ description: "Get weather for a city", parameters: z.object({ city: z.string() }), execute: async ({ city }) = fetchWeather(city), }); const { text } = await generateText({ model: openai("gpt-5"), tools: { weather }, prompt: "Weather in Istanbul?", });

Q: Step 6 — RAG

typescript import { embedMany } from "ai"; import { openai } from "@ai-sdk/openai"; const { embeddings } = await embedMany({ model: openai.embedding("text-embedding-3-small"), values: chunks, });

Q: Provider Switching

Wire production env to use Claude in fallback to GPT-4 — same API.

Q: Pricing

The SDK is free. You pay the provider directly.

Q: Next Step

Use it in a Next.js app — see [Next.js + AI tutorial](https://vibecodingturkey.com/en/rehberler/how-to-deploy-vercel).

How to Use Vercel AI SDK 2026

Vercel AI SDK is the de-facto TypeScript library for building AI apps. Provider-agnostic, streaming-native, React-friendly. Step 1 — Install bash pnpm add ai @ai-sdk/openai @ai-sdk/anthropic Step 2 — Generate Text typescript import { generateText } from "ai"; import { openai } from "@ai-sdk/openai"; const { text } = await generateText{ model: openai"gpt-5", prompt: "Hello", }; Provider-agnostic —…

All guides

Related guides

How to Start AI SaaS 2026
How to Use v0 by Vercel 2026 — Complete Walkthrough
How to Become a Vibe Coder: 2026 Roadmap
How to Build an AI Agent 2026
How to Build a Chatbot 2026