ECOMMERCE INSIGHTS

As new online platforms gain popularity, we can see that eCommerce doesn’t just apply to websites. New opportunities are opening up for merchants to connect with buyers, and you can now add commerce features to any platform with Shopify Marketplace Kit. Marketplace Kit enables you to use Shopify’s commerce features and connects your platform to millions of merchants and their products.

What’s new with the latest Marketplace Kit?

With the latest version, it’s now incredibly fast to build a basic marketplace using Marketplace Kit. To speed up your development workflow, we’ve decoupled from the Shopify CLI and created two new apps to help get you started.

Marketplace Kit allows you to start building a marketplace whether you have an existing platform or not. The world’s most innovative brands, such as Meta, TikTok, and Pinterest, have used Marketplace Kit to add commerce to their platforms.

You can use our flexible APIs to add commerce to an existing platform or use our apps to build a brand new marketplace. Additionally, you get access to millions of Shopify merchants who can install your sales channel and start selling their products on your existing or new platform.

How does it work?

Shopify Marketplace Admin app

Initially, Marketplace Kit provided walkthrough tutorials on how to create a merchant-facing app and connect it to an external marketplace, easing the complicated process of developing a marketplace channel app (merchant-facing in the Shopify admin) and connecting it externally. Now, we’ve gone a step further and removed the need to build a merchant-facing app from scratch.

Instead, we’ve created the Shopify Marketplace Admin app, an out-of-the-box starting point for your merchant-facing marketplace app. This app comes with authentication, routing, basic pages, Channels-UI integration, and key API calls built-in. No need for weeks of setup time now, simply clone the repo and go!

In creating the Shopify Marketplace Admin app we used widely used, readily available technologies that are well supported and documented. This means we can appeal to the largest number of partners possible.

The key technology that’s used in the Shopify Marketplaces admin app are:

• Yarn
• NPM
• Node
• Express
• Webpack
• React
• Sequelize
• Channels UI Library
• GraphQL and REST
• Storefront API

Many Shopify partners already own or manage an existing platform and wish to embed commerce into it. But there’s a growing number of partners and agencies that don’t have a buyer-facing marketplace yet.

These marketplaces have previously been at a disadvantage because they have to build both merchant-facing and buyer-facing experiences. To help, we created an app for partners who want to build a marketplace from the ground up and bundled it into our Shopify-specific opinions.

The Shopify Marketplaces Buyer app is a springboard for partners who don’t already have a marketplace. This app gives you a basic marketplace, complete with a frontend and backend. Developers can use this app as a starting point for their marketplace vision and can see how it ties in directly with the merchant-facing app.

We’ve packaged up key features and API calls into this app to help reduce the complexity and heavy lift of the initial setup. We don’t see the app as an out-of-the-box, production-ready, solution for marketplaces. However, it’s a valuable starting point that you can easily build on and customize because it incorporates key technology that’s widely used.

The key technology that’s used in Shopify marketplaces buyer app includes:

• Main frontend framework: NextJS, which is a framework for ReactJS
• Main CSS library: MUI – Material UI
• Data fetching: GraphQL
• The Shopify API that provides store channel data: Storefront API

These two starter apps, coupled with detailed walkthrough tutorials in our developer documentation, mean that getting started with creating a marketplace or embedding commerce on your existing platform has never been easier.

What’s in it for you?

Fast setup time

Following the instructions, we were able to create a basic marketplace from scratch using the Shopify Marketplaces Buyer and Shopify Marketplaces Admin apps in just eight minutes. Can it be done faster? We’re sure it can!

We’ve worked with partners of all sizes and have seen that it can take months to build the initial setup. Because of this, we have condensed everything we’ve learned over the last few years into the Marketplace Kit experience. Any size partner can learn from what we’ve baked into our code. Pull the common patterns and use them as the need arises.

We’ve removed the heavy lifting of common code that all partners will need to include in their merchant-facing app. No matter the platform or partner size, there are some things that all admin apps need to do. These include:

• Connecting to a merchant’s store
• Retrieving and storing data
• Display an overview page
• Display an onboarding page

The process for these can be quite complex, connecting to multiple merchant stores and saving storefront access tokens for shop data retrieval in particular. We used the Storefront API coupled with JWT authentication using App Bridge, Shopify’s Node API, and Express, for serving REST and GraphQL. You can read more about why we chose these technologies in our Engineering blog post.

Start customizing right away

Our apps use common technology (see above) that is well supported so customizing is easy from the get-go. For example, we use the MUI – Material UI library as the main CSS library for the buyer-facing app. If you don’t want to use this library, you can easily swap it out for your CSS library.

Another example is the Onboarding page in the merchant-facing app. We’ve provided a simple onboarding page with an information card and placeholder text to get you started. You can create new sections, add more components, and more using the patterns that exist in the merchant-facing repo and Channels-UI.

THE KEY FEATURES OF A SHOPIFY MARKETPLACE

Shopify will provide your marketplace with all the necessary functionality. Here are some of the main features:

Product listings

You can customize the way products are displayed in your marketplace. On top of it, you control the information the customers see. For instance, a product description page can include variant pickers such as available colors or sizes. Shopify allows adding Buy Now buttons redirecting buyers to an online store for checkout. Also, merchants can specify the store policies on the product description pages.

Storefronts

With Shopify, you can allow merchants to present their brands vividly and enticingly. They will have their pages to showcase their entire inventory, using different media and providing multiple details. The customers will have ample opportunities to find the goods or services they need. In particular, they will be able to order products by specific criteria (for instance, name) or filter them (for example, by price ranges). Segmenting products by categories is also possible. Note that the search, order, and filter options are also available for shop discovery.

Cart and checkout

Shopify offers two ways to deal with how customers make orders. One way is to direct buyers to the merchant’s store and complete the purchase there. Another is to use Shopify’s secure web checkout. The e-commerce platform allows you to create a marketplace-level cart page. It will display the products across all shops as well as the estimated costs.

Cart and checkout

Shopify offers two ways to deal with how customers make orders. One way is to direct buyers to the merchant’s store and complete the purchase there. Another is to use Shopify’s secure web checkout. The e-commerce platform allows you to create a marketplace-level cart page. It will display the products across all shops as well as the estimated costs.

Content guidelines

Shopify emphasizes the importance of clarity and open communication not only on their app but within the marketplaces of their partners, too. This is to make sure that users of all Shopify-associated platforms are always kept informed of scheduled maintenance, outbound links to unverified sites, etc.

Wrap up..

With the help of this blog, you should be able to create and manage Shopify Marketplace. Once you’re done, you can look at the Shopify theme customization to make your store more stunning and enhance the user’s shopping experience. Of course, the store with such product features also have a good hosting partner Like Shopify Cloud.

Born Techies –Digital Commerce agency offers Shopify Shopware Magento, and Bigcommerce development with the latest technologies.

Do you want to receive a free consultation about how to optimize your store and generate more sales? Reach us out at [email protected] or contact us, and we will be more than happy to help you out.