Wix Studio is being released gradually to ensure a smooth onboarding experience. If you’re an agency or freelancer already using Wix or Editor X, you’ll receive an email once you have access.

When you code with Wix Studio, you are working in an open development platform that accelerates the way you build web applications. You use APIs to add custom functionality and interactions.

You can code directly in Wix Studio's built-in Code panel, in a VS Code-based IDE, or with your own IDE and integrating with GitHub.

Regardless of how you choose to code, you can enjoy serverless coding, all in an open, extendable platform.

This section highlights key features and functionality for coding with Wix Studio's open platform.

• Coding on our open platform. First, familiarize yourself with our platform.

• Different environments for coding. Wix studio offers different options for coding. You decide which option works based on what you need to do.

• CSS styling. Add and customize styling for the site using CSS that was developed outside of the Wix Studio ecosystem.

• AI assistance. The Wix AI Assistant helps you use artificial intelligence to get your code up and running quickly and efficiently. The assistant can help write, and even fix, your code. Receive responses in real time, including code snippets, to help you with your coding tasks.

• Custom extensions (SPIs). You can integrate with service providers to further expand your site's functionality by replacing and extending existing app flows and/or by integrating external services with your site using custom extensions.

• Headless sites and projects. Design an independent site or project that takes advantage of Wix Studio's powerful infrastructure, tools, and capabilities in a headless environment.

• Databases. Connect your site to external database collections in addition to the built-in Wix Content Management System (CMS).

• Packages. This feature lets you choose a package with the functionality you want and add it to your site(s). You can install npm packages, packages built by Wix, and your own.

• Blocks. You can add code to your Wix Blocks widgets and apps. Because of this integration, Blocks apps can be anything from simple widget layouts to full-fledged interactive web components, complete with APIs and code files.

• Developer tools. A set of developer tools is available to help you monitor, test, and debug the code on your site(s).

• Test sites. As you develop your site's functionality, you may want to test a version of your site on a percentage of your visitors.

• And here are some open-platform features for Wix Studio coders:
  • Fetch for calling external APIs.
  • HTTP functions for exposing your site's functionality as an API.
  • Routers for handling incoming requests to your site's pages/sitemap and directing the user to a custom page, according to the logic in the code.

Tip: Already familiar with coding using the classic Wix Editor or Editor X? Ready to switch to coding with Wix Studio?

Review this Coding with Wix Studio (for Wix Studio developers) to transition to Wix Studio's robust development environments.

Wix is committed to making sure you, as a developer, have the right environment, tools, and APIs to develop sites and apps for your customers. We know coding is not a 1-size-fits-all experience. With Wix Studio, you choose how and where to code:

• With the built-in Code panel
• Using the Wix IDE
• In your own local IDE and integrate with GitHub

While previewing and publishing your site is always done in the Wix Studio Editor, you can use each coding option at different times in the development flow. For example, you add properties to elements and add pages to your site using the Code panel but can then switch to the Wix IDE for backend coding.

To develop small projects that focus mainly on custom interactions and CSS styling on the frontend, craft your code using Wix Studio's built-in Code panel.

To start, click the and click Start Coding. The resulting Code panel contains:

• The Code sidebar. What you want to code—page code, global page code, CSS styling, and more.

• The Code panel. How you code. The Code panel provides you with:

  • The Code sidebar for navigation between Wix Studio coding features.
  • The Code editor for writing and editing your code.
  • The Properties & Events panel for naming elements, setting properties, and defining event handlers.
  • The CSS Classes panel for CSS styling on a specific element.
    
    

For larger, multi-developer projects that involve more complex frontend code and/or backend code, use the online Wix IDE. The Wix IDE is a VS Code-based IDE that allows you to edit your site's code in your browser—no downloading or configuration necessary. Use familiar VS Code features to get up and running quickly.
Click Code in Wix IDE from the Code panel to start coding.

Use the Git Integration and Wix CLI set of power tools to write, test, and publish code for your Wix site locally on your computer.
To set this up, connect your site to GitHub, develop in your favorite IDE, test your code in real time, and publish your site from the command line.

Note: The Wix IDE can't be used together with GitHub Integration. You can, however, connect your site to GitHub to work locally, and then disconnect from GitHub to resume working in the Wix IDE without losing any work.

Use this table to decide which Wix Studio coding option is for you based on the features provided.

	Code panel	Wix IDE	Git integration
CMS interaction
Serverless
Secure
Open platform
NPM Packages
Velo Packages
Frontend code
CSS styling for all site pages
CSS styling for specific elements
Backend code
Concurrent editing
Collaboration (team work)	For >1 designers and 1 developer
Public files
Online access
Offline access
Complex projects or projects that require a lot of code
Autosave by default			User-set
Wix AI Assistant