Back to Browse
β
Free
Server data from the Official MCP Registry
Build pages and manage products, orders, and content on the WebCake/StoreCake storefront builder.
About
Build pages and manage products, orders, and content on the WebCake/StoreCake storefront builder.
Security Report
4.2
Use Caution4.2High RiskThis MCP server for WebCake storefront building has reasonable security posture with proper token-based authentication for sensitive operations and clear separation between unauthenticated catalog tools and authenticated API calls. The codebase follows expected patterns for a developer tool but has minor code quality issues around error handling and input validation that warrant attention. Supply chain analysis found 3 known vulnerabilities in dependencies (0 critical, 3 high severity). Package verification found 1 issue.
3 files analyzed Β· 8 issues found
Security scores are indicators to help you make informed decisions, not guarantees. Always review permissions before connecting any MCP server.
Permissions Required
This plugin requests these system permissions. Most are normal for its category.
What You'll Need
Set these up before or after installing:
Storefront JWT Bearer token (the builder's `jwt` cookie / store_jwt).Required
Environment variable: WEBCAKE_TOKEN
Session id sent as the x-session-id header (the builder's `wsid` cookie).Required
Environment variable: WEBCAKE_SESSION_ID
Named environment preset that fills the API + app base URLs (default prod).
Environment variable: WEBCAKE_ENV
Optional Pexels API key for the search_images tool.Required
Environment variable: PEXELS_API_KEY
How to Install
Add this to your MCP configuration file:
{
"mcpServers": {
"io-github-vuluu2k-webcake-storefront-mcp": {
"env": {
"WEBCAKE_ENV": "your-webcake-env-here",
"WEBCAKE_TOKEN": "your-webcake-token-here",
"PEXELS_API_KEY": "your-pexels-api-key-here",
"WEBCAKE_SESSION_ID": "your-webcake-session-id-here"
},
"args": [
"-y",
"webcake-storefront-mcp"
],
"command": "npx"
}
}
}Documentation
View on GitHubFrom the project's GitHub README.
πͺ 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 β 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 β ~101 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 configures your IDE:
# Interactive β pick your IDE(s) and paste your credentials
npx -y webcake-storefront-mcp install
# Non-interactive β configure every supported IDE at once
npx -y webcake-storefront-mcp install --ide all --token <token> --session <session-id>
# Remove the server from every IDE config
npx -y webcake-storefront-mcp uninstall
Targets: claude-desktop, claude-code, cursor, windsurf, vscode, or all.
Just want to run the server (configure by hand)? npx -y webcake-storefront-mcp.
β‘ Browser login β no token copy/paste
npx -y webcake-storefront-mcp login
Opens the builder's connect page; 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://<host>:8787/mcp?jwt=<TOKEN> (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/<siteId> |
staging | https://api.staging.storecake.io | https://staging.webcake.io | staging2.webcake.me/<siteId> |
prod (default) | https://api.storefront.webcake.io | https://webcake.io | <site_slug>.webcake.me |
Override a preset with WEBCAKE_API_URL / WEBCAKE_APP_URL. Optional, configured server-side:
PEXELS_API_KEY (search_images), MONGO_URI (image-alt cache). 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/.
- 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
~101 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_image (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 |
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 β 2 seconds, huge motivation.
- π Open an issue β a bug, a missing component, or just an idea.
- π Share it with anyone still building store pages block by block.
Built with β€οΈ for the WebCake community. Thanks for being here.
Reviews
No reviews yet
Be the first to review this server!
More Developer Tools MCP Servers
Fetch
Freeby Modelcontextprotocol Β· Developer Tools
Web content fetching and conversion for efficient LLM usage
80.0K
Stars
4
Installs
5.3
Security
No ratings yet
Local
Toleno
Freeby Toleno Β· Developer Tools
Toleno Network MCP Server β Manage your Toleno mining account with Claude AI using natural language.
137
Stars
520
Installs
8.0
Security
4.8
Local
mcp-creator-python
Freeby mcp-marketplace Β· Developer Tools
Create, build, and publish Python MCP servers to PyPI β conversationally.
-
Stars
73
Installs
10.0
Security
4.6
Local