How to Get Started with Mercur Marketplace?
Recently, we released Mercur.js. — MultiVendor Marketplace Accelerator, which allows you to set up the foundation in under 10 minutes and customize everything using the capabilities of Medusa.js.
Our developer, Viktor, has created a tutorial to guide you through the process of building a marketplace using this powerful tool. By the end of this video, you’ll have a fully functional marketplace with both admin and vendor panels along with their features.
You can find the transcription of the guide below.
Transcription
Hello, guys! My name is Victor. In this video, I’m going to show you how we can start building marketplaces using Mercur.js Accelerator.
I have prepared some commands to run. We can start by initializing our Mercur.js starter. We can do that by running npx mercurjs and adding a directory that will be created. This command grabs and copies the code from the repositories and pastes it into this directory. I've already completed this step, so we can skip it.
Next, you can go to the API directory by running cd api and installing your packages.
After installing your packages, you can run yarn build to build your Medusa.js backend in order to be able to run migrations. So let's build it.
The next thing you want to do is to add some default data like users, regions, and some categories. You can do that by running yarn seed. Before you do that, make sure you comment out the admin panels to avoid any issues with them. So let's run yarn seed.
After running your seed commands, uncomment your admin panel plugins and run yarn dev.This will spin up the admin panel and backend. You should be able to access your admin user by logging in to admin@medusatest.com with the password supersecret. Now, as you can see, you have a fully working admin panel.
The next step is to yarn the vendor panel to register our first vendor user. Log out from the admin panel, create a new tab, and run yarn dev vendor. This will spin up the vendor panel on localhost:7002. Go to the page, register, and create your first vendor user with the email vendor@medusatest.com and the password supersecret. Now, as you can see, the new user is created but needs to be approved by the administrator. Log in again to the admin panel, go to the users tab, and change the new vendor user's status from pending to active. You can also reject users if you want.
Now log in to the vendor panel. As you can see, we have a fully working vendor panel. If we go to our team, you can see that we are the first in our store.
Let’s add a new product. As you can see, the new product has been created, and there’s a shipping options widget that I added.
Let’s go to our VS Codes. As you can see, we have two new folders: the admin and vendor panel. In these folders, you can create new routes and widgets.
For example, in the admin panel, this user’s route was created via the admin folder. We added the config and the page. In the vendor panel, I added the shipping options feature. The marketplace vendor can add different shipping options based on the product. You can go to settings, then to shipping options, and add options like Express, priced at $25. Go to your products, see the widget, and select the Express option. Later in the product, you should see the shipping options with the values the vendor added.
This should give you an illustration of how to add new admin features and features to the vendor panel. You can create custom plugins and reuse or share them. To add a custom feature to the admin panel, create some routes or widgets in the admin panel. To add features to the vendor panel, add your custom widgets or pages in the vendor folder and use the same inject zones or config.
To Wrap Up
We hope you found Viktor’s tutorial insightful and helpful.
Building a marketplace can be complex, but with the right tools like Mercur, you can achieve your goals seamlessly.
If you have any questions or need further assistance, feel free to reach out to our team. We’re here to help you every step of the way.
