SK Logo

ProjectsKiriku

Kiriku

Multi-Role Marketplace & Real-Time Booking Platform

Next.jsTypeScriptTailwind CSSLaravelMySQLStripeLaravel EchoPusher.jsReact Hook FormZod

Team Size: 04 Developers

My Role: Frontend Developer

Case Study Overview

Kiriku is a modern Next.js-based marketplace and service platform that supports products, services, events, and rentals. It includes a full booking system, real-time chat, payment integration, and role-based dashboards for users and providers.

Project Overview

A scalable multi-role platform combining marketplace, booking, payments, and real-time communication.

Highlights

  • Multi-role marketplace (User / Provider / Admin)
  • Real-time chat and notification system
  • Booking and reservation management system
  • Integrated payment flow
  • Scalable dashboard architecture

Features

Marketplace System

  • ›Products, services, events, and rentals support
  • ›Advanced filtering and browsing system
  • ›Dynamic product/service rendering

Booking System

  • ›Multi-step booking flow
  • ›Reservation management
  • ›Status tracking and history
  • ›Provider confirmation system

Real-Time Communication

  • ›Live chat between users and providers
  • ›Real-time notifications system
  • ›Pusher + Laravel Echo integration

Payments & Transactions

  • ›Secure payment integration
  • ›Order/payment tracking
  • ›Transaction history system

User System

  • ›Authentication and role-based access
  • ›Profile management
  • ›Dashboard for users and providers

My Responsibilities

  • Built full frontend using Next.js and TypeScript
  • Implemented multi-role architecture (user, provider, admin)
  • Developed booking and marketplace UI system
  • Integrated real-time messaging and notifications
  • Handled form validation using React Hook Form + Zod
  • Built reusable and scalable component system

UI System

  • shadcn/ui + Radix UI component library
  • Custom animated UI components
  • Responsive dashboard layouts
  • Reusable design system architecture

    • Architecture

  • Modular Next.js folder structure
  • Component-based scalable architecture
  • Separation of UI and business logic
  • Role-based routing system

    • Performance

  • Lazy-loaded routes and components
  • Optimized API communication
  • Efficient state handling
  • Smooth real-time updates

    • State Management

  • Custom hooks for state handling
  • React Hook Form for forms
  • Zod schema validation
  • Controlled and reusable state patterns

    • Results

  • ✦Fully functional multi-role marketplace platform
  • ✦Real-time chat and notification system
  • ✦Scalable booking and payment architecture
  • ✦Smooth and responsive UI experience

    • Summary

    A full-featured marketplace and booking platform with real-time communication, payments, and scalable multi-role architecture built using Next.js.

    Live system is publicly accessible. Source code is private and not publicly available.

    Project Details

    My Role

    Frontend Developer

    Project Type

    E-commerce Production Project

    View Project

    Full Tech Stack

    Frontend

    Next.jsTypeScriptTailwind CSSFramer Motionlucide-reactshadcn/ui

    Backend

    LaravelPHP

    Database

    MySQL

    Forms & Validation

    React Hook FormZod

    Payments

    Stripe

    Realtime

    Laravel EchoPusher.js

    Maps & Location

    Google Maps API

    Security & Sanitization

    DOMPurify

    UI & Feedback

    Sonner