AI SDK v5 Crash Course
Why did I bought?
Matt is a great teacher and a well experienced develoeper that uses TypeScript even to make coffee 😅 Now he started a new adventure over at aihero.dev and while following Kent C. Dodds course on MCP I wanted to close the loop between server, agents and clients. And this is the first course that’ll allow me to do so!
What’s in for you?
To be brutally honest, I do not know it yet. This is just my place where I am collecting notes on the courses I am learning, but I’m pretty sure sooner or later you’ll find plenty of articles that will be more structured than these notes 😅
AI SDK Basics
Learn how to make the first calls to some of the fundamental models out there like Claude, OpenAI or Gemini API.
-
Choosing Your Model
Deciding which model is best for your use case it's something only you can discover, here you'll learn how to implement them with AI SDK.
-
Generating Text
It's time for the first output from your LLM.
-
Streaming Text
Get all the text at once is not a great user experience, let's stream it into our terminal!
-
UI Message Streams
From a simple string that get's streamed in, we can get so much more information that are crucial to build our UI.
-
Streaming to a UI
Until now we lived inside a terminal, but in order to understand the importance of toUIMessageStream() we will build our first chat web app.
-
System Prompts
A system prompt is fundamental to structure how our LLM will behave, let's discover how AI SDK allow us to set this up.
-
Passing Images and Files
From simple text now it's time to learn how we can pass images and files to our LLM.
-
Steaming Objects
Streaming text is a cool feature of AI SDK and the implementation is incredibly easy, but at the end of the day it is just text. What if we want proper objects that we can pass inside a custom component?
LLM Fundamentals
After a quick dive into AI SDK, it's time to understand how an LLM works and how to improve our experience with it.
-
Tokens
A token is the essential part of every interaction we have with an LLM. It is how they understand what we want and how they respond to us, it is also how the company behind them calculate our bills; so it is better to learn what they are 😅
-
Traking token usage
As we discovered, tokens are an essential piece for our LLM, but they get even more important when we need to pay them! Better learn how to track their usage.
-
Representing data as tokens
Different data formats affect token efficiency, let's optimize them!
-
Context Window
The context window is maybe one of the most important aspects of all the LLM understanding. Basically it represents capability of an LLM to remember the topics covered during a conversation, but there's more to it.
-
Prompt Caching
Prompt caching is a feature that let us save some money by treating the cached tokens in a different way.
Agents
Agents are simply the evolution of a general LLM. Where you see a model as a general purpose worker, an agent is a focused professional able to work on a specific issue.
-
Calling Tools
Tools are new capabilities we add to our LLM to reach for external data or compute power. In this lesson we discover how to create new tools that our LLM can indipendently choose to call, letting us create new kind of Agents.
-
Message Parts
Our LLM are capable of producing many different kind of messages, some are as detailed as possible while others focus more on providing a structure that we can easily consume.
-
Showing Tools in the Frontend
Let's learn how to bring type safety between the tools we defined inside our Agent and the frontend that will consume them.
-
Calling MCP Servers via stdio
in this lesson we will learn how we can leverage the AI SDK to connect into an MCP Server via stdio
-
Calling MCP Servers via HTTP
Here we should've learned how to connect to a remote MCP Server, but there are some issues 😞
Andrea Barghigiani
Frontend and Product Engineer in Palermo , He/Him