npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

recommendation-service

v2.0.3

Published

## Overview

Downloads

497

Readme

Recommendation Service

Overview

This package provides recommendation service for integrating Sizey Size Recommendations and Product Data Synchronizing service into your online sales platform or product data management system (like ERP or PIM).

Installation

To use this Recommendation Service, you can install it via npm:

npm install recommendation-service

Here's how you can use this Recommendation Service and Product Synchronization in your webshop or application:

Import the package in your JavaScript/React code:

import { sizeySync } from 'recommendation-service';  // For Sync products with sizey

import { sizeyRecommendation } from 'recommendation-service';  // For Recommendation service

Usage in React Project

Usage of Recommendation Service

To use the Recommendation service, follow these steps:

  1. Import the sizeyRecommendation function from the recommendation-service package:

    import { sizeyRecommendation } from 'recommendation-service';
  2. Add the following HTML code to your component where you want to integrate the Recommendation service:

    <span
        id="sizey-container" 
        apikey="your-apikey"
        data-upc="upc-value"
        data-productid="productId"
        data-brand="test-brand"
        data-garment="test-garment"
        recommendation_link_text="Test your size"
        recommendation_button_text="Test My Size"
        showaslink="false">
    </span>

Usage of Product Synchronization

To use the Product synchronization feature, follow these steps:

  1. Add the following HTML code to your component where you want to integrate the Product synchronization:

    <span 
        id="sizey-container" 
        apikey="your-apikey"
        data-products='[
            {
                "attributes": {
                    "id": "product_id",
                    "name": "Product name",
                    "brandName": "Brand name",
                    "productType": "type of product",
                    "description": "General description",
                    "variations": [
                        {
                            "color": "Black",
                            "size": "L",
                            "eanCode": "VariationId",
                            "fabric": "Cotton",
                            "isValid": true
                        }
                    ],
                    "isPublic": true
                }
            }
        ]'
        sync_link_text="Sync Products"
        showaslink="false">
    </span>

Styling the Buttons

  • To style the Recommendation service button, use the .recommendation-service-button class.
  • To style the Sync Product button, use the .sync-product-button class.

Usage in HTML Project

Usage of Sizey Recommendation

To include the sizey Recommendation Service script in your HTML file, use the following code:

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://rawcdn.githack.com/Sizey-Ltd/recommendation-service-package/5a62a06770c76a1cdbcf2fd1aa16bee8b999151e/sizey-recommendation.min.js"></script>

<span 
    id="sizey-container" 
    apikey='your-apikey'
    data-upc="upc-value"
    data-productid="productId"
    data-brand="test-brand"
    data-garment="test-garment"
    recommendation_link_text="Test your size"
    recommendation_button_text="Test My Size"
    showaslink="false">
</span>

Usage of Product Synchronization

To include the Product Synchronization script in your HTML file, use the following code:

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://rawcdn.githack.com/Sizey-Ltd/recommendation-service-package/5a62a06770c76a1cdbcf2fd1aa16bee8b999151e/sizey-sync-html.min.js" type="module"></script>

    <span 
        id="sizey-container" 
        apikey="your-apikey"
        data-products='[
            {
                "attributes": {
                    "id": "product_id",
                    "name": "Product name",
                    "brandName": "Brand name",
                    "productType": "type of product",
                    "description": "General description",
                    "variations": [
                        {
                            "color": "Black",
                            "size": "L",
                            "eanCode": "VariationId",
                            "fabric": "Cotton",
                            "isValid": true
                        }
                    ],
                    "isPublic": true
                }
            }
        ]'
        sync_link_text="Sync Products"
        showaslink="false">
    </span>

Sizey Service(Options)

When initializing the Recommendation Service, provide the following options:

  • apikey: Your API key (string).
  • recommendation_link_text: Text for the recommendation link (string).
  • recommendation_button_text: Text for the recommendation button (string).
  • showaslink: Set to true to use a link, or false to use a button (string).
  • data-products: Array of product which need to sync with sizey (Array of object).
  • sync_link_text: Text for the sync button (string).
  • data-upc: Your product UPC key (string).
  • data-productid: Your product ID key (string).
  • data-brand & data-garment: Your product brand & garment key (string).

Note: At least one of the parameters (data-upc, data-productid, [data-brand& data-garment]) is required for the Sizey Recommendation Service to function correctly. You can choose the one that best fits your implementation.

Obtaining Your API Key

To use the Recommendation Service, you'll need an API key. Here's how you can obtain one:

1. Visit (https://portal.sizey.ai/) and register your account.

2. Once you've successfully registered and logged in, navigate to the "Company Information" page.

3. Select a suitable plan for your company on the Sizey Portal.

4. After successfully completing the registration and setup, you will have access to your own company account on the portal.

5. To obtain your API key, go to (https://portal.sizey.ai/my-apikeys) within your Sizey Portal account.

6. Here, you will find your unique API key. Copy this key and use it when initializing the Recommendation Service in your project.

Obtaining upc-data for Your Products

To use the Recommendation Service, you'll need UPC data for your products. Here's how you can obtain it:

1. Login to (https://portal.sizey.ai/).

2. After successfully logging in, navigate to (https://portal.sizey.ai/my-products) within your Sizey Portal account.

3. Here, you will see a "Create New Product" button in the user interface. Click on it to create a new product.

4. You will be redirected to (https://portal.sizey.ai/my-products/new) page. Follow the instructions to set up and configure your product.

5. As you create your product, make sure to add a suitable size chart for it.

6. After setting up your product, you can create variations for your product. You will find an "Add Variation" button in the user interface. Click on it to add variations.

7. As you add variations to your product, you will be able to access the UPC values specific to each variation.

8. The UPC values represent different product variations, and you can use these values as input (upc-data) when using the Recommendation Service in your webshop or application.