Shopify Marketplace Kit hero image

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.

We knew there were an abundance of independent brands competing for customers' attention, and after some quick research, we found that 90%+ of them were using Shopify. It's a no brainer really. Shopify is a fantastic platform for getting an E-Commerce business up and running in no time at all.

Jake Dormer, Co-Founder of Aveste

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

Shopify Marketplaces Buyer app

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 the 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 own 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 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.

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.

Keeping our store in sync was made a whole lot easier by the product listing API and webhooks. Shopify's developer documentation is fantastic. They had a dedicated area on their dev site for sales channels and so we quickly began to build the app & site.

Jake Dormer, Co-Founder of Aveste

marketplace screenshot — Aveste showcases products from multiple Shopify fashion merchants

What’s in it for me?

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 as the need arises.

We’ve got the nitty-gritty covered

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 on 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 own 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.

Tutorials and walkthroughs on shopify.dev/marketplaces

Our tutorials are tried and tested. Coupled with the apps you can add additional functionality to your marketplace.

So, how do I get started?

It is as easy as one, two, three. Well, there are actually eight steps to follow to get up and running, but you get it— it’s fast. We've completed the setup in eight minutes and would love to see how quickly it can be done.

The prerequisites:

You have the Shopify CLI installed
You have the Sequelize CLI installed
You've installed the latest versions of Node.js and npm
You have Yarn installed
You've created a Partner account and a development store
You have created an app in the Partners dashboard and have turned it into a sales channel

The instructions:

Clone Shopify Marketplaces Admin app
Install and run yarn
Run migrations (```npx sequelize-cli db:migrate```)
Create a .env file in the root and add the following scopes: unauthenticated_read_product_listings,read_product_listings
Run Shopify CLI (```shopify app serve```) and follow prompts
Clone Shopify Marketplaces Buyer app
Install and run yarn
Run buyer app

Let’s go!

You now have a solid starting point for your marketplace and can begin exploring the code, the tutorials, and how to customize. Feel free to comment or improve directly on our repos in GitHub.

Search results for

"Karen McCrann"

All results