Catalyst by BigCommerce

⚠️ IMPORTANT: As of January 6, 2025, the main branch is frozen. The default branch is now canary. Please make sure to work with and submit PRs to the canary branch.

<a href="https://catalyst.dev" target="_blank" rel="noopener norerrer"> <img src="https://storage.googleapis.com/bigcommerce-developers/images/catalyst_readme_banner.png" alt="Catalyst for Composable Commerce Image Banner" title="Catalyst"> </a> <br /> <br /> <div align="center">

</div>

Catalyst is the composable, fully customizable headless commerce framework for BigCommerce. Catalyst is built with Next.js, uses our React storefront components, and is backed by the GraphQL Storefront API.

By choosing Catalyst, you'll have a fully-functional storefront within a few seconds, and spend zero time on wiring up APIs or building SEO, Accessibility, and Performance-optimized ecommerce components you've probably written many times before. You can instead go straight to work building your brand and making this your own.

<p align="center"> <a href="https://www.catalyst.dev">🚀 catalyst.dev</a> • <a href="https://developer.bigcommerce.com/community">🤗 BigCommerce Developer Community</a> • <a href="https://github.com/bigcommerce/catalyst/discussions">💬 GitHub Discussions</a> • <a href="/docs">💡 Docs in this repo</a> </p>

Deploy on Vercel

The easiest way to deploy your Catalyst Storefront is to use the Vercel Platform from the creators of Next.js.

Check out the Next.js deployment documentation for more details.

<div align="left"> <a href="https://vercel.com/new/clone?repository-url=https://github.com/bigcommerce/catalyst&root-directory=core&project-name=my-catalyst-storefront&repository-name=my-catalyst-storefront&integration-ids=oac_nsrwzogJLEFglVwt2060kB0y&external-id=catalyst&demo-title=BigCommerce+Catalyst+with+Vercel&demo-description=Create+a+BigCommerce+Catalyst+Storefront+and+Deploy+to+Vercel&demo-url=catalyst-demo.site&demo-image=https://storage.googleapis.com/s.mkswft.com/RmlsZTozODgzZmY3Yy1hNmVlLTQ1MGUtYjRkMS1mMjEyNzgxNjk5MTY%3D/Social-image-Catalyst.png"><img src="https://vercel.com/button" alt="Deploy with Vercel"/></a> </div>

Quickstart

Create a new project interactively by running:

npm create @bigcommerce/catalyst@latest

You'll then get the following prompts:

? What would you like to call your project?  my-faster-storefront
? Which would you like?
❯ Link Catalyst to a BigCommerce Store
  Use sample data

? Would you like to create a new channel? y

? What would you like to name the new channel? My Faster Storefront

Success! Created 'my-faster-storefront' at '/Users/first.last/Documents/GitHub/my-faster-storefront'

Next steps:

cd my-faster-storefront && npm run dev

Learn more about Catalyst at catalyst.dev.

Resources

• Catalyst Documentation
• GraphQL Storefront API Playground
• GraphQL Storefront API Explorer
• BigCommerce DevDocs

[!IMPORTANT] If you just want to build a storefront, start with the CLI which will install the Next.js application in /core. If you wish to contribute back to Catalyst or create a fork of Catalyst, you can check the docs for this monorepo to get started.