Skip to content

Latest commit

 

History

History
85 lines (51 loc) · 3.63 KB

04.md

File metadata and controls

85 lines (51 loc) · 3.63 KB
Raw

Installing and Configuring Demo Stores

Now that you have a Commerce Layer account, organization, market, and relevant commerce resources. Let's delve into building the ecommerce solution.

The Demo Store project consists of two repositories that you can leverage to build your store:

  1. demo-store-core

This repository contains the source code of the Demo Stores project. If you need to fully customize your store (behavior, UI, UX, etc.), you just have to fork this repo and create your own.

⚠️ Please note that if you follow this path and start diverging too much from the original source code, the risk is to lose all future updates or not be able to replicate them.

  1. demo-store

This is a GitHub template that uses the demo-store-core as a git submodule. If you're happy with the features and the look and feel of the Commerce Layer Demo Store we suggest you follow this path. You won't have to care about the whole source code, and you'll be free to focus just on your data and content. You can also get free updates by running the command:

git submodule update --remote
npm install

Installing the Demo Store

  1. Click on the "Use this template" from the demo-store's homepage on GitHub and then run the following commands:
git clone <your-repository-url> my-new-demo-store
cd my-new-demo-store
git submodule update --init
npm install

cp ./demo-store-core/packages/website/.env.sample.submodule .env.local

cp -r ./demo-store-core/packages/website/data/json ./data/json

cp -r ./demo-store-core/packages/website/locales ./data/locales

cp -r ./demo-store-core/packages/website/config ./config
  1. Add your credentials to the .env.local file like so:
NEXT_PUBLIC_CL_CLIENT_ID=<YOUR SALES CHANNEL CLIENT ID>

NEXT_PUBLIC_CL_ENDPOINT=<YOUR SALES CHANNEL ENDPOINT>
  1. Run the command below to populate your organization with all the resources you need to build a multi-market ecommerce store (a set of product SKUs, related price lists, related prices, stock locations, and inventory).
npm run seeder:seed -ws --if-present

  1. Choose the countries where you're going to sell in. The data/json/countries.json file contains a list of available countries for your ecommerce store. Replace all findings of "market": xxx with the related markets of your organization.

  2. Start the development server on port 3000 like so:

npm run dev

Customizing the Store

When you're using our Demo Store template, you can customize three main elements: content data, locales, and configuration files.

The Demo Store project is built around a set of data that are stored as JSON files, in order to decouple it from any third-party services. To customize your store you'll have to create and manage these files.

  1. The content JSON files are located in the data/json/ directory, but you can choose a different path by changing the value of the NEXT_PUBLIC_JSON_DATA_FOLDER variable in your env file.

  2. The locale JSON files are located in the data/locales/ directory, but you can choose a different path by changing the value of the NEXT_PUBLIC_LOCALES_DATA_FOLDER variable in your env file.

  3. The configuration files are located at config/ directory, but you can choose a different path by changing the value of the NEXT_PUBLIC_CONFIG_DATA_FOLDER variable in your env file.

Checking Changes

When you are done with all the changes, you can check if everything is correct by running the command:

npm run test:data

<< previous lesson | next lesson >>