📌 Project Overview
The Marketplace / Directory template is a full two-sided platform built for business directories, vertical marketplaces, and listing-based communities that connect vendors with buyers or service seekers. With Algolia-powered faceted search and geo-filtering, Mapbox location-aware browsing, a Stripe Connect multi-vendor payout system, and a moderated review pipeline, this template provides everything needed to launch and operate a scalable marketplace business.
From local business directories to niche service marketplaces, this platform gives vendors the tools to showcase their listings and manage their business presence, while giving platform operators the controls to maintain quality, moderate reviews, and monetize through featured upgrades and listing fees.
🧩 Core Features
1. Algolia Faceted Search with Geo-Filtering
The Search page uses Algolia InstantSearch with facets for category, price range, rating, and location radius. A Mapbox map/list toggle gives users the choice between browsing by location or scanning a curated list — with real-time results as filters change.
2. Stripe Connect Multi-Vendor Payouts
Vendors onboard through Stripe Connect and receive payouts directly to their bank accounts when customers purchase or upgrade listings. The platform retains a configurable percentage fee on each transaction — building a sustainable revenue model.
3. Vendor Dashboard with Analytics
Each vendor has a protected dashboard showing their listing performance (views, clicks, inquiry count), listing management tools (create, edit, delete), and an upgrade-to-Featured option powered by Stripe.
4. Multi-Step Listing Submission
A multi-step submission form with Cloudinary drag-and-drop image upload allows vendors to create compelling listings with structured data, categories, and rich descriptions — all validated with React Hook Form + Zod.
5. Moderated Review System
Authenticated users can submit reviews on any listing they have not created themselves. Submitted reviews enter an admin moderation queue before going live — ensuring platform quality and preventing abuse.
6. Algolia Sync via Edge Functions
A Supabase Edge Function listens for insert, update, and delete events on the listings table and automatically syncs changes to Algolia — keeping search results accurate without manual indexing.
🧰 Tech Stack
| Feature Area | Technology | Purpose |
|---|---|---|
| Frontend Framework | Next.js 14 (App Router) + TypeScript | Listing pages with SSR & ISR |
| Styling | Tailwind CSS | Card grid & filter sidebar layouts |
| Search | Algolia InstantSearch | Instant search with faceted filters |
| Maps | Mapbox GL JS | Geo-filtered map view of listings |
| Forms | React Hook Form + Zod | Listing submission & validation |
| Image Uploads | Cloudinary | Drag-and-drop listing image uploads |
| Payments | Stripe Connect | Multi-vendor payouts with platform fee |
| Database | Supabase (PostgreSQL) | Listings, categories, reviews, users |
| Auth & Roles | Supabase Auth + RLS | Vendor & admin role enforcement |
| Search Sync | Supabase Edge Functions + Algolia | Auto-sync on listing changes |
| Hosting | Vercel + Edge Functions | Fast global delivery |
🗂️ Website Structure
| Page / Component | Functionality |
|---|---|
| Home | Featured listings, top categories, search bar, vendor sign-up CTA |
| Search | Algolia faceted search with Mapbox map/list toggle view |
| Listing Detail [slug] | Image gallery, description, reviews, contact form, Featured badge |
| Submit Listing | Multi-step form with Cloudinary image upload and category selection |
| Vendor Dashboard | Listing management, analytics, and Stripe Featured upgrade |
| Reviews | Moderated review submission and admin approval queue |
| Categories | Category browse pages with curated listing grids |
🔒 Key Technical Highlights
- Stripe Connect onboarding flow and multi-vendor payout configuration
- Algolia geo-search configuration with location radius and facet setup
- Cloudinary drag-and-drop upload component with image optimization
- Admin moderation queue for reviewing and approving submitted reviews
- Supabase schema: listings, categories, listing_images, reviews, vendors, featured_slots, inquiries