Custom Products Catalog

Wix CLI

Custom Products Catalog

Wix CLI
This template is built with:
This Wix CLI template demonstrates the use of the Wix Stores API to add or remove products. It is an excellent starting point if you plan on using Wix APIs to manage a site’s business data. Equipped with the Dashboard SDK, you can apply any of the methods found across our Wix APIs and easily manage them in a Dashboard page pre-built following the Wix Design System.

Quick Start

Follow these instructions to quickly create and test an app based on this template.

Prerequisites

Before getting started, make sure you have the following set up:

Step 1 | Create a new app project with the Custom Products Catalog template

Run the following command to create a new app project using this template:

npm create @wix/app@latest -- --template 24493a0d-18f2-4f68-b6d5-55992cef7daa

In the creation process, you will be asked for:

  • A Wix app name. This is the name that appears for your app in the Wix Dev Center.
  • A test site to install your app on. You can select an existing site or create a new development site.
  • A package name. This is the name of the package created locally for your project, and the name of the directory containing your project’s local files.

This creates an app for you in the Wix Dev Center with the required permissions pre-configured.

Step 2 | Test the app

The app creation process installs the app on your chosen development site. However, there is still some configuration required before your app will function.

Install the Wix Stores App

This app makes calls to the Wix Stores Products API to create and manage the store products. Before you can test this app on your development site, you must first install the Wix Stores app.

Set up a local development environment

You won’t see the app extensions on your development site until you build the app and create a version. To test the app during development, set up a local development environment using the following command.

npm run dev

This will prompt you with a CLI menu. Type 1 to open a browser window with a preview of the app's dashboard page.

The development environment is set up for hot reloading, so any changes you make to your code will be reflected in the browser.


How we built this template

Read how this template was built, step by step.

Related templates

Wix CLI

Mixpanel Analytics

Build data-driven apps using an Embedded Script and dashboard page.
Embedded Script APIDashboard SDKWix Design System
Wix CLI

Site Popup

Design interactive popups via a dashboard page.
Embedded Script APIDashboard SDKWix Design System