### CLI Project Setup
Source: https://github.com/blazity/commerce-docs/blob/main/setup.mdx
Installs the Enterprise Commerce project using the provided CLI tool. This simplifies the setup by allowing direct input of API keys or enabling a demo mode.
```shell
yarn create commerce
# or
npm create commerce
```
--------------------------------
### Start Local Development Server
Source: https://github.com/blazity/commerce-docs/blob/main/README.md
Starts the Mintlify local development server. This command should be run from the root directory of your documentation project, where the 'mint.json' file is located.
```bash
mintlify dev
```
--------------------------------
### Install Mintlify CLI
Source: https://github.com/blazity/commerce-docs/blob/main/README.md
Installs the Mintlify Command Line Interface globally using npm. This tool is essential for previewing documentation changes locally.
```bash
npm i -g mintlify
```
--------------------------------
### Install CLI
Source: https://github.com/blazity/commerce-docs/blob/main/features/cli.mdx
Global installation of the commerce-cli using npm, pnpm, or yarn.
```bash
# npm
npm install -g commerce-cli
# pnpm
pnpm add -g commerce-cli
# yarn
yarn global add commerce-cli
```
--------------------------------
### Meilisearch Document Template Example
Source: https://github.com/blazity/commerce-docs/blob/main/ai-features/vector-search.mdx
This example shows a document template used for generating AI embeddings in Meilisearch. It specifies which product attributes (title, price, description) should be sent to the AI model.
```text
A product titled '{{doc.title}}' worth '{{doc.minPrice}}' , whose description starts with {{doc.description|truncatewords: 20}}
```
--------------------------------
### Generate Feature Flag Secret
Source: https://github.com/blazity/commerce-docs/blob/main/setup.mdx
Generates a secure, base64url encoded secret for feature flag management using Node.js's crypto module. This secret should be added to your .env.local file.
```javascript
node -e "console.log(crypto.randomBytes(32).toString('base64url'))"
```
--------------------------------
### Example OG Image Usage
Source: https://github.com/blazity/commerce-docs/blob/main/features/og-images.mdx
Demonstrates how to embed an OG image within a frame component for social media sharing.
```jsx
```
--------------------------------
### Vercel Toolbar Image Embeds
Source: https://github.com/blazity/commerce-docs/blob/main/features/vercel-toolbar.mdx
Examples of how images are embedded within the Vercel Toolbar documentation using the Frame component.
```html
```
```html
```
```html
```
--------------------------------
### Shopify Category Setup (Automated)
Source: https://github.com/blazity/commerce-docs/blob/main/features/hierarchical-categories.mdx
Create automated categories in Shopify based on product tags for efficient hierarchical organization. This method simplifies product assignment by leveraging tags.
```Shopify
When creating your category, consider where it belongs in the hierarchy so you can set appropriate conditions.
For example:
Given the following structure, we want to create a top-level Fashion category.
```
- Fashion
- Men
- Shorts
- Blazers & suits
- Women
- Skirts
- Dresses
```
To simplify the process of product assignment, create a condition based on matching tags for each sub-category.
For sub-categories, create them following the same principle but with fewer conditions, as the whole point of hierarchies is to narrow down the results!
```
--------------------------------
### Display Dynamic Content Based on Bucket
Source: https://github.com/blazity/commerce-docs/blob/main/features/ab-tests.mdx
An example of a React component that displays different content based on the 'bucket' parameter received in its props. This allows for A/B testing of UI elements like hero section titles.
```tsx
export default function Homepage({ params: { bucket } }) {
const heroTitles = {
a: "Your daily trendsetting deals",
b: "Your daily top deals",
}
return
}
```
--------------------------------
### Shopify & Algolia Starter Link
Source: https://github.com/blazity/commerce-docs/blob/main/starters.mdx
Provides a direct link to the Shopify and Algolia starter project on GitHub.
```markdown
- [Shopify & Algolia](https://github.com/blazity/enterprise-commerce/tree/main/starters/shopify-algolia)
```
--------------------------------
### Shopify & Meilisearch Starter Link
Source: https://github.com/blazity/commerce-docs/blob/main/starters.mdx
Provides a direct link to the Shopify and Meilisearch starter project on GitHub.
```markdown
- [Shopify & Meilisearch](https://github.com/blazity/enterprise-commerce/tree/main/starters/shopify-meilisearch)
```
--------------------------------
### Re-install Mintlify Dependencies
Source: https://github.com/blazity/commerce-docs/blob/main/README.md
Re-installs Mintlify dependencies. This command is useful for troubleshooting when the 'mintlify dev' command is not running correctly.
```bash
mintlify install
```
--------------------------------
### Architecture Diagram
Source: https://github.com/blazity/commerce-docs/blob/main/starters.mdx
Displays the architecture diagram for Enterprise Commerce.
```html
```
--------------------------------
### CLI Usage
Source: https://github.com/blazity/commerce-docs/blob/main/features/cli.mdx
Basic usage of the commerce-cli, including how to access help.
```bash
commerce-cli [command] [options]
commerce-cli -h
```
--------------------------------
### Enabling AI Reviews Summary
Source: https://github.com/blazity/commerce-docs/blob/main/features/reviews.mdx
To enable the AI-powered reviews summary feature, set the OPEN_AI_API_KEY environment variable.
```bash
OPEN_AI_API_KEY=
```
--------------------------------
### Vercel Toolbar Features Overview
Source: https://github.com/blazity/commerce-docs/blob/main/features/vercel-toolbar.mdx
This section outlines the key features of the Vercel Toolbar, including its capabilities for comments, dashboard navigation, deployment sharing, draft mode, feature flags, and layout shifts.
```markdown
## Features
### Comments
The Vercel Toolbar allows you to leave feedback on deployments using the Comments feature. This enables effective communication and collaboration among team members.
### Dashboard Navigation
The toolbar provides quick access to important dashboard pages, allowing you to navigate seamlessly through your project's dashboard.
### Deployment Sharing
With the Vercel Toolbar, you can easily share your deployments with others, facilitating collaboration and feedback gathering.
### Draft Mode
The Draft Mode feature enables you to preview unpublished content from your headless CMS, allowing you to review and iterate on your content before making it live. Learn more in [Draft Mode page](/features/draft-mode)
### Feature Flags
The toolbar allows you to read and set feature flag overrides for your applications, providing granular control over feature availability.
### Layout Shifts
The Vercel Toolbar helps you identify and check for layout shifts in your deployment, ensuring a smooth and consistent user experience.
```
--------------------------------
### OG Image Generation Resources
Source: https://github.com/blazity/commerce-docs/blob/main/features/og-images.mdx
Provides links to tools and documentation for generating and optimizing OG images.
```html
You can use this tool to test and preview OG image cards generated with `@vercel/og`
Learn how to optimize social media image generation through the Open Graph Protocol and `@vercel/og` library.
```
--------------------------------
### Webhook for Near Real-time Review Updates
Source: https://github.com/blazity/commerce-docs/blob/main/features/reviews.mdx
Illustrates the webhook flow for near real-time review updates, involving the review provider, search index, and data cache revalidation.
```javascript
// When a new review is added:
// Call a webhook to update search index.
// After data update:
// Have the search index call another webhook to revalidate the Next.js data cache.
```
--------------------------------
### Algolia API Keys
Source: https://github.com/blazity/commerce-docs/blob/main/providers.mdx
Details the necessary API keys for Algolia integration, including Application ID, Write API Key, and index names for products, categories, and reviews.
```env
ALGOLIA_APP_ID
ALGOLIA_WRITE_API_KEY
ALGOLIA_PRODUCTS_INDEX
ALGOLIA_CATEGORIES_INDEX
ALGOLIA_REVIEWS_INDEX - only if you're using reviews feature
```
--------------------------------
### Enable AI Image Captioning
Source: https://github.com/blazity/commerce-docs/blob/main/ai-features/image-captioning.mdx
Enables the AI Image Captioning feature by setting the IS_IMAGE_CAPTIONING_ENABLED environment variable to true and providing your Replicate API key. This configuration is necessary for the system to automatically generate captions for product images.
```bash
IS_IMAGE_CAPTIONING_ENABLED=true
REPLICATE_API_KEY="your api key"
```
--------------------------------
### Webhook Command
Source: https://github.com/blazity/commerce-docs/blob/main/features/cli.mdx
Manages webhooks for a commerce platform, allowing creation, listing, modification, and deletion of webhooks. It can be used via CLI options or an interactive UI.
```bash
commerce-cli webhook | w [opts]
Options:
-c, --create Create a webhook for your store
-l, --list List and manage all webhooks for your store
-u, --url Shopify store URL
-t, --token Shopify admin access token
-env, --envFilePath Path to your .env file
commerce-cli webhook
```
--------------------------------
### Environment Variables
Source: https://github.com/blazity/commerce-docs/blob/main/features/cli.mdx
Required environment variables for CLI operations, including Shopify and search platform specific keys.
```bash
Shopify admin access token: SHOPIFY_ADMIN_ACCESS_TOKEN
Shopify store URL: SHOPIFY_STORE_DOMAIN
Meilisearch admin key: MEILISEARCH_ADMIN_KEY
Meilisearch Host: MEILISEARCH_HOST
Categories index: MEILISEARCH_CATEGORIES_INDEX
Products index: MEILISEARCH_PRODUCTS_INDEX
Algolia AppId: ALGOLIA_APP_ID
Algolia Write Api Key: ALGOLIA_WRITE_API_KEY
Categories index: ALGOLIA_CATEGORIES_INDEX
Products index: ALGOLIA_PRODUCTS_INDEX
```
--------------------------------
### Sync Command
Source: https://github.com/blazity/commerce-docs/blob/main/features/cli.mdx
Synchronizes products and categories from a commerce platform to a search and merchandise solution. It does not modify Shopify products and can optionally set up webhooks for continuous synchronization.
```bash
commerce-cli sync | s [opts]
Options:
-url, --storeUrl : Platform store URL
-token, --adminAccessToken : Store admin access token
-host, --searchHost : Search host
-adminKey, --searchAdminKey : Search admin key
-categoriesIndex, --categoriesIndex : Search categories index
-productsIndex, --productsIndex : Search products index
-env, --envFilePath : Path to your .env file
```
--------------------------------
### Web Performance Optimization Techniques
Source: https://github.com/blazity/commerce-docs/blob/main/performance.mdx
This section details the core strategies employed by Blazity Enterprise Commerce to achieve high web performance. It covers the benefits of Next.js App Router for JavaScript delivery, the advantages of static content and Incremental Static Regeneration (ISR) for faster loading, and the practice of maintaining small, feature-rich bundles with essential libraries.
```javascript
/*
* Next.js App Router: Optimizes JavaScript delivery for faster loading times.
* Improves metrics like Total Blocking Time (TBT) and Time To Interactive (TTI).
*/
/*
* Static Content and ISR (Incremental Static Regeneration):
* Leverages static pages for instant display, contrasting with dynamic pages.
* Improves metrics like Speed Index.
*/
/*
* Small & Feature-Rich Bundles:
* Maintains minimal bundle sizes.
* Integrates essential libraries such as React Hook Form, Zod, and SWR.
*/
```
```html
```
--------------------------------
### Shopify API Keys
Source: https://github.com/blazity/commerce-docs/blob/main/providers.mdx
Lists the essential API keys required for Shopify integration. These include store domain, storefront access token, admin access token, and app API secret key.
```env
SHOPIFY_STORE_DOMAIN
SHOPIFY_STOREFRONT_ACCESS_TOKEN
SHOPIFY_ADMIN_ACCESS_TOKEN
SHOPIFY_APP_API_SECRET_KEY
```
--------------------------------
### Algolia Virtual Replica Naming Convention
Source: https://github.com/blazity/commerce-docs/blob/main/providers.mdx
Illustrates the naming convention for Algolia virtual replicas used for sorting. This pattern ensures that sorting options like price and update time are correctly configured.
```text
{indexName}_price_desc
{indexName}_price_asc
{indexName}_rating_desc
{indexName}_updated_asc
{indexName}_updated_desc
```
--------------------------------
### Environment Variables for Reviews Integration
Source: https://github.com/blazity/commerce-docs/blob/main/features/reviews.mdx
Required environment variables for integrating the Judge.me reviews provider. These should be set in your Vercel Dashboard or .env.local file.
```bash
JUDGE_BASE_URL=
JUDGE_API_TOKEN=
SHOPIFY_STORE_DOMAIN=
```
--------------------------------
### Meilisearch Products Index Configuration
Source: https://github.com/blazity/commerce-docs/blob/main/providers.mdx
Defines the filterable and sortable attributes for the Meilisearch products index. These settings optimize search performance and filtering capabilities.
```JSON
[
"collections",
"collections.handle",
"collections.id",
"flatOptions",
"handle",
"minPrice",
"tags",
"variants.availableForSale",
"vendor",
"hierarchicalCategories",
"hierarchicalCategories.lvl0",
"hierarchicalCategories.lvl1",
"hierarchicalCategories.lvl2",
"avgRating"
]
```
```JSON
[
"minPrice",
"updatedAtTimestamp",
"avgRating"
]
```
--------------------------------
### Meilisearch Environment Variables
Source: https://github.com/blazity/commerce-docs/blob/main/providers.mdx
Essential environment variables required for Meilisearch integration. These variables store API keys, index names, and host information.
```APIDOC
MEILISEARCH_PRODUCTS_INDEX
MEILISEARCH_CATEGORIES_INDEX
MEILISEARCH_ADMIN_KEY
MEILISEARCH_HOST
MEILISEARCH_REVIEWS_INDEX - only if you're using reviews feature
```
--------------------------------
### Enterprise Commerce Reviews API
Source: https://github.com/blazity/commerce-docs/blob/main/features/reviews.mdx
Documentation for the Enterprise Commerce Reviews API, outlining key functionalities and data structures. Note: Specific endpoints and schemas are conceptual and may vary based on implementation.
```APIDOC
ReviewProviderIntegration:
description: Manages integration with third-party review providers.
providers:
- name: Judge.me
authentication:
type: API_KEY
parameters:
- name: JUDGE_BASE_URL
type: string
description: Base URL for the Judge.me API.
required: true
- name: JUDGE_API_TOKEN
type: string
description: API token for authenticating with Judge.me.
required: true
data_sync:
method: CRON_JOB
frequency: daily
description: Periodically syncs reviews with the search index.
webhooks:
on_new_review:
description: Triggered when a new review is submitted.
action: Call webhook to update search index.
on_data_update:
description: Triggered after review data is updated in the search index.
action: Call webhook to revalidate data cache.
AISummary:
description: Generates and manages AI-powered summaries for product reviews.
configuration:
- name: OPEN_AI_API_KEY
type: string
description: API key for OpenAI to generate review summaries.
required: false
update_frequency:
description: Weekly update trigger.
condition: Only if the product receives a new review.
functionality:
- Generates summaries highlighting product's best and worst aspects.
- Ensures SEO can index changes while providing relevant user information.
```
--------------------------------
### FilterBuilder Usage with Algolia
Source: https://github.com/blazity/commerce-docs/blob/main/features/filtering.mdx
Illustrates the usage of the FilterBuilder class for Algolia queries, showcasing how to build filter expressions with comparisons, logical operators, and grouped conditions, noting potential syntax differences.
```typescript
const filter = new FilterBuilder()
.where("price", 100, ComparisonOperators.GreaterThan)
.and()
.group((sub) =>
sub.where("category", "Electronics").or().where("category", "Computers")
)
.build();
// This will generate the following filter expression:
// price > 100 AND (category:"Electronics" OR category:"Computers")
```
--------------------------------
### Dynamic Metadata Generation
Source: https://github.com/blazity/commerce-docs/blob/main/features/seo.mdx
Export an async function `generateMetadata` in your `page.tsx` or `layout.tsx` file for dynamic metadata. This function receives route parameters, fetches data, and returns a `Promise`.
```typescript
export async function generateMetadata({ params: { slug } }: { params: { slug: string } }): Promise {
const page = await getPage(slug)
return {
title: page?.seo?.title || page?.title,
description: page?.seo?.description || page?.bodySummary,
referrer: "origin-when-cross-origin",
creator: "Blazity",
publisher: "Blazity",
}
}
```
--------------------------------
### Redirects Configuration File
Source: https://github.com/blazity/commerce-docs/blob/main/features/redirects.mdx
Defines the structure for managing SEO redirects. Each key is an old URL path, with values specifying the destination URL and redirect type (permanent or temporary).
```json
{
"/old": {
"destination": "/new",
"permanent": true
},
"/blog/post-old": {
"destination": "/blog/post-new",
"permanent": true
},
"/external": {
"destination": "https://example.com",
"permanent": true
}
}
```
--------------------------------
### Syncing Categories with Search Platform
Source: https://github.com/blazity/commerce-docs/blob/main/features/hierarchical-categories.mdx
Push category data to the search platform using the CLI sync command. Ensure the SHOPIFY_HIERARCHICAL_NAV_HANDLE variable matches your navigation handle.
```CLI
Use our [CLI](/cli#sync) with the `sync` command. Ensure that `SHOPIFY_HIERARCHICAL_NAV_HANDLE` variable matches your navigation handle.
```
--------------------------------
### Enable Google Analytics
Source: https://github.com/blazity/commerce-docs/blob/main/features/analytics.mdx
Enable Google Analytics integration by setting the IS_GTM_ENABLED flag to 'true' in your .env file. This automatically adds the Google Analytics tracking code.
```bash
IS_GTM_ENABLED=true
```
--------------------------------
### Next.js Metadata API
Source: https://github.com/blazity/commerce-docs/blob/main/features/seo.mdx
API documentation for customizing meta tags in a Next.js application. Covers static metadata export using a `metadata` object and dynamic metadata generation via `generateMetadata` function.
```APIDOC
Next.js Metadata API:
1. Static Metadata:
- Export a constant `metadata` object in `page.tsx` or `layout.tsx`.
- Suitable for static metadata values.
- Example:
```typescript
export const metadata: Metadata = {
title: "Page Title",
description: "Page Description",
}
```
2. Dynamic Metadata:
- Export an async function `generateMetadata` in `page.tsx` or `layout.tsx`.
- Receives route parameters: `({ params: { slug } }: { params: { slug: string } })`.
- Returns `Promise`.
- Use for data fetching or dynamic operations before returning metadata.
- Example:
```typescript
export async function generateMetadata({ params: { slug } }: { params: { slug: string } }): Promise {
const page = await getPage(slug);
return {
title: page?.seo?.title || page?.title,
description: page?.seo?.description || page?.bodySummary,
};
}
```
Dependencies:
- `getPage(slug)`: Assumed function to fetch page data based on slug.
Metadata Object Structure:
- `title`: string
- `description`: string
- `openGraph`: object (optional)
- `title`: string
- `description`: string
- `referrer`: string (optional)
- `creator`: string (optional)
- `publisher`: string (optional)
```
--------------------------------
### Algolia Products Index Faceting Attributes
Source: https://github.com/blazity/commerce-docs/blob/main/providers.mdx
Specifies the attributes for faceting within the Algolia 'products' index. This configuration is crucial for filtering and searching product data effectively.
```json
[
"collections.handle",
"collections.id",
"flatOptions.color",
"handle",
"minPrice",
"tags",
"variants.availableForSale",
"vendor",
"hierarchicalCategories.lvl0",
"hierarchicalCategories.lvl1",
"hierarchicalCategories.lvl2",
"avgRating"
]
```
--------------------------------
### FilterBuilder API Reference
Source: https://github.com/blazity/commerce-docs/blob/main/features/filtering.mdx
Provides a detailed reference for the FilterBuilder class, including its enums for operators and descriptions of all available methods for constructing filter expressions.
```apidoc
Enums:
ComparisonOperators:
Equal ( = )
NotEqual ( != )
GreaterThan ( > )
GreaterThanOrEqual ( >= )
LessThan ( < )
LessThanOrEqual ( <= )
To ( TO )
LogicalOperators:
And (AND)
Or (OR)
Not (NOT)
SpecialOperators:
Exists (EXISTS)
IsEmpty (IS EMPTY)
IsNull (IS NULL)
Methods:
where(attribute: string, operator: ComparisonOperators | SpecialOperators, value?: Value): FilterBuilder
Adds a filtering condition to the expression.
Parameters:
attribute: The attribute to filter on.
operator: The comparison or special operator to use.
value (optional): The value to compare against. Can be a single value or an array of values.
Returns: The FilterBuilder instance for chaining.
to(attribute: string, min: number, max: number): FilterBuilder
Adds a range filtering condition to the expression.
Parameters:
attribute: The attribute to filter on.
min: The minimum value of the range.
max: The maximum value of the range.
Returns: The FilterBuilder instance for chaining.
exists(attribute: string): FilterBuilder
Adds an "EXISTS" condition to the expression.
Parameters:
attribute: The attribute to check for existence.
Returns: The FilterBuilder instance for chaining.
isEmpty(attribute: string): FilterBuilder
Adds an "IS EMPTY" condition to the expression.
Parameters:
attribute: The attribute to check for emptiness.
Returns: The FilterBuilder instance for chaining.
isNull(attribute: string): FilterBuilder
Adds an "IS NULL" condition to the expression.
Parameters:
attribute: The attribute to check for null value.
Returns: The FilterBuilder instance for chaining.
in(attribute: string, values: (string | number)[]): FilterBuilder
Adds an "IN" condition to the expression.
Parameters:
attribute: The attribute to filter on.
values: An array of values to check against.
Returns: The FilterBuilder instance for chaining.
```
--------------------------------
### Configure A/B Test Routes
Source: https://github.com/blazity/commerce-docs/blob/main/features/ab-tests.mdx
Defines the routes for A/B testing, specifying the page, cookie name, and buckets for each route. This configuration is essential for enabling A/B testing on different parts of the storefront.
```tsx
const ROUTES: Record = {
"/": {
page: "/home",
cookie: "bucket-home",
buckets: BUCKETS.HOME,
},
}
```
--------------------------------
### FilterBuilder Usage with Meilisearch
Source: https://github.com/blazity/commerce-docs/blob/main/features/filtering.mdx
Demonstrates how to construct a complex filter expression using the FilterBuilder class for Meilisearch queries. It includes chaining methods for comparisons, logical operators, and grouped conditions.
```typescript
const filter = new FilterBuilder()
.where("price", ComparisonOperators.GreaterThan, 100)
.and()
.group((sub) =>
sub
.where("category", "=", "Electronics")
.or()
.where("category", "=", "Computers")
)
.build();
// This will generate the following filter expression:
// price > 100 AND (category = "Electronics" OR category = "Computers")
```
--------------------------------
### Meilisearch Categories Index Configuration
Source: https://github.com/blazity/commerce-docs/blob/main/providers.mdx
Specifies the filterable attributes for the Meilisearch categories index, enabling efficient searching and filtering of category data.
```JSON
[
"handle",
"id"
]
```
--------------------------------
### FilterBuilder Build Expression
Source: https://github.com/blazity/commerce-docs/blob/main/features/filtering.mdx
The build method compiles the constructed filtering conditions into a final string representation.
```APIDOC
build(): string
Builds the final filtering expression as a string.
Returns the filtering expression string.
```
--------------------------------
### Static Metadata Export
Source: https://github.com/blazity/commerce-docs/blob/main/features/seo.mdx
Export a constant `metadata` object in your `page.tsx` or `layout.tsx` file for static metadata. This is suitable when metadata values are static and do not require dynamic processing.
```typescript
export const metadata: Metadata = {
title: "Acme",
openGraph: {
title: "Acme",
description: "Acme is a...",
},
}
```
--------------------------------
### Enable/Disable Vercel Analytics
Source: https://github.com/blazity/commerce-docs/blob/main/features/analytics.mdx
Configure Vercel Analytics by setting the IS_VERCEL_ANALYTICS_ENABLED flag in your .env file. Set to 'true' to enable or 'false' to disable.
```bash
IS_VERCEL_ANALYTICS_ENABLED=false
```
--------------------------------
### Algolia Categories Index Faceting Attributes
Source: https://github.com/blazity/commerce-docs/blob/main/providers.mdx
Defines the attributes for faceting within the Algolia 'categories' index. This ensures proper categorization and filtering of category data.
```json
handle
```
--------------------------------
### Hierarchical Categories Data Structure
Source: https://github.com/blazity/commerce-docs/blob/main/features/hierarchical-categories.mdx
This JSON structure defines how to represent hierarchical categories when pushing products to a search solution. It includes levels from lvl0 to lvl2, with each level containing category paths.
```json
{
"hierarchicalCategories": {
"lvl0": ["fashion"]
"lvl1": ["fashion > women", "fashion > men"]
"lvl2": ["fashion > women > skirts", "fashion > women > dresses", "fashion > men > shorts", "fashion > men > blazers-and-suits"]
}
}
```