Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

MCP tools have only ever returned text for the model to read. Now they return interactive UI. 🪄 TanStack AI's new MCP Apps support renders ui:// widgets right in the chat - static or fully interactive, with a client/server bridge.

133,087 Aufrufe • vor 3 Monaten •via X (Twitter)

32 Kommentare

Profilbild von Aleksandr Pasevin
Aleksandr Pasevinvor 3 Monaten

Love this! Can imagine multiple possibilities! But I hope this is not the beginning of something awful like marketing banners in your MCP responses :)) Next coming up add blocker for MCPs :PP

Profilbild von Vito Botta
Vito Bottavor 3 Monaten

This was always the direction for MCP. Returning just text from a tool that controls a UI was always going to feel limiting.

Profilbild von rbbydotdev
rbbydotdevvor 3 Monaten

need a api description language, or OpenAPI extension scheme to get this right

Profilbild von Mark Steadman
Mark Steadmanvor 3 Monaten

Looks cool! 😊 That said, I'm looking forward to seeing more updates around TanStack Start again. My timeline has been very AI-heavy lately, and I'd love to see more of the core framework too.

Profilbild von Shaunak Srivastava
Shaunak Srivastavavor 3 Monaten

love to see MCP's resource primitives done right 🤌

Profilbild von Mehdi Nabhani
Mehdi Nabhanivor 3 Monaten

This is so helpful! Now I can remove my workaround 🤪

Profilbild von ADT
ADTvor 3 Monaten

So we are back to ui now?

Profilbild von BruzWJ
BruzWJvor 3 Monaten

tbh surprised MCP renders real widgets now, but i'd only trust it for decisions once the model handles broken UI cleanly

Profilbild von Samian
Samianvor 3 Monaten

the model now shipping pixels back is a real shift. does the client treat those ui:// widgets as sandboxed by default or does the host app own the trust boundary

Profilbild von Husam
Husamvor 3 Monaten

This is clean

Profilbild von Adel Bucetta
Adel Bucettavor 3 Monaten

that changes everything. now we're not just writing code, we're building user experiences directly into the model itself.

Profilbild von Sebastian Buzdugan
Sebastian Buzduganvor 3 Monaten

the hard part is not rendering it's keeping widget state after tool retries

Profilbild von Nick Venturi
Nick Venturivor 3 Monaten

text chats feel like dial up now

Profilbild von Timur Yessenov
Timur Yessenovvor 3 Monaten

The `ui://` bit is a real product shift. Text tools make the model narrate state; widgets let the user fix state in place. I’d test stale widget data and cancelled tool calls before celebrating the demo.

Profilbild von Blake Yoder
Blake Yodervor 3 Monaten

Very nice! I custom built this in vercels ai-sdk but nice to see first-class support

Profilbild von gnryboooil 🇺🇦
gnryboooil 🇺🇦vor 3 Monaten

wow smth that @fastmcp had for a while

Profilbild von John
Johnvor 3 Monaten

ya'll crazy for this one.

Profilbild von Dipankar Sarkar
Dipankar Sarkarvor 3 Monaten

the real shift here isn't text to UI. it's tool to runtime. once a server can ship interactive widgets, MCP stops being a protocol and becomes an app platform. and platforms live or die on the trust boundary, not the render layer. who gets to draw in your agent's context is the question now.

Profilbild von Pawan Gangwani
Pawan Gangwanivor 3 Monaten

Woww

Profilbild von Marvin
Marvinvor 3 Monaten

@abhiaiyer @damien_schneid use chat + MessageFactory I guess

Profilbild von 晚晚
晚晚vor 3 Monaten

这就从工具调用变成小应用了

Profilbild von Pawzard
Pawzardvor 3 Monaten

the chatbox said hold on lemme just install a whole app real quick

Profilbild von Hidden Tape
Hidden Tapevor 3 Monaten

but who decides if the ui is trustworthy random mcp server pushing interactive widgets into my chat feels like a whole new attack surface 😭

Profilbild von Pochi
Pochivor 3 Monaten

interactive tool UI is great but it blurs the model/user action boundary, does the model get a structured event back so its world Model stays consistentt?

Profilbild von AIDUKEY|AI 中转站
AIDUKEY|AI 中转站vor 3 Monaten

For agent workflows, scattered provider configs become a tax. AIDUKEY is meant to give that stack one cleaner API layer across models.

Profilbild von Brosko
Broskovor 3 Monaten

bro the chat is literally becoming a whole operating system at this point 💀

Profilbild von Carry
Carryvor 3 Monaten

chat slowly becoming an app store 😐

Profilbild von Anmol
Anmolvor 3 Monaten

the model doesn't see what the user clicks unless the bridge replays it back

Profilbild von Picassio
Picassiovor 3 Monaten

bro the model isnt reading anymore its just SEEING that ui:// thing is gonna go crazy 🔥

Profilbild von Hussain Fakhruddin
Hussain Fakhruddinvor 3 Monaten

This is a fascinating development for AI interaction.

Profilbild von Salman Shaikh
Salman Shaikhvor 3 Monaten

does tanstack ai has ui package for react? if so can I use it with ai-sdk streamed events?

Profilbild von Adrian ∣ bloome Engineer
Adrian ∣ bloome Engineervor 3 Monaten

Rendering the widget is the easy part. The hard part is whose state it holds. UI painted for one model to read is still single-player. What matters is a surface multiple agents and humans can act on with shared state, so it's a place work happens, not a one-shot render.

Ähnliche Videos

OpenAI, Anthropic and Microsoft all back the same standard for running apps inside AI chats. Booking .com, Figma, and Canva are already using it. Still, most developers have never heard of it. It's called MCP Apps. So, why does it matter? The next time someone buys from your website, they may never visit it. They'll ask ChatGPT or Claude, and the model decides how your product shows up. Usually as plain text, sometimes wrong, with none of the experience you built. That's the next shift in how people find you: - SEO was about Google finding your page. - AEO was about AI citing you. - MCP Apps are about your actual product showing up inside the chat. An MCP server returns data. An MCP App returns data plus an interactive UI, like hotel cards or an add-to-cart flow, right inside the chat. The model even knows what the user clicked. In this episode, we build an MCP app from start to finish with Julien, the lead maintainer of Skybridge, an open-source framework that lets you turn any React app into an MCP app. Chapters: 0:00 - Intro 2:44 - MCP servers vs MCP Apps 5:12 - Live demo: Booking .com in ChatGPT 9:24 - How MCP Apps work: context and shared state 15:43 - Skybridge and its devtools 17:48 - Live demo: an e-commerce app in ChatGPT 24:49 - Code walkthrough: MCP tools to React views 28:10 - Syncing UI state: "What's in my cart?" 32:16 - Agent skill to turn any React app → MCP App 37:52 - Outro Link to Skybridge GitHub repo: MCP Apps bring your website into the chat. WebMCP does the reverse and lets AI agents use your website through tools it exposes. I've also written a full article on it, quoted below.

Akshay 🚀

17,059 Aufrufe • vor 5 Tagen

New course: MCP: Build Rich-Context AI Apps with Anthropic. Learn to build AI apps that access tools, data, and prompts using the Model Context Protocol in this short course, created in partnership with Anthropic Anthropic and taught by Elie Schoppik Elie Schoppik, its Head of Technical Education. Connecting AI applications to external systems that bring rich context to LLM-based applications has often meant writing custom integrations for each use case. MCP is an open protocol that standardizes how LLMs access tools, data, and prompts from external sources, and simplifies how you provide context to your LLM-based applications. For example, you can provide context via third-party tools that let your LLM make API calls to search the web, access data from local docs, retrieve code from a GitHub repo, and so on. MCP, developed by Anthropic, is based on a client-server architecture that defines the communication details between an MCP client, hosted inside the AI application, and an MCP server that exposes tools, resources, and prompt templates. The server can be a subprocess launched by the client that runs locally or an independent process running remotely. In this hands-on course, you'll learn the core architecture behind MCP. You’ll create an MCP-compatible chatbot, build and deploy an MCP server, and connect the chatbot to your MCP server and other open-source servers. Here’s what you’ll do: - Understand why MCP makes AI development less fragmented and standardizes connections between AI applications and external data sources - Learn the core components of the client-server architecture of MCP and the underlying communication mechanism - Build a chatbot with custom tools for searching academic papers, and transform it into an MCP-compatible application - Build a local MCP server that exposes tools, resources, and prompt templates using FastMCP, and test it using MCP Inspector - Create an MCP client inside your chatbot to dynamically connect to your server - Connect your chatbot to reference servers built by Anthropic’s MCP team, such as filesystem, which implements filesystem operations, and fetch, which extracts contents from the web as markdown - Configure Claude Desktop to connect to your server and others, and explore how it abstracts away the low-level logic of MCP clients - Deploy your MCP server remotely and test it with the Inspector or other MCP-compatible applications - Learn about the roadmap for future MCP development, such as multi-agent architecture, MCP registry API, server discovery, authorization, and authentication MCP is an exciting and important technology that lets you build rich-context AI applications that connect to a growing ecosystem of MCP servers, with minimal integration work. Please sign up here!

Andrew Ng

142,256 Aufrufe • vor 1 Jahr