Getting Started

Getting Started

This page gets the playground running locally and shows how to build it. You only need Node.js; no Selldone account is required to try the default demo shop.

Prerequisites

• Node.js and npm (Vite 5 requires a current Node.js LTS version).
• Optional: VS Code with the recommended Vue - Official (Volar) extension (.vscode/extensions.json recommends Vue.volar).

1. Install

git clone https://github.com/selldone/storefront-playground.git
cd storefront-playground
npm install

This installs vue, @selldone/sdk-storefront (which brings in @selldone/core-js) and the dev tools vite, @vitejs/plugin-vue, typescript and vue-tsc.

2. Run the dev server

npm run dev

Open the local URL that Vite prints. You should see Selldone Storefront - SDK and a Fetch Products section. Click Fetch Products Now — the page shows the total number of products, the first products (icon, title, price) and the shop's categories.

The browser console also shows the Storefront SDK banner and the raw response (products, total, folders, parent).

3. Use your own shop

Edit index.html and change the shop name:

<!-- 🏬 Specify the shop's name -->
<meta name="shop-name" content="your-shop-name">

Use the shop username from your Selldone shop URL (for example toysworld in https://selldone.com/@toysworld). Restart or reload the dev server. See Shop Configuration for all other tags.

4. Build and preview

npm run build     # vue-tsc type-check, then vite build into dist/
npm run preview   # serve dist/ locally

Scripts

Script	Command	Purpose
dev	vite	Development server with hot module replacement.
build	vue-tsc && vite build	Type-check, then build to dist/.
preview	vite preview	Preview the production build.

Next steps

• Shop Configuration
• Fetching Products
• Storefront SDK wiki
• FAQ