@adammatthiesen/astro-commercejs NPM

`Astro-CommerceJS`

This is an Astro integration that brings the CommerceJS SDK into Astro snap in package.

Installation

Install the integration automatically using the Astro CLI:

pnpm astro add @adammatthiesen/astro-commercejs

npm astro add @adammatthiesen/astro-commercejs

yarn astro add @adammatthiesen/astro-commercejs

Or install it manually:

Install the required dependencies

pnpm add @adammatthiesen/astro-commercejs

npm install @adammatthiesen/astro-commercejs

yarn add @adammatthiesen/astro-commercejs

Add the integration to your astro config

+import astroCommerceJS from "@adammatthiesen/astro-commercejs";

export default defineConfig({
  integrations: [
+    astroCommerceJS(),
  ],
});

Basic Usage

This will present you will the json output of Merchant, Categories, and Products, and should act as a starting point for integrating this project with the CommerceJS SDK

---
import { AstroCommerceJS } from "@adammatthiesen/astro-commercejs";
const commercejs = await AstroCommerceJS();
const { merchant, categories, products } = commercejs
---
<div>
    <h1>This is a API Test Below is the JSON output from the API</h1>
    <h2>Merchants</h2>
    <pre>{JSON.stringify(merchant, null, 2)}</pre>
    <h2>Categories</h2>
    <pre>{JSON.stringify(categories, null, 2)}</pre>
    <h2>Products</h2>
    <pre>{JSON.stringify(products, null, 2)}</pre>
</div>

Full SDK Access

This will present you with a interface to the full js SDK provided by Commerce.js, All you will need to make sure is your env variables are set then youll be able to follow along with any of the tutorials to link it in! just pointing to this commerce client instead of creating a client yourself with the normal lib.

---
import { commerce } from "@adammatthiesen/astro-commercejs";
const merchantAbout = await commerce.merchants.about();

export async function getFullCatalog() {
    const { data: categories } = await commerce.categories.list();
    const { data: products } = await commerce.products.list();

    return { categories, products};
}

const { categories, products } = await getFullCatalog()
---
<h1>{merchantAbout.business_name}</h1>

<div>
    <h1>This is a API Test Below is the JSON output from the API</h1>
    <h2>Categories</h2>
    <pre>{JSON.stringify(categories, null, 2)}</pre>
    <h2>Products</h2>
    <pre>{JSON.stringify(products, null, 2)}</pre>
</div>