All Projects
PROJECT
Full Stack Developer

Cyber Mart

A high-performance multi-vendor e-commerce marketplace built with Next.js, Node.js, and Express.js, focused on scalable storefronts, real-time inventory workflows, and production-ready buyer and vendor experiences.

View LiveAll Projects

Tech Stack

Next.jsTypeScriptNode.jsExpress.jsMySQLMongoDBREST APIsMaterial UITailwind CSSReact Hook FormSWRJestAWSDockerCI/CD
Cyber Mart 1
Cyber Mart 2
Cyber Mart 3

Status

Production Ready

Type

Enterprise platform

Developed marketplace frontend with Next.js using SSR for SEO and performance, achieving 95+ Lighthouse scores.

Built scalable backend API using Node.js and Express.js, handling high-traffic events with efficient routing.

Designed and optimized MySQL database schemas, improving query performance by 40%.

Integrated third-party payment and inventory providers via secure REST API endpoints.

Created responsive, WCAG-aligned UI components with Material UI and Tailwind CSS.

Implemented form validation and submission flows with React Hook Forms, reducing errors by 30%.

Integrated SWR for real-time inventory and pricing updates across transactional workflows.

Configured CI/CD pipelines with automated testing and AWS deployment.

Cyber Mart

Overview

Cyber Mart is a multi-vendor marketplace designed to support large catalogs, complex inventory workflows, and high-traffic transactional experiences. The product combined SEO-friendly storefront delivery, vendor-facing operational tooling, and scalable backend services so that merchants could manage inventory and shoppers could move from discovery to checkout without friction.

Business Context

The marketplace needed to support multiple vendors operating inside one platform while preserving a cohesive buying experience. That meant solving for:

  • ›fast product discovery and search-heavy navigation
  • ›scalable category and product page rendering
  • ›reliable pricing and inventory synchronization
  • ›conversion-friendly cart and checkout flows
  • ›administrative visibility into catalog and vendor operations

What I Built

  • ›Built the marketplace frontend in Next.js with SSR-focused page strategies for category, product detail, and marketing entry points.
  • ›Developed reusable UI primitives and feature components using Material UI and Tailwind CSS for speed and consistency.
  • ›Integrated Node.js and Express.js APIs for product, vendor, order, and operational workflows.
  • ›Designed and refined MySQL schemas, indexing strategy, and query patterns to improve performance on catalog-heavy pages.
  • ›Used SWR and targeted refresh patterns to keep inventory- and pricing-sensitive interfaces current.
  • ›Implemented form validation and submission flows with React Hook Form, reducing friction in buyer and vendor interactions.

Architecture Highlights

Frontend

The frontend was structured around reusable marketplace modules, server-rendered entry points, and responsive interfaces that could handle product density without overwhelming performance budgets.

Backend

The backend exposed secure REST-based services for product, order, and operational workflows, designed to remain resilient under peak event traffic.

Data Layer

The data model had to support vendor-specific inventory, platform-wide discovery, and transactional integrity. Query optimization and index design were key to keeping product retrieval and order workflows fast as the catalog expanded.

Key Outcomes

  • ›95+ Lighthouse scores on important storefront pages
  • ›40% improvement in key database query performance
  • ›30% reduction in user input errors through stronger validation and clearer UI feedback
  • ›scalable groundwork for high-traffic marketplace activity and vendor growth

Engineering Takeaways

Building Cyber Mart reinforced how closely performance, data modeling, and UX quality are linked in e-commerce. The strongest gains came from solving the full system together: rendering strategy, API design, query performance, and transaction-focused interface design.