Prototyp · Vorschau: alle Server aus der offiziellen Registry, alle 30 Minuten synchronisiert. Bewertungen und Benutzerkonten folgen in einem späteren Schritt.
PopNx MCPMCP-Server für alle, die KI nutzen · in einfachen Worten erklärt

WebCake Storefront

von vuluu2kVersion 1.38.0i★ –iComputer oder Cloud
Name in der Registryio.github.vuluu2k/webcake-storefront-mcp

Installieren

Überblick

Beschreibung vom Entwickler (englisches Original)

Build pages and manage products, orders, and content on the WebCake/StoreCake storefront builder.

Die drei Säulen von PopNx MCP

Diese drei werden nie zu einer Punktzahl zusammengefasst: Meinungen, Messungen und Beliebtheit sind verschiedene Dinge.

Was du damit machen kannst

Für diesen Server haben wir noch keine Zusammenfassung in einfacher Sprache geschrieben. Unten stehen die Fakten, die wir aus der Registry gelesen haben.

  • Verbindung: Computer oder Cloud
  • Transport: stdio, Streamable HTTP
  • Kategorie: Onlineshops & Zahlungen
  • Das musst du eintragen: WEBCAKE_TOKEN, WEBCAKE_SESSION_ID, PEXELS_API_KEY, x-webcake-jwt, x-webcake-session-id

Installation

Wähle die KI-App, die du nutzt, und kopiere die Einstellungen.

Bevor du installierst

  • Basischecks: 3 von 3 bestanden
  • Läuft auf dem Server des Entwicklers: Was du fragst, läuft über dessen Server.
  • Das trägst du selbst ein: WEBCAKE_TOKEN, WEBCAKE_SESSION_ID, WEBCAKE_ENV, PEXELS_API_KEY, x-webcake-jwt, x-webcake-session-id

Als geheim markierte Werte sind Schlüssel zu deinem Konto. Gib sie nie weiter und füge sie nie in einen Chat ein.

Du brauchst

  • Läuft in der CloudNichts zu installieren; die Verbindung läuft übers Internet
  • npmNode.js installiert (für den Befehl npx)

Welche App nutzt du?

Wähle oben deine App. Wir merken sie uns, damit der Button beim nächsten Mal „In … installieren“ anzeigt.

Diese Adresse braucht einen Schlüssel in einem Header der Anfrage, und das Menü zum Hinzufügen von Connectors kann ihn nicht setzen. Nutze stattdessen Claude Code, Cursor oder VS Code.

Oder führ ihn auf deinem Computer aus

Öffne Claude Desktop → Settings → Developer → Edit Config und füge dies in claude_desktop_config.json ein

{
  "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"
      }
    }
  }
}

Führe das in deinem Terminal aus

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'

Oder führ ihn auf deinem Computer aus

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-mcp

Trag die leeren Werte ein, bevor du ihn startest.

In Cursor öffnen

Oder kopier die Einstellungen selbst

In .cursor/mcp.json in deinem Projekt oder in ~/.cursor/mcp.json einfügen

{
  "mcpServers": {
    "webcake-storefront": {
      "url": "https://store.toolvn.io.vn/mcp",
      "headers": {
        "x-webcake-jwt": "your-value",
        "x-webcake-session-id": "your-value"
      }
    }
  }
}

Oder führ ihn auf deinem Computer aus

In Cursor öffnen

Oder kopier die Einstellungen selbst

In .cursor/mcp.json in deinem Projekt oder in ~/.cursor/mcp.json einfügen

{
  "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"
      }
    }
  }
}

Dein Browser fragt, ob er die App öffnen darf, dann zeigt die App die Einstellungen und bittet dich um Bestätigung. Schlüsselwerte bleiben leer, damit du sie selbst einträgst.

In VS Code öffnen

Oder kopier die Einstellungen selbst

In .vscode/mcp.json in deinem Projekt einfügen

{
  "servers": {
    "webcake-storefront": {
      "type": "http",
      "url": "https://store.toolvn.io.vn/mcp",
      "headers": {
        "x-webcake-jwt": "your-value",
        "x-webcake-session-id": "your-value"
      }
    }
  }
}

Oder führ ihn auf deinem Computer aus

In VS Code öffnen

Oder kopier die Einstellungen selbst

In .vscode/mcp.json in deinem Projekt einfügen

{
  "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"
      }
    }
  }
}

Dein Browser fragt, ob er die App öffnen darf, dann zeigt die App die Einstellungen und bittet dich um Bestätigung. Schlüsselwerte bleiben leer, damit du sie selbst einträgst.

Diese Adresse braucht einen Schlüssel in einem Header der Anfrage, und das Menü zum Hinzufügen von Connectors kann ihn nicht setzen. Nutze stattdessen Claude Code, Cursor oder VS Code.

Deine Auswahl bleibt in einem Cookie auf diesem Gerät; kein Konto nötig.

Werte, die du selbst einträgst

  • WEBCAKE_TOKEN geheim env
    Storefront JWT Bearer token (the builder's `jwt` cookie / store_jwt).
  • WEBCAKE_SESSION_ID geheim env
    Session id sent as the x-session-id header (the builder's `wsid` cookie).
  • WEBCAKE_ENV env
    Named environment preset that fills the API + app base URLs (default prod).
  • PEXELS_API_KEY geheim env
    Optional Pexels API key for the search_images tool.
  • x-webcake-jwt geheim HTTP header
    Storefront Bearer JWT (or authenticate via the OAuth flow / ?jwt= link).
  • x-webcake-session-id geheim HTTP header
    Session id (the builder's wsid).

Diese Einstellungen werden aus dem Registry-Eintrag des Entwicklers erzeugt. Wenn in der README etwas anderes steht, folge der README.

Was er kann

Der Server verlangt eine Anmeldung, bevor er seine Tools auflistet.

Basischecksi

Wir prüfen Informationen, die jeder sehen kann; den Code haben wir nicht gelesen. Checks, die nicht zutreffen, werden nicht mitgezählt. · Geprüft am 7. Nov. 2026

  • ✓ Bestanden

    Entwickler passt zum Repo

    Der Registry-Name wurde mit dem GitHub-Konto vuluu2k bestätigt, dem das Repo gehört

  • … Noch nicht geprüft

    Wird noch gepflegt

    Dieses Repo haben wir noch nicht von GitHub gelesen

  • … Noch nicht geprüft

    Hat eine Lizenz

    Dieses Repo haben wir noch nicht von GitHub gelesen

  • ✓ Bestanden

    Endpunkt antwortet

    Antwort in 1827 ms (HTTP 401)

  • ✓ Bestanden

    Anmeldung mit OAuth

    Gibt OAuth-Anmeldung an, damit deine KI-App dich zum Einloggen weiterleiten kann

  • … Noch nicht geprüft

    Keine versteckten Anweisungen in Tool-Beschreibungen

    Noch nicht geprüft; wir lesen die Tool-Liste, wenn wir den Endpunkt prüfen

Im Vergleich mit anderen in Onlineshops & Zahlungeni

  • Mehr Sterne als 0 % der anderen 1751 Server in dieser Kategorie
  • Neuer in der Registry veröffentlicht als 89 % der anderen 1751 Server in dieser Kategorie
  • Basischecks gleich gut wie oder besser als bei 100 % der anderen 1751 Server in dieser Kategorie

Verglichen mit allen aktiven Servern dieser Kategorie in der Registry. Sterne zählen nur, wenn dem Herausgeber das Repo gehört.

Häufige Fragen

Ist WebCake Storefront sicher?

Er hat 3 von 3 zutreffenden Basischecks bestanden. Den Code haben wir nicht gelesen. Bevor du einen Schlüssel oder Token hinzufügst, sieh nach, welche Zugriffe der Server verlangt, und nutze einen Schlüssel, der nur die Berechtigungen hat, die du brauchst.

Welche Schlüssel oder Codes braucht er?

Das musst du eintragen: WEBCAKE_TOKEN, WEBCAKE_SESSION_ID, PEXELS_API_KEY, x-webcake-jwt, x-webcake-session-id

Läuft er auf meinem Computer oder in der Cloud?

Beides geht: Installiere ihn auf deinem Computer oder verbinde dich mit der Cloud-Version.

Wird er noch gepflegt?

Das GitHub-Repo wurde zuletzt – geändert, und die neueste Version (1.38.0) kam vorgestern in die Registry.

Welche Apps können ihn nutzen?

Apps, die MCP unterstützen, etwa Claude Desktop, Claude Code, Cursor und VS Code. Er verbindet sich per URL, also funktionieren auch Apps, die Remote-MCP-Server akzeptieren, zum Beispiel ChatGPT im Entwicklermodus.

Was kann ich stattdessen nutzen?

In derselben Kategorie: Spree Commerce: open-source B2B and marketplace ecommerce, Stripe MCP, MCP Cn Commerce

Alternativen

Server derselben Kategorie von anderen Entwicklern, sortiert nach Sternen.

So liest du eine Karte:★ GitHub-SterneiDrei Säulen: Bewertungen · Checks · NutzungiAktualisiert = neueste Version in der Registry veröffentlichti

Stripe MCP

von stripe

MCP server integrating with Stripe - tools for customers, products, payments, and more.

Läuft in der Cloud★ 2.043MITAktualisiert vor 12 Monaten
Installieren

MCP Cn Commerce

von TonyWang-hub

8 read-only MCP platform entries; support is operation-specific; merchant live acceptance pending

Läuft auf deinem Computer★ 96MITAktualisiert vor 28 Tagen
Installieren

README vom Entwickler

README öffnen

Unverändert aus dem Repo des Entwicklers übernommen. PopNx MCP hat den Inhalt weder geprüft noch empfiehlt es ihn. HTML, Bilder und Skripte wurden entfernt. Links führen von dieser Website weg.

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│ └───────────────────────┘ └──────────┘

  1. You ask in plain language — goal, brand, sections, products, form fields.
  2. 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.
  3. It assembles + validates the { sections: [...] } page source. validate_page catches duplicate ids, broken grids, and form fields without a name before anything is saved.
  4. It saves to your site — dry-run preview first, then for real — and publish_site makes it live.
  5. You get the preview URL — open it, tweak in the editor, done.
Why it's reliable
📚 Knows the real modelServes 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 savingStructural checks (unique ids, valid grid, form fields with names, working event targets) so the page isn't broken when it lands.
🛡️ Safe by defaultEvery write is dry-run first — preview the change, nothing touches your site until you confirm.
✏️ Edits surgicallyAsk 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.

MethodBest forAuth
npx (local) — runs on your machinePersonal daily use, full controlbrowser login, or a token + session
Remote (`serve`) — self-host Streamable-HTTPTeams, 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 install again. 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_ENVapiapp (login)preview
localhttp://localhost:24679http://localhost:5173demo.localhost:24679/
staginghttps://api.staging.storecake.iohttps://staging.webcake.iostaging2.webcake.me/
`prod` (default)https://api.storefront.webcake.iohttps://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

  1. Open the WebCake builder and log in.
  2. Open DevTools (F12) → Network tab → click any API request.
  3. In Request Headers: Authorization: Bearer … → WEBCAKE_TOKEN; x-session-id: … → WEBCAKE_SESSION_ID.
  4. No site id needed up front — in chat, run list_my_sites then switch_site to 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.

GroupToolsNeeds
Build a pageget_build_guide · list_elements · get_element · new_element · new_section · new_page_skeleton · validate_page · build_page · add_sectioncatalog tools: nothing
Media & ingestsearch_images (Pexels) · upload_images (CDN) · ingest_html · ingest_url (recreate a reference page)—
Pages & codelist_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_sitetoken + session
Commerceproducts · orders · collections · promotions · combostoken + session
Content & storeblog articles · themes / site style · apps · customers · send_mailtoken + session
Backend codeHTTP-function CRUD (get_http_function, edit_http_function, run_function, debug_function…)token + session
Contextget_current_context · list_my_sites · switch_site · update_auth · toggle_confirm_modetoken
Site plansget_site_subscription (current plan, status, days left) · count_my_sites (by plan / custom domain / trash) · list_planstoken

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 with new_section,

validate_page until zero errors, then build_page (dry-run first) and publish_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

Nur der Anfang wird gezeigt; den Rest findest du im Repo

PopNx fragen