Building MCP Apps With GraphQL Patterns You Already Know
summary
Claims that common GraphQL client patterns map directly to MCP apps and then shows it: uses Apollo’s AI apps client plus Apollo MCP server, a tool call link terminating link, and a Vite plugin that generates an application manifest and TypeScript tool types. Demo builds an MCP app that executes GraphQL operations as tools (resource read returns text/html profile=mcp-app), shows tool input/result notifications, supports queries and mutations, and uses fragment collocation to add ratings everywhere — the UI works though MCPJam occasionally hangs.
AI-written summary · about
chapters (14)
- 0:00Introduction to MCP apps
- 1:05What are MCP apps
- 3:35MCP app architecture
- 4:39GraphQL and MCP roles
- 6:44Apollo client AI apps
- 9:57Building an MCP app demo
- 11:43Tool definitions with GraphQL
- 16:40Using useToolInfo hook
- 19:50Handling tool input
- 20:53Mutations as tools
- 22:18Fragment collocation in MCP
- 24:43Advanced MCP app features
- 26:30Apollo client 4.2 release
- 27:12Q&A
related talks
23mMCP: Is GraphQL the Right “Tool” For the Job?
26mBuild your First MCP App
29mMCP Apps: Primitives, discovery, and the Future of Software
47mSchema Design in the Age of AI: Pragmatic Patterns to Evolve and Ship Fast
31mHow to build an MCP server for Vue?
30mLet's make an MCP Server!
20mLetting AI Interface with Your App with MCPs
22mMCP UI: Extending the frontier