framework_note/note/wix/Coding in Wix.md

category, technologies, supported_languages, ide_integrations, backend_features

category	technologies	supported_languages	ide_integrations	backend_features
Development	Velo (JavaScript) Wix Studio Wix Blocks Wix Headless (SDK) Wix CLI	JavaScript (ES2024+) TypeScript (Headless/Local) CSS (Wix Studio)	Wix IDE (Browser-based VS Code) Desktop VS Code (via GitHub/Wix CLI) Cursor / AI Editors (via Wix Skills)	.jsw Web Modules HTTP Functions Job Scheduler Data Hooks

Coding in Wix (2026 Guide)

Wix provides a tiered development experience ranging from low-code visual scripting to full-stack headless applications.

🛠️ Development Environments

1. Wix Studio (The Standard)

The flagship environment for professional designers and developers.

• Dev Mode: Enables the built-in IDE and Velo engine.
• GitHub Sync: Best-practice workflow. Sync your site to a repo to use Local VS Code.
• Wix IDE: A full VS Code experience running in your browser, no setup required.

2. Wix Blocks

A dedicated builder for creating reusable widgets and apps.

• Define properties, methods, and events for your components.
• Install your "blocks" across multiple sites or the Wix App Market.

3. Wix Headless

For total control over the frontend (React, Next.js, Astro, etc.).

• Wix SDK: High-level JS/TS library to access Wix business logic (Auth, Cart, CMS).
• CLI-First: Use npm create @wix/new to scaffold projects.

💻 Technical Capabilities

Full-Stack JavaScript (Velo)

• Frontend: Manipulate UI elements using the $w API (e.g., $w('#button').onClick(...)).
• Backend: Write server-side code in .js or .jsw files.
• Secrets Manager: Securely store API keys and credentials.
• npm Integration: Install any public npm package for use in your backend logic.

Data & Automation

• CMS / Data Collections: Query and modify structured data using wix-data.
• Hooks: Run code automatically before/after database operations.
• HTTP Functions: Create your own REST API endpoints on Wix (site.com/_functions/myApi).
• Scheduled Jobs: Run background tasks at specific intervals.

🤖 AI-Assisted Coding (2026)

• Wix Aria: AI agent that can write component logic and troubleshoot errors within the IDE.
• Wix Skills: Context-aware instructions you can feed into AI editors like Cursor to make them experts in your specific Wix project.
• MCP Server Support: Allows AI tools to directly interface with your Wix site's data schema and backend functions.

🚀 Getting Started locally

1. Install the CLI: npm install -g @wix/cli
2. Login: wix login
3. Pull Project: wix pull (Requires GitHub integration enabled in Wix Studio)