In This Article

About Wix-Managed Headless Projects Started from Your Own Frontend

You can create a Wix-managed headless project from your own existing frontend project. This flow deploys your site, as Wix hosts the frontend, and integrates with Wix business solutions.

This flow only supports single-page app (SPA) projects, such as React, Vue, or vanilla HTML/JS.

Note: This flow always creates a new Wix Headless project. It's not possible to import files into an existing one.

Architecture and benefits

When you create a Wix-managed headless project from your own frontend, you get a full-stack project backed by Wix infrastructure:

Managed hosting with global CDN: Wix builds, deploys, and serves your project on a global content delivery network with automatic SSL certificates. The infrastructure scales automatically to meet traffic demands.
Secrets management: Securely manage your project's environment variables and secrets.
Analytics tracking: Track events like page views, cart actions, and purchases, and forward them to connected analytics platforms such as GA4 and Facebook Pixel.

Wix business solutions

Creating a Wix-managed headless project from your own frontend allows you to access and use Wix business solutions. You can integrate with eCommerce, Bookings, Pricing Plans, Events, and more.

Authentication

Authentication isn't handled automatically when you bring your own frontend. You must manage authentication manually.

To work with Wix APIs in your Headless project, you need to be authorized to call APIs. The authorization strategy you choose depends on what kind of headless project you are developing.

Visitors and Members (OAuth): A project for use by customers, such as anonymous visitors and logged-in members. To get started with this authorization strategy, start by creating an OAuth app.
Admin (API Key): An external project with customized administrative access to your Wix account's sites and projects. To get started with this authorization strategy, start by generating an API key.

In some cases, you may want to use more than 1 authorization strategy or use a number of API keys in the same project.

Note: The authorization strategy serves 2 purposes:

Authorizes your app to call Wix APIs.
Directs your calls to Wix APIs to a site or project.

To learn more about authorization strategies, see Authorization Strategies.

CLI and extensions

You can manage your project using the CLI, including top-level commands like npx wix login and npx wix logout, and project-level commands for previewing and releasing.

Extensions aren't yet available for Headless projects started from your own frontend.

How to start a project from your own frontend

There are different ways to start a project from your own frontend. Regardless of the method you choose, this creates the wix.config.json configuration file to link your frontend code to the new Wix Headless project.