Summary: Vercel Shop, the open source Next.js storefront template for Shopify, is now generally available, and it treats AI agents as first-class shoppers. Product pages ship as machine-readable content, agents get standardized shopping tools via the Universal Commerce Protocol, and an eve-powered shopping assistant lives in the same codebase as the storefront. For product builders, this is an early template for what agent-ready commerce looks like in practice.
Why “agent-ready” is a real product concern
Most storefronts were designed for two audiences: people and search engine crawlers. Agents shopping on the web today still have to interpret visual layouts and repurpose human-oriented tools, which makes them fragile. Vercel and Shopify’s announcement frames the problem plainly: agents need product information they can read directly and tools designed for how they shop.
Vercel Shop attacks this on two fronts. The same product URL can serve a visual page to people or structured product data — price, availability, options — that an agent can consume without parsing the layout. Pages also embed structured data and sitemaps so search and answer engines can discover products.
The Universal Commerce Protocol piece
Shopify co-developed the Universal Commerce Protocol (UCP), which gives agents a standard way to search a catalog, read product details, check availability, build a cart, and get a checkout link. Vercel Shop makes those capabilities discoverable at the merchant’s own domain, so agents can use MCP to search and build carts without navigating the site.
This matters because it moves agent commerce from scraping to APIs. If you’re building commerce tooling, the pattern to note is: standardized capabilities, exposed at the merchant’s domain, consumed over an agent protocol.
One codebase, two shoppers
The template bundles the product catalog, cart, and checkout from Shopify’s Hydrogen SDK into a Next.js storefront, plus a shopping assistant built on eve — the agent framework Vercel open sourced earlier, which we covered when it launched. Because the storefront and assistant share a codebase, teams can customize both the store’s design and how the assistant helps shoppers. And because they share a cart, shoppers keep their items when moving between browsing product pages and asking the assistant to find things.
The Hydrogen SDK itself was rebuilt with Vercel to work across JavaScript frameworks, and that rebuilt SDK is now generally available. In the announcement, Shopify CEO Tobi Lütke emphasized that checkout is genuinely hard infrastructure worth remixing rather than rebuilding, and that Shopify’s infrastructure is open for custom builds on top of it. Skills included in the template also guide coding agents through setup, customization, and updates — a nice example of agents maintaining agent infrastructure.
What shipped on it
Vercel launched its own merch store at vercel.store using Vercel Shop, with a shopping agent that finds products, adds them to a cart, and hands off to checkout. Shopify, Next.js, and Vercel already power storefronts for brands like AG1, Bombas, and PAIGE. When PAIGE re-architected its ecommerce platform, it reported a 22% revenue increase and a 76% conversion increase over Black Friday and Cyber Monday, with no downtime.
Trying it yourself
Spin up a storefront with:
pnpm create next-app@latest my-store --example https://github.com/vercel/shopFrom there, connect your Shopify store and configure the storefront through the documentation. If you’re evaluating whether to make your own product agent-readable, this template is a concrete reference implementation rather than a spec document — worth reading even if you don’t run on Shopify.
Sources
View the original post on X