From wix-cli
Create backend event extensions that respond to Wix events. Use when implementing handlers that run when specific conditions occur on a site. Triggers include event extension, backend event, webhook handler.
npx claudepluginhub wix-playground/skills-architecture-test --plugin wix-cliThis skill uses the workspace's default tool permissions.
Creates event extensions for Wix CLI applications. Events are triggered when specific conditions occur—on a Wix user's site for app projects, or on your project's site for headless projects. Your project responds using event extensions built on JavaScript SDK webhooks; the CLI subscribes your project to these webhooks.
Builds and reviews Wix CLI app extensions: dashboard pages, modals, plugins, Editor React components, backend APIs, events, service plugins, data collections. Prepares apps for App Market review.
Registers Webflow webhooks, verifies HMAC signatures, and handles events like form submissions, site publishes, ecommerce orders, and CMS changes for event-driven backends.
Searches, retrieves, and installs Agent Skills from prompts.chat registry using MCP tools like search_skills and get_skill. Activates for finding skills, browsing catalogs, or extending Claude.
Share bugs, ideas, or general feedback.
Creates event extensions for Wix CLI applications. Events are triggered when specific conditions occur—on a Wix user's site for app projects, or on your project's site for headless projects. Your project responds using event extensions built on JavaScript SDK webhooks; the CLI subscribes your project to these webhooks.
Common use cases: run logic when a contact is created, an order is placed, a booking is confirmed, or a blog post is published.
Follow these steps in order when creating an event extension.
src/extensions/backend/events/<event-name>/<event-name>.ts with the SDK event import and handler function<event-name>.extension.ts with extensions.event() and a unique UUIDsrc/extensions.ts to import and use the new extensionUser (manual): Configure app permissions for the event in the app dashboard if required; release a version and trigger the event to test.
| Topic | Reference |
|---|---|
| Common events (CRM, eCommerce, Bookings, Blog) | COMMON-EVENTS.md |
Two files per event (docs). Only one handler per event allowed in the app (including dashboard handlers).
src/extensions/backend/events/<event-name>/
├── <event-name>.extension.ts # Builder: extensions.event({ id, source }) – id is unique GUID
└── <event-name>.ts # Handler: imports SDK event (e.g. onContactCreated), runs on trigger
<event-name>.extension.ts)Use extensions.event() from @wix/astro/builders. Required fields: id (unique GUID), source (path to the handler file).
import { extensions } from "@wix/astro/builders";
export const eventContactCreated = extensions.event({
id: "{{GENERATE_UUID}}",
source: "./extensions/backend/events/contact-created/contact-created.ts",
});
CRITICAL: UUID Generation
The id must be a unique, static UUID v4 string. Generate a fresh UUID for each extension—do NOT use randomUUID() or copy UUIDs from examples. Replace {{GENERATE_UUID}} with a freshly generated UUID like "a1b2c3d4-e5f6-7890-abcd-ef1234567890".
<event-name>.ts)Import the event from the correct SDK module and pass a handler. Wix invokes the handler with the event payload and metadata when the event occurs. Handler signatures are documented in the JavaScript SDK reference.
import { onContactCreated } from "@wix/crm/events";
onContactCreated((event) => {
console.log("Contact created:", event.entity);
// Custom logic: sync to CRM, send welcome email, etc.
});
Handler can be async; ensure errors are caught and logged so one failing handler does not break others.
Two steps required.
Create <event-name>.extension.ts inside the event folder (and <event-name>.ts for the handler) as shown in Implementation Pattern above.
CRITICAL: Read wix-cli-extension-registration and add the event extension to src/extensions.ts (import and .use(eventContactCreated) or equivalent). Without this, the event extension is not active.
Naming: export names follow event{CamelCaseName} (e.g. eventContactCreated, eventOrderPaid).
When calling Wix APIs from inside an event handler, use auth.elevate from @wix/essentials so the call runs with the right permissions.
import { auth } from "@wix/essentials";
import { items } from "@wix/data";
onContactCreated(async (event) => {
const elevatedQuery = auth.elevate(items.query);
const result = await elevatedQuery("MyCollection").find();
// Use result
});
console.log for debugging; keep production logs minimal and non-sensitive.