Open-source B2B and marketplace ecommerce; new stores include an MCP server for AI agents.
WebCake Storefront
Overview
Description from the maker (original English)
Build pages and manage products, orders, and content on the WebCake/StoreCake storefront builder.
PopNx MCP’s three pillars
These three are never merged into one score: opinions, measurements and popularity are different things.
- User voiceiNo reviews yetReviews open together with accounts in a later step
- Our basic checksi3 of 3 passedChecked from public information; code not scanned yet
- UsageiNot measured yet★ –
What you can do with it
We have not written a plain-language summary for this one yet. Below are the facts we read from the registry.
- Connection: Computer or cloud
- Transport: stdio, Streamable HTTP
- Category: Online shops & payments
- You need to fill in: WEBCAKE_TOKEN, WEBCAKE_SESSION_ID, PEXELS_API_KEY, x-webcake-jwt, x-webcake-session-id
Install
Pick the AI app you use, then copy the settings.
Before you install
- Basic checks: 3 of 3 passed
- Runs on the maker’s server: what you ask it goes through their server.
- You fill in yourself:
WEBCAKE_TOKEN,WEBCAKE_SESSION_ID,WEBCAKE_ENV,PEXELS_API_KEY,x-webcake-jwt,x-webcake-session-id
Values marked secret are keys to your account. Never share them or paste them into a chat.
You need
- Runs in the cloudNothing to install; it connects over the internet
- npmNode.js installed (for the npx command)
Which app do you use?
Pick your app above. We remember it, so next time the button says “Install in …”.
This address needs a key in a request header, which the add-connector menu cannot set. Use Claude Code, Cursor or VS Code instead.
Or run it on your computer
Open Claude Desktop → Settings → Developer → Edit Config, and paste this into claude_desktop_config.json
{
"mcpServers": {
"webcake-storefront": {
"command": "npx",
"args": [
"-y",
"webcake-storefront-mcp"
],
"env": {
"WEBCAKE_TOKEN": "your-value",
"WEBCAKE_SESSION_ID": "your-value",
"WEBCAKE_ENV": "your-value",
"PEXELS_API_KEY": "your-value"
}
}
}
}Run this in your terminal
claude mcp add --transport http webcake-storefront https://store.toolvn.io.vn/mcp --header 'x-webcake-jwt: your-value' --header 'x-webcake-session-id: your-value'Or run it on your computer
claude mcp add webcake-storefront --env WEBCAKE_TOKEN=your-value --env WEBCAKE_SESSION_ID=your-value --env WEBCAKE_ENV=your-value --env PEXELS_API_KEY=your-value -- npx -y webcake-storefront-mcpFill in the empty values before running it.
Or copy the settings yourself
Paste into .cursor/mcp.json in your project, or ~/.cursor/mcp.json
{
"mcpServers": {
"webcake-storefront": {
"url": "https://store.toolvn.io.vn/mcp",
"headers": {
"x-webcake-jwt": "your-value",
"x-webcake-session-id": "your-value"
}
}
}
}Or run it on your computer
Or copy the settings yourself
Paste into .cursor/mcp.json in your project, or ~/.cursor/mcp.json
{
"mcpServers": {
"webcake-storefront": {
"command": "npx",
"args": [
"-y",
"webcake-storefront-mcp"
],
"env": {
"WEBCAKE_TOKEN": "your-value",
"WEBCAKE_SESSION_ID": "your-value",
"WEBCAKE_ENV": "your-value",
"PEXELS_API_KEY": "your-value"
}
}
}
}Your browser asks to open the app, then the app shows the settings and asks you to confirm. Key values are left empty for you to fill in.
Or copy the settings yourself
Paste into .vscode/mcp.json in your project
{
"servers": {
"webcake-storefront": {
"type": "http",
"url": "https://store.toolvn.io.vn/mcp",
"headers": {
"x-webcake-jwt": "your-value",
"x-webcake-session-id": "your-value"
}
}
}
}Or run it on your computer
Or copy the settings yourself
Paste into .vscode/mcp.json in your project
{
"servers": {
"webcake-storefront": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"webcake-storefront-mcp"
],
"env": {
"WEBCAKE_TOKEN": "your-value",
"WEBCAKE_SESSION_ID": "your-value",
"WEBCAKE_ENV": "your-value",
"PEXELS_API_KEY": "your-value"
}
}
}
}Your browser asks to open the app, then the app shows the settings and asks you to confirm. Key values are left empty for you to fill in.
This address needs a key in a request header, which the add-connector menu cannot set. Use Claude Code, Cursor or VS Code instead.
Your choice stays on this device in a cookie; no account needed.
Values you fill in
- Storefront JWT Bearer token (the builder's `jwt` cookie / store_jwt).
- Session id sent as the x-session-id header (the builder's `wsid` cookie).
WEBCAKE_ENVenvNamed environment preset that fills the API + app base URLs (default prod).- Optional Pexels API key for the search_images tool.
x-webcake-jwtsecret HTTP headerStorefront Bearer JWT (or authenticate via the OAuth flow / ?jwt= link).x-webcake-session-idsecret HTTP headerSession id (the builder's wsid).
These settings are generated from the maker’s registry entry. If the README says otherwise, follow the README.
What it can do
The server asks you to sign in before it lists its tools.
Basic checksi
We check information anyone can see; we have not read the code. Checks that do not apply are left out of the count. · Checked Nov 7, 2026
- ✓ Pass
Maker matches the repo
The registry name was verified with the GitHub account vuluu2k, which owns the repo
- … Not checked yet
Still maintained
We have not read this repo from GitHub yet
- … Not checked yet
Has a licence
We have not read this repo from GitHub yet
- ✓ Pass
Endpoint responds
Responded in 1827 ms (HTTP 401)
- ✓ Pass
Sign-in with OAuth
Declares OAuth sign-in, so your AI app can take you to log in
- … Not checked yet
No hidden instructions in tool descriptions
Not checked yet; we read the tool list when we check the endpoint
Compared with others in Online shops & paymentsi
- More stars than 0% of the other 1755 servers in this category
- Published to the registry more recently than 89% of the other 1755 servers in this category
- Basic checks equal to or better than 100% of the other 1755 servers in this category
Compared with every active server in this category in the registry. Stars count only when the publisher owns the repo.
Common questions
Is WebCake Storefront safe?
It passed 3 of 3 applicable basic checks. We have not read the code. Before adding a key or token, see what access the server asks for and use a key with only the permissions you need.
What keys or codes does it need?
You need to fill in: WEBCAKE_TOKEN, WEBCAKE_SESSION_ID, PEXELS_API_KEY, x-webcake-jwt, x-webcake-session-id
Does it run on my computer or in the cloud?
Either way works: install it on your computer or connect to the cloud version.
Is it still maintained?
The GitHub repo last changed –, and the latest version (1.38.0) reached the registry 2 days ago.
Which apps can use it?
Apps that support MCP, such as Claude Desktop, Claude Code, Cursor and VS Code. It connects by URL, so apps that accept remote MCP servers work too, such as ChatGPT in developer mode.
What can I use instead?
In the same category: Spree Commerce: open-source B2B and marketplace ecommerce, Stripe MCP, MCP Cn Commerce
Alternatives
Servers in the same category from other makers, sorted by stars.
Reading a card:★ GitHub starsiThree pillars: reviews · checks · usageiUpdated = latest version published to the registryi
Stripe MCP
Stripe’s official server lets AI view and manage customers, products, payments and invoices. Connect to Stripe’s cloud and sign in with OAuth.
MCP Cn Commerce
8 read-only MCP platform entries; support is operation-specific; merchant live acceptance pending
README from the maker
Open the README
Copied from the maker’s repo as written. PopNx MCP has not reviewed or endorsed it. HTML, images and scripts are removed. Links lead off this site.
WebCake Storefront MCP
English · Tiếng Việt
Describe a store page in plain words — your AI builds it, validates it, and publishes it to your WebCake storefront.
⭐ If this saves you an afternoon of dragging blocks around, [give it a star](https://github.com/vuluu2k/webcake-storefront-mcp) — every star keeps a solo project alive.
*"Build a page for my coffee shop — a hero with a Shop Now button, a product grid, and an order form. Save it and publish."*
…and a real, editable page appears on your WebCake/StoreCake site. No dragging blocks, no learning the schema, no hand-writing JSON.
🧩 How it works
This server is the bridge between your AI assistant and your storefront. The AI never *guesses* what a page looks like — it asks this MCP, which knows the entire BuilderX component model, validates the result, and saves it.
You AI assistant webcake-storefront MCP WebCake / StoreCake
┌──────┐ prompt ┌────────────┐ tools ┌───────────────────────┐ API ┌──────────┐ │ idea │ ───────► │ Claude / │ ─────► │ • knows the BuilderX │ ───► │ a real │ │ │ │ Cursor / │ │ component model │ │ editable │ │ │ ◄─────── │ Windsurf │ ◄───── │ • builds + validates │ ◄─── │ page on │ └──────┘ live URL └────────────┘ result │ • saves + publishes │ │ your site│ └───────────────────────┘ └──────────┘
- You ask in plain language — goal, brand, sections, products, form fields.
- The AI learns the model from the MCP: the element catalog, the CSS-grid layout, the breakpoints — so it builds a *real* storefront page, not a guess.
- It assembles + validates the
{ sections: [...] }page source.validate_pagecatches duplicate ids, broken grids, and form fields without a name before anything is saved. - It saves to your site — dry-run preview first, then for real — and
publish_sitemakes it live. - You get the preview URL — open it, tweak in the editor, done.
Why it's reliable
| 📚 Knows the real model | Serves 130+ BuilderX component types (text, image, button, form, product grid, cart, countdown, gallery…) ported straight from the builder's own factory — the exact same shapes the editor produces. |
| ✅ Validates before saving | Structural checks (unique ids, valid grid, form fields with names, working event targets) so the page isn't broken when it lands. |
| 🛡️ Safe by default | Every write is dry-run first — preview the change, nothing touches your site until you confirm. |
| ✏️ Edits surgically | Ask for one change ("make the CTA green") and it edits *only* that element — every other id, style, and block stays exactly as it was. |
💡 Selling COD or online? It speaks the full commerce model too — products, variations, cart, orders, promotions, combos.
✨ What you can build
One sentence to your AI → a finished, editable storefront page:
| Just say… | |
|---|---|
| 🛒 Product page | *"A one-product page for my skincare serum — gallery, price, an order form with cart."* |
| 🏬 Storefront home | *"A homepage — hero banner, featured product grid, a newsletter form."* |
| ⚡ Flash sale | *"A flash-sale page — big countdown, discounted product grid, a sticky Buy button."* |
| 🎟️ Event / webinar | *"A registration page — countdown, agenda, a sign-up form."* |
| 💌 Invitation | *"A wedding invite — names, date, a map, an RSVP form."* |
| 📰 Blog / content | *"A blog index with featured posts and a subscribe box."* |
| 🔗 Link-in-bio | *"A link-in-bio — avatar, short bio, 5 link buttons, socials."* |
…then "make the CTA green" or "add a 4th feature" and it edits *only* that block.
🤖 Works in Claude Desktop, Claude Code, Cursor, Windsurf, VS Code, or any MCP-capable client — and the build guide + element catalog tools need zero backend calls, so you can explore the model before pasting a token.
Under the hood
An MCP (Model Context Protocol) server that teaches AI agents the WebCake/StoreCake storefront builder (BuilderX) component model and connects them to the backend. The AI produces the full { sections: [...] } page source; build_page creates the page and saves it, and publish_site makes the whole site live.
Beyond page authoring, it exposes your real store: pages & custom code, products, orders, collections, blog articles, promotions, combos, themes, customers, and automation — ~280 tools in total.
| Method | Best for | Auth |
|---|---|---|
| npx (local) — runs on your machine | Personal daily use, full control | browser login, or a token + session |
| Remote (`serve`) — self-host Streamable-HTTP | Teams, the claude.ai dialog, always-on | ?jwt= link / x-webcake-jwt header |
The build + catalog tools (get_build_guide, list_elements, get_element, new_section, validate_page) work with zero config; everything that reads or writes your site needs a token + session.
🚀 Get connected
Pick one. Both hand your AI tool the full storefront toolkit. No coding.
① npx — runs on your machine (recommended)
Zero install, always the latest version, needs Node.js 18+. One line connects your account and configures your AI apps:
# Opens the browser — click Connect, your installed IDEs are configured (prod)
npx -y webcake-storefront-mcp install
Developers only — step by step: environment, login or token, IDE(s)
npx -y webcake-storefront-mcp install --dev
Scripts and CI — every supported IDE, even ones not installed yet
npx -y webcake-storefront-mcp install --ide all --token --session
Remove the server from every IDE config
npx -y webcake-storefront-mcp uninstall
`install` asks nothing. It connects to production, opens your browser so you can click *Connect*, then adds the server to every AI app it finds on this computer. Your other servers are kept, and any config file it changes is backed up next to the original as .webcake-storefront-backup. No AI app found? It says so and exits with an error: install one and run it again, or name it with --ide.
Need staging or local? --dev opens the step-by-step wizard, or skip it with --env staging / --env local.
Installed with an older version? Run
installagain. Older versions wrote VS Code's config under the wrong key, so the
server never appeared there, and registered Claude Code for the current folder only.
Targets for --ide: claude-desktop, claude-code, cursor, windsurf, vscode, codex, antigravity, gemini, cline, kiro, opencode, or all. Just want to run the server (configure by hand)? npx -y webcake-storefront-mcp.
② Reconnect your account — no token copy/paste
npx -y webcake-storefront-mcp login
install already does this the first time. Use login when your token expires: it opens the builder's connect page, you click *Connect*, and your token + session are saved locally and picked up automatically.
Remote URL — self-hosted, nothing per-client to install
npx -y webcake-storefront-mcp serve --port 8787
Then point any client at http:// :8787/mcp?jwt= (clients that support headers can send x-webcake-jwt instead; pick the site in chat with switch_site). Server-side secrets like PEXELS_API_KEY live on the host — handy on a VPS.
⚠️ A
?jwt=link contains your personal token — treat it like a password and use HTTPS in production.
⚙️ Configuration
Two values are required: `WEBCAKE_TOKEN` (Bearer JWT) and `WEBCAKE_SESSION_ID` (sent as x-session-id). You pick the site at runtime — just ask in chat and the AI calls list_my_sites / switch_site (your choice is saved and reused next session), so no WEBCAKE_SITE_ID is needed.
Base URLs come from a named environment — set WEBCAKE_ENV (or --env) and you never type a URL:
WEBCAKE_ENV | api | app (login) | preview |
|---|---|---|---|
local | http://localhost:24679 | http://localhost:5173 | demo.localhost:24679/ |
staging | https://api.staging.storecake.io | https://staging.webcake.io | staging2.webcake.me/ |
| `prod` (default) | https://api.storefront.webcake.io | https://webcake.io | .webcake.me |
Override a preset with WEBCAKE_API_URL / WEBCAKE_APP_URL. Optional, configured server-side: PEXELS_API_KEY (search_images). Token / session / site can also be set in chat via update_auth and switch_site — saved to a local config file at ~/.webcake-storefront-mcp/.
How to get your token + session
- Open the WebCake builder and log in.
- Open DevTools (
F12) → Network tab → click any API request. - In Request Headers:
Authorization: Bearer …→WEBCAKE_TOKEN;x-session-id: …→WEBCAKE_SESSION_ID. - No site id needed up front — in chat, run
list_my_sitesthenswitch_siteto choose the site (remembered next time).
🧰 The tools at a glance
~280 tools. The headline group builds pages; the rest read and edit your live store.
| Group | Tools | Needs |
|---|---|---|
| Build a page | get_build_guide · list_elements · get_element · new_element · new_section · new_page_skeleton · validate_page · build_page · add_section | catalog tools: nothing |
| Media & ingest | search_images (Pexels) · upload_images (CDN) · ingest_html · ingest_url (recreate a reference page) | — |
| Pages & code | list_pages · get_page_source · search_page_elements · get_page_element · update_page_element(s) · create_page · update_page · update_page_source · custom CSS/JS · page contents · global sections · publish_site | token + session |
| Commerce | products · orders · collections · promotions · combos | token + session |
| Content & store | blog articles · themes / site style · apps · customers · send_mail | token + session |
| Backend code | HTTP-function CRUD (get_http_function, edit_http_function, run_function, debug_function…) | token + session |
| Context | get_current_context · list_my_sites · switch_site · update_auth · toggle_confirm_mode | token |
| Site plans | get_site_subscription (current plan, status, days left) · count_my_sites (by plan / custom domain / trash) · list_plans | token |
Every write defaults to `dry_run=true` — it previews the exact change and only touches your site when you re-run with dry_run=false.
💬 Suggested prompt
Build me a WebCake storefront page for <brand/offer>. Use the webcake-storefront MCP:
call
get_build_guide,list_elements, build the sections withnew_section,
validate_pageuntil zero errors, thenbuild_page(dry-run first) andpublish_site.
⭐ Like the idea? Drop a star
This is a solo, open-source project — every ⭐ genuinely keeps it moving and helps other builders find it.
- ⭐ [Star the repo](https://github.com/vuluu2k/webcake-storefront-mcp) — 2 seconds, huge motivation
Only the beginning is shown; read the rest in the repo