What is BigCommerce REST Storefront API? Key Features and Case Study of BigCommerce REST Storefront API?

The BigCommerce REST Storefront API is a powerful tool that allows developers to interact with and manage various aspects of an online store’s front end. This API is handy for customizing the shopping experience, managing carts and checkouts, and integrating additional functionalities into BigCommerce-hosted storefronts.

BigCommerce REST Storefront API Key Features

• Cart Management:   The REST Storefront API enables developers to manage the contents of a shopper’s cart using JavaScript.This includes adding, updating, and removing items from the cart.  Example: Adding an item to the cart programmatically from a Stencil storefront.
• Checkout Process:  The API provides endpoints to handle the checkout process, including updating billing and shipping addresses, applying discounts, and processing payments.  Example: Updating the billing address during checkout to ensure accurate order processing.
• Order Management: Developers can retrieve and display order information to customers, such as recent orders and order status. Example: Displaying a customer’s recent order details on their account page.
• Customization and Integration: The REST Storefront API allows for extensive customization of the storefront, enabling developers to create unique shopping experiences tailored to their brand’s needs.  Example: Integrating third-party services or custom features directly into the storefront.

Case Study: Using BigCommerce REST Storefront API to Manage COD Payment Method Based on Cart Amount

Introduction:
A business used the BigCommerce REST Storefront API to properly manage the availability of the Cash on Delivery (COD) payment method based on the cart amount. Specifically, the goal was to allow the COD option for orders that were above ₹5000. The following is a case study to break down how we helped them do it.

Objectives:

• Our main aim was to reduce the risk associated with low-value COD orders.
• We wanted to automatically adjust the available payment methods based on cart value to better the user experience.
• We wanted to make sure customers are presented with appropriate payment options to smoothen the user experience.
• We streamlined the payment method management, thus reducing manual intervention.

Implementation Process:

We used the Fetch API to interact with the REST Storefront API and retrieve a shopper’s cart, checkout details, or order information.

  let cart = '/api/storefront/carts/';
 
   // Fetch API to get cart details
    fetch(cart)
    .then((res) => res.json())
    .then((cart_details)=>{
     console.log('cart details \n'); 
     console.log(cart_details);
     console.log('cart amount \n'); 
     console.log(cart_details[0].cartAmount);
     var cart_amount = cart_details[0].cartAmount;

Logic to Hide COD Payment Method When Cart amount is greater than 5K

 if ((cart_amount > 5000)) {
                    console.log('Product price is greater than 5K');
                    // 1. Selector for Credit Card and let it be there
                         //myselector[0].classList.add("hide");
                         //myselector[0].style.display = "none";

                    // 2. Selector for GPay and and let it be there
                         //myselector[1].classList.add("hide");
                         //myselector[1].style.display = "none";


                    // 3. Selector for Cash on Delivery and hide it
                        //myselector[2].classList.add("hide");
                        myselector[2].style.display = "none";

       }

Source: BigCommerce REST Storefront cart and checkout API

Conclusion

By leveraging the BigCommerce REST Storefront API, the business successfully implemented a dynamic system to manage payment methods based on cart value. This improved security and user experience while also streamlining the checkout process, ensuring customers had access to suitable payment options.

About the Author:
Subhash Jain is a BigCommerce expert leading a team that harnesses the power of BigCommerce API. Contact today to get services on how to leverage the Storefront API for your BigCommerce store.