Back to arkyStore.io

Quick Start

Get up and running with the Arky storefront store

Get up and running with Arky in 5 minutes. For storefronts, start with the SDK storefront store: it wraps the low-level SDK, manages session context, hydrates the backend cart, and exposes reactive state.

Installation

npm install arky-sdk

Create The Store

import { createArkyStore } from 'arky-sdk/storefront-store';

export const arkyStore = createArkyStore({
  baseUrl: 'https://api.arky.io',
  storeId: 'your-store-id',
  locale: 'en',
  market: 'us',
  marketForLocale: (locale) => (locale === 'it' ? 'ita' : 'us'),
});

Initialize A Page

const { session, cart } = await arkyStore.setup({
  locale: 'en',
  hydrateCart: true,
  track: {
    type: 'page_view',
    payload: { path: location.pathname },
  },
});

const websiteNode = await arkyStore.cms.node.get({
  key: 'website',
  locale: 'en',
});

setup is the normal storefront entrypoint. It can identify the profile, load the current cart, and track activity in one call. CMS content is loaded through the generic node API.

Fetch Products

const { items: products } = await arkyStore.eshop.product.list({
  limit: 20,
});

const product = products[0];
const variant = product.variants[0];

await arkyStore.eshop.cart.addProduct(product, variant, 1);

React To Cart State

const unsubscribe = arkyStore.eshop.cart.snapshot.subscribe((snapshot) => {
  console.log(snapshot.item_count);
  console.log(snapshot.product_items);
});

await arkyStore.eshop.cart.quote();

unsubscribe();

Fetch CMS Content

const website = await arkyStore.cms.node.get({ key: "website", locale: 'en' });
const hero = website.blocks.find((block) => block.key === 'hero');
const title = arkyStore.utils.getBlockTextValue(hero, 'en');

Fetch Services

const { items: services } = await arkyStore.eshop.service.list({
  limit: 50,
});

await arkyStore.eshop.service.initialize();
await arkyStore.eshop.service.select(services[0]);
await arkyStore.eshop.service.findFirstAvailable();
Note

The lower-level client is still available as arkyStore.client, but storefronts should usually use the store modules: cms, eshop, crm, activity, automation, store, and utils.

Next Steps