> This page is for Developer.

> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://docs.bigcommerce.com/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://docs.bigcommerce.com/_mcp/server.

# One-Click Catalyst

> Create a Catalyst storefront from the BigCommerce control panel, with a hosted preview deployment and connected Makeswift sites, then optionally run it locally and push it to your own Git repository.

One-Click Catalyst creates a Catalyst storefront from the BigCommerce control panel. It also deploys a hosted preview and provisions a corresponding site in [Makeswift](https://makeswift.com/), BigCommerce's visual editor.

This code-free starting point lets marketers and content authors explore Catalyst and Makeswift without a developer. You can:

* Customize site theme and design
* Create and edit layouts
* Create and edit pages
* Incorporate BigCommerce product data

> **Warning**
>
> The automatically deployed storefront is only for previewing. To take your storefront to production, see [Deploying a Catalyst storefront](/developer/docs/storefront/catalyst/deployment/overview).

## Prerequisites

Make sure you've met the [prerequisites](/developer/docs/storefront/catalyst/getting-started/prerequisites), including the required control panel permissions, before you continue.

## Create a Catalyst storefront

![Options for creating a new storefront in BigCommerce](/_fern-img/b70c753d9bacf2d43d1db796d969f20f21fd4cf9709bb986fc87acf96ab24a94.webp)

Start by logging into the BigCommerce control panel. Then, navigate to the **Channels** section, click **Create Channel**, and select **Catalyst** as the channel type.

Fill in some information about your storefront. Give it a name, then choose whether to use sample data; we recommend using sample data to start. Finally, choose your primary language and any additional languages you plan to support.

![Settings for deploying a new Catalyst storefront](/_fern-img/c0ddcea0273894ee5e22bb57180c03290ea8a711709f954b504a0be9b71cb528.webp)

After you've filled in the necessary information, click **Create** to deploy the storefront. This process takes a few minutes.

Git tags determine which version of Catalyst the preview deploys. See [How we use tags](/developer/docs/storefront/catalyst/getting-started/versioning#how-we-use-tags) for details.

## View your deployed storefront

![Details for a deployed Catalyst storefront](/_fern-img/721b41fea89e07d46ec5bc9c5df24a7ced1e510ef1bd1cc8403caf00cd7ec485.webp)

Once the storefront is deployed, click **View storefront** to visit it.

## Makeswift integration

Makeswift is a visual page builder for designing pages, layouts, and components without code. One-Click Catalyst always provisions a Makeswift-connected project. See [Editing and Syncing Content](/developer/docs/storefront/catalyst/makeswift/editing-and-syncing-content) for how to edit your storefront in Makeswift and sync your product catalog to it, and [Makeswift](/developer/docs/storefront/catalyst/makeswift/overview) for the full Makeswift section.

After One-Click Catalyst setup, you have:

* An instance of Catalyst deployed to the BigCommerce partner sandbox account
* Two Makeswift sites
  * Production site - connected to the deployed Catalyst instance
  * Development site - connected to `http://localhost:3000`

## Run locally

Running your project locally is optional, but it gives you full control over your storefront's code. With the source on your machine, you can:

* [Create custom components](/developer/docs/storefront/catalyst/makeswift/custom-components)
* Customize existing components
* Customize caching, routing, and more
* Integrate with other services, like [Algolia](/developer/docs/storefront/catalyst/guides/algolia-search) or [Contentful](https://www.contentful.com/)

### Start the project on your machine

In the BigCommerce control panel dashboard for your Catalyst channel, the **Complete Setup** section lists a few steps. The **Start development** step includes a terminal command to run in your local environment.

![Catalyst storefront dashboard showing a complete setup section that includes a terminal command.](/_fern-img/8ccf896fad3ea243581248dc117e3729db55d315e035591b322e6ee911d121e6.webp)

This command runs `pnpm create @bigcommerce/catalyst` (the same CLI command used in [CLI Installation](/developer/docs/storefront/catalyst/getting-started/cli-installation)), pre-populated with flags for your channel's connection details, your Makeswift site keys, and the same Git ref deployed to your preview. It does the following:

* Scaffolds your Catalyst project locally from that ref
* Writes the resulting environment variables to `.env.local`
* Initializes a local Git repository

> **Info**
>
> The `MAKESWIFT_SITE_API_KEY` environment variable is the API key for your development Makeswift site.

After the command finishes, start the development server from your new project directory:

```shell showLineNumbers={false}
pnpm run dev
```

By default, Catalyst runs at `http://localhost:3000`, which is also the URL your development Makeswift site is connected to. Open the development site in Makeswift to edit your locally running storefront.

> **Warning**
>
> If your local project runs on a port other than `3000`, update the **Host URL** property of your development site in Makeswift to match.

As you make changes in the code, they're reflected in real time. Some changes may require a page refresh.

You can also connect to your One-Click channel from the CLI instead of the dashboard command: follow CLI Installation, and choose **No** when it asks whether to create a new channel. The CLI scaffolds a project without Makeswift unless you pass `--gh-ref @bigcommerce/catalyst-makeswift@latest`, and it doesn't set your Makeswift site key.

### Push to a remote repository

The dashboard command initializes a local Git repository, so you only need to connect it to a remote. These steps use GitHub, but any Git provider works.

1. [Create a new repository on GitHub](https://github.com/new). Don't initialize it with a README, license, or `.gitignore`, since your project already has a commit history.
2. From your project directory, add the repository as a remote and push:

   ```shell showLineNumbers={false}
   git remote add origin git@github.com:<YOUR_GITHUB_USERNAME>/<YOUR_REPOSITORY_NAME>.git
   git push -u origin HEAD
   ```

   `HEAD` pushes whichever branch you're on, so this works whether Git named your initial branch `main` or `master`.

## Next steps

* **[Deploy to production](/developer/docs/storefront/catalyst/deployment/overview)** with Native Hosting or another hosting provider.
* To create a Catalyst channel with the REST Management API instead of the control panel, see [Manually create a Catalyst channel](/developer/docs/storefront/catalyst/guides/manually-create-catalyst-channel).