How can I develop a shopping cart on my marketplace? This is a question our Developer Advocate team frequently hears from folks working on their product marketplaces. The short answer is that it is possible, but is a complex feature that involves a fair bit of custom development.

In this blog series, we will dive deep into the long answer. Over the course of half a dozen articles, we will look into the different technical aspects of building a multi-vendor shopping cart with a single-vendor checkout on top of the Sharetribe Developer Platform and a v4.1.0 Sharetribe Web Template.

For a more theoretical discussion on the complexities of shopping carts on a multi-vendor marketplace, I recommend that you read the Marketplace Academy article on how to build a multi-vendor shopping cart. In the article, our CEO Juho explains the ins and outs of whether you actually need a shopping cart to begin with, and what other options you have besides the one we are discussing in this series.

The default Stripe Sharetribe integration only allows a transaction to be paid out to a single provider. This means that with a single vendor checkout, you will not need to include a full payment gateway integration on top of the shopping cart feature.

In addition, single vendor checkout simplifies delivery handling. When items are dispatched from multiple vendors in multiple locations, shipping calculations may become unnecessarily complex. With a single vendor checkout, we can rely on the delivery information on the single provider’s listings

In a Sharetribe marketplace, a single transaction can only handle stock for a single listing. If you want to use stock management as a part of your shopping cart logic, you will need to start a transaction for every listing whose stock you want to manage as a part of the shopping cart purchase.

To do this, you would have one transaction that acts as the “main” transaction for the purchase. In that transaction, you won’t handle stock for any of the listings. Instead, this transaction will process the payment for the whole purchase, as well as delivery and review. In addition to this main transaction, you will initiate a separate “child” transaction with a separate transaction process for each listing in the cart. To connect the transactions, you will need to save the main transaction’s id in each child transaction’s protected data, and vice versa.

This allows you to manage the stock for each listing separately, in case some of the items get disputed and need to be refunded, or in case you allow returns on your marketplace.

However, it is good to note that if you have a cart logic where each listing’s stock reservation is handled with a child transaction, you cannot use the same transaction process to then allow a “Buy now” process. In the version we will create throughout this blog series, products can only be purchased through a cart, and not with a “Buy now” flow.

The high-level flow of building a shopping cart with a single vendor checkout includes the following changes:

1. Include an "Add to cart" button on each listing to replace the “Buy now” button. 
2. Save the cart items in the user's private data under the listing provider's id
3. Allow users to only check out their cart one provider at a time to use the default Sharetribe Stripe integration
4. When the user wants to check out their cart, add each listing as a line item on a single transaction
5. Set the first listing as the main listing for the transaction
6. Additionally, for each listing, start a child transaction with a custom transaction process that only handles stock reservations
7. Show all cart listings on CheckoutPage and TransactionPage.
8. Determine how to handle partial refunds in case the user wants to return only one of the items they purchase

As you can see, a multi-vendor shopping cart is a complex feature to build. This means that it will require customizations to nearly all parts of the marketplace application: 

• Modifying the transaction process flow to handle the cart
• Modifying the transaction email templates to handle multiple listings
• Adding a new transaction process for child transactions
• Adding new components, such as an AddToCartButton, and modifying existing ones, such as OrderPanel
• Adding a new container for viewing cart contents (CartPage)
• Modifying line item calculation and related server endpoint to include all listings in cart
• Modifying the checkout process and related server endpoints to handle multiple listings instead of one
• Modifying the transaction page to show all cart listings
• Optionally building a partial payment gateway to handle payouts and refunds in a case where part of the purchase gets disputed

The subsequent articles in this series will address these customizations, as well as the choices you will need to make depending on your different use cases.

The first step is to allow users to add items to their cart.