Reading list Switch to dark mode

    Guide for Laravel Marketplace Mobile App

    Updated 13 October 2023

    Laravel marketplace mobile app provides full-fledged marketplace website options on the mobile app. It’s built on Flutter so it will provide you with a user-friendly experience. Sellers can perform any action in the app like product addition, view orders, check customers and more.

    Customer can create their account and check products, place orders, check order history, and more. Seller and customer can use same panel to perform the various actions. Also, the customer can become the seller and create their own shop and sell with the marketplace.

    Note: To use the Laravel marketplace mobile app you need to install Laravel Multivendor Marketplace plugin first.

    Features list of Laravel Marketplace Mobile App

    • Separate seller/vendor profile microsite.
    • The seller can add a cover banner and Shop Logo from its profile.
    • Seller/Vendor can see their product list.
    • Separate seller’s product collection Page.
    • Feedback and review system with an interactive star rating from the Seller Shop page.
    • Contact to seller support is provided for the customers.
    • Admin can assign product to the Seller.
    • Interactive Seller Dashboard with all information.
    • Stock availability checks from the seller product section
    • Marketplace Module Enable/Disable feature maintained by Admin.
    • This module provides an attractive landing page with the banners like daily deal, what’s new, and more.
    • Allow to the seller to edit the shop URL for the Profile page, About Shop, Policies information, etc.
    • Admin can also manage the seller profile.
    • Product Edit and Delete option on seller panel.
    • Earning Section at the seller profile provides Earning information by Date, Month, and Year.
    • Seller / Vendor transaction report at seller panel.
    • The seller can check the refunded orders.
    • The Laravel Marketplace app supported all currencies.
    • Cart and catalog rules are Supported.
    • Sellers and Customers can sign up differently.
    • Admin can allow seller which product type will be sold or assigned to the seller.
    • Customer can check the recently viewed product.
    • The app can be displayed in a dark theme.

    Installation of Laravel Marketplace Mobile App

    Step 1: To install the Laravel Marketplace Mobile app on your server you need to install the Bagisto first.

    Please follow the URL – Installation of Bagisto

    Start your headless eCommerce
    now.
    Find out More

    Step 2: Now install the Bagisto API to configure the mobile app.

    Bagisto GraphQL API

    Laravel eCommerce headless APIs allow you to experience seamless and easily scalable storefront performance. The open-source headless Laravel platform built on GraphQL-based Rest API delivers ultra-fast, dynamic, and personalized shopping experiences.

    Read our documentation: Bagisto GraphQL API Docs

    The Bagisto GraphQL API is made in collaboration with Ucraft Team

    1. Requirements:

    • Bagisto: v1.4.5

    2. Installation:

    To clone Bagisto GraphQL run the below command from the terminal:

    composer require bagisto/graphql-api dev-main
    • Add the below line inside the modules index in the config/concord.php file:
    \Webkul\GraphQLAPI\Providers\ModuleServiceProvider::class,
    • Find a file app/Http/Kernel.php from the root and add these two middlewares inside the $middleware array:
    \Illuminate\Cookie\Middleware\AddQueuedCookiesToResponse::class,
    \Illuminate\Session\Middleware\StartSession::class,
    • Add the JWT_TTL (JWT time to live) & JWT_SHOW_BLACKLIST_EXCEPTION entries in the .env file:
    JWT_TTL=525600
    JWT_SHOW_BLACKLIST_EXCEPTION=true

    To install and publish the assets and configurations, run below command from the root in terminal:

    php artisan bagisto-graphql:install
    • Now to use the graphql-playground for testing the APIs:
    http://your-domain.com/graphql-playground
    • You can also use the Postmen for testing the APIs:
    http://your-domain.com/graphql

    That’s it, Now just execute the project on your specified domain.

    Step 3: Now install the Bagisto Marketplace before installing the app on your server.

    Please follow the link: Install Laravel Marketplace

    You can also check the installation process in the Laravel Marketplace user guide.

    Step 4: Now configure the Marketplace API to complete the process.

    Bagisto Marketplace GraphQL API

    Marketplace graphQL API to mutate and query the marketplace features like Seller Registration, Seller Info, Sellers List, Seller’s Transactions, Seller’s Orders, etc.

    Requirements:

    • Bagisto: v1.4.5
    • Marketplace(Bagisto): v1.4.5

    Installation:

    Before this Package installation, make sure you already configured the Bagisto-Headless-Ecommerce package.

    Bagisto Headless Ecommerce Installation

    Follow Link: https://github.com/bagisto/headless-ecommerce#2-installation

    Bagisto Marketplace Installation

    After the installation of Bagisto and Bagisto Headless API, you need to set up the Marketplace module for the functioning of the Marketplace Module.

    Follow Link: https://webkul.com/blog/laravel-multi-vendor-marketplace/

    Step-1 Marketplace GraphQL Package Installation

    After the installation of Bagisto and Bagisto Headless API, you need to add the Marketplace Package and after that, you need to add the Marketplace GraphQL API Package, Below is the installation process.

    Step-2 Package Installation

    Unzip the respective extension zip and then merge the “packages” folder in the root directory of Bagisto.

    • Goto config/app.php file and add the following line under the ‘providers’ index:
    Webkul\MarketplaceGraphQLAPI\Providers\MarketplaceGraphQLAPIServiceProvider::class
    • Goto composer.json file and add the following line under ‘psr-4’:
    "Webkul\\MarketplaceGraphQLAPI\\": "packages/Webkul/MarketplaceGraphQLAPI/src"
    • Run the below commands from the instance root:
    composer dump-autoload
    php artisan optimize:clear
    php artisan vendor:publish --provider="Webkul\MarketplaceGraphQLAPI\Providers\MarketplaceGraphQLAPIServiceProvider" --force

    Laravel Marketplace Mobile App Configuration

    Once you are on the Admin dashboard, click the Configure option which is there on the left-hand side in the menu bar following which you will be redirected to the Marketplace Configuration page. Here you will be able to see the module version:

    Screenshot-1-11

    Landing Page

    When a user installs the Laravel Marketplace mobile app on their mobile device it will redirect them to the main page of the mobile app. So the customer can check various banners on the landing page and in the side menu bar multiple options will display.

    Screenshot_20230823-131713-1
    bagisto-MP-app-1
    Laravel-MP-login

    Signup and Login

    The customer can sign up or login into the application by choosing the option to sign up as a customer or seller. If they have an account they can directly click on the sign-in option.

    bagisto-mp-customer
    Screenshot_20230823-153810
    Screenshot_20230823-154047

    Sellers or customers can also log in with their social media accounts like Gmail and Facebook (paid add-on).

    Product Page

    The customer can check the product page and purchase the listed product. They can open the side menu bar and choose the desired category to purchase the product.

    Laravel-MP-category
    Product-category
    Laravel-MP-product

    Customers can also add the product directly or they can view the product and add it to the cart then proceed with checkout.

    Screenshot_20230824-162020
    Laravel-MP-add-product
    Screenshot_20230825-135127

    Product Filter

    If a customer wants to filter or sort the product based on different conditions they can apply the filters on the product page.

    Laravel-filter
    Laravel-sort

    Recent Product

    Here the customer can check the recently viewed products and can add to their cart directly by clicking on the Add to Cart button.

    Screenshot_2023-10-13-10-09-03-80_54c146f2f549f38edbe07bdbee946ed3-copy

    Checkout

    In the checkout page customer will enter the billing, shipping, and payment details to complete the purchase.

    Screenshot_20230824-162034
    Screenshot_20230824-162046
    Screenshot_20230824-162101
    Screenshot_20230824-162113
    Screenshot_20230824-162125
    Laravel-MP-order-placed

    Order Details and History

    The user can check the order history and details in the order list section from the account information tab.

    Screenshot_20230824-162416
    Screenshot_20230824-162147
    Screenshot_20230824-162155

    Compare List

    The user can add the product in the compare to compare the product before purchasing it. The compare product list will be displayed in the account information section.

    Screenshot_20230824-161855
    Screenshot_20230824-162338

    Wishlist

    The user can add the product to the wishlist so they can purchase the product whenever they require it and they dont need to search for it. The wishlist product list will be displayed in the account information section.

    Laravel-MP-wishlist
    Screenshot_20230824-162322

    Account Information

    Dashboard

    In the dashboard section users can check the recent orders, addresses, and reviews.

    Laravel-MP-dashboard
    Screenshot_20230824-162231
    Screenshot_20230825-174512

    Address Book

    The user can add, edit, and remove addresses for billing and shipping. They can also use their current location by hovering on the location icon.

    Laravel-address-book
    Screenshot_20230825-182913
    Screenshot_20230825-182920_Permission-controller

    Reviews

    The customer can post the review on any product with text and image and post it. The seller or customer can check the posted review in the review section. They can also delete the review from there.

    Screenshot_20230824-161911
    Screenshot_20230824-161928
    Screenshot_20230825-173340

    Marketplace

    The customer and seller can check the marketplace options in the side menu bar with various options.

    Screenshot_20230825-120908

    Become a Seller

    The customer can also become the seller for that they need to navigate to the sell option and then click on the open shop now button.

    Furthermore, customers can check the vendor list and open any vendor to check the seller details in the seller profile section. They can check ratings, and product lists, contact the seller, and report the seller.

    Screenshot_20230823-153849
    Laravel-MP-seller-details
    Laravel-MP-rating
    Seller Product, Contact Seller, Report Seller
    Laravel-seller-product
    Screenshot_20230825-121722
    Screenshot_20230825-121741

    Seller Dashboard

    The seller can check their dashboard by hovering on the seller dashboard option. Sellers can check top-selling products, customers with the most sales, and stock thresholds.

    Laravel-seller-dashboard
    Screenshot_20230825-184256
    Screenshot_20230825-184316

    Seller Profile

    The seller can move into their profile section and add multiple details like shop title, contact details, address, image & theme, about the shop, and social profiles.

    Laravel-Marketplace-seller-profile
    screenshot_20230828_124808
    Screenshot_20230825-162252

    Furthermore, add SEO information, different return policies, set minimum order amount, and google analytics if required.

    Laravel-SEO
    Screenshot_20230825-162325
    Screenshot_20230825-162349

    Marketplace Product

    The seller can check their marketplace products from here. The seller can edit or remove any product in this list.

    Screenshot_20230825-120757
    Screenshot_20230825-122444
    Screenshot_20230825-122833

    Marketplace Reviews

    The seller can view the customer reviews on their store and product in this section.

    screenshot_20230828_153910

    Marketplace Orders

    The seller can check the orders in the section with order details by viewing it.

    screenshot_20230828_153155
    screenshot_20230828_153845
    screenshot_20230828_153853

    Seller Earnings, Payment details, and Customers

    The seller can check their earning report, payment details, and registered customers on their store from the listed options.

    Screenshot_20230825-120825
    Screenshot_20230825-120621
    Screenshot_20230825-120557

    Dark Theme

    The customer can use the app in a dark theme as well by tapping on the theme option, the theme of the app converts into dark as mentioned in the below snapshot:

    Screenshot_2023-10-13-10-26-38-26_54c146f2f549f38edbe07bdbee946ed3-copy-1
    Screenshot_2023-10-13-10-04-19-75_54c146f2f549f38edbe07bdbee946ed3-copy

    Note: The seller and customer can check the language and currency of the store.

    That’s all for the Laravel Multi-Vendor Marketplace Mobile app, still, have any issues feel free to add a ticket and also let us know your views to make the module better https://bagisto.uvdesk.com/en/.

    If you’re looking to create a custom e-commerce website, it’s a great idea to check out our Laravel development services which will help you build a powerful and scalable online store.

    You can also check our complete Bagisto Laravel Modules here.

    Current Product Version - 1.5.1

    Supported Framework Version - Bagisto v1.5.x

    . . .

    Leave a Comment

    Your email address will not be published. Required fields are marked*


    Be the first to comment.

    Back to Top

    Message Sent!

    If you have more details or questions, you can reply to the received confirmation email.

    Back to Home

    Table of Content