WhizAuction — A Case Study

TL;DR

We built WhizAuction, a complete real-time auction platform covering web, mobile, and admin. Using Next.js, NestJS, MySQL, Redis, and Socket.IO — with BullMQ background jobs and a React Native mobile app — the platform lets users discover auctions, place live bids, track orders, and manage their profile across any device. Administrators manage the full auction lifecycle, users, categories, orders, and marketing content from a dedicated admin area. The result: a production-ready auction system with real-time bidding, automated auction end processing, in-app and push notifications, and a complete post-auction order and payment foundation.

Problem Overview

The client needed a full auction platform from scratch — one that could handle live competitive bidding, automate auction lifecycle management, and deliver a seamless experience across web and mobile. Existing solutions were either too rigid, required heavy manual admin intervention, or lacked the real-time responsiveness that live auctions demand.

• No existing platform — needed end-to-end web, mobile, and admin built from the ground up
• Live bidding required real-time price updates without users having to refresh the page
• Auction end processing had to be fully automated — manual intervention for each auction was not scalable
• Mobile bidders needed the same real-time experience as web users, across iOS and Android
• Admins needed full control over auctions, users, orders, and marketing content in one place
• Post-auction order and payment flows needed a solid foundation for future payment gateway integration

Role & Responsibilities

• Role: Full-stack development team
• Responsibilities:
  • Design and build the full platform — web frontend, REST API, real-time layer, background jobs, and admin
  • Develop the React Native mobile app for iOS and Android
  • Implement real-time bidding and live price updates via Socket.IO and Redis
  • Build automated auction lifecycle processing using BullMQ and scheduled jobs
  • Develop the complete order, payment, and notification systems
  • Build role-based access control separating standard users from administrators
  • Integrate Uploadcare for media hosting, Nodemailer for transactional email, and Firebase for push notifications
  • Deliver admin dashboard covering auctions, categories, users, orders, and marketing content

Project Context

• Industry: Online auctions and marketplace
• Purpose: Build a production-ready auction platform from scratch — covering the full bidder and admin journey across web and mobile
• Constraints: Real-time bidding reliability under concurrent load, automated auction end processing without manual intervention, consistent experience across web and mobile, and a payment foundation flexible enough to support any gateway

My Approach

We began by mapping the full auction lifecycle — from admin creation through live bidding to post-auction order generation — and identified every point where automation and real-time reliability were critical. The architecture was designed around WebSockets and Redis as the real-time backbone, with BullMQ handling all background processing so the API stayed fast and the UI stayed live. Web and mobile were developed in parallel, sharing the same API and real-time layer.

• Discovery: Mapped the complete journey for both bidders and administrators before any build work began
• Real-time first: Socket.IO with Redis adapter was established as the core bidding layer from day one — not added later
• Automated lifecycle: Scheduled jobs and BullMQ queues handle auction end processing, order creation, and notification dispatch without manual triggers
• Parallel delivery: Web and mobile built simultaneously against the same API — no divergence in feature parity

Research & Insights

Key Findings from Discovery

• Live auction users abandoned sessions when price updates required a page refresh — real-time push was non-negotiable
• Auction end processing had to be server-driven — relying on user actions to close auctions created gaps and inconsistencies
• Mobile bidders expected the same speed and live feedback as desktop — a degraded mobile experience directly reduced bid activity
• Admins needed to manage marketing content (testimonials, trusted partners) without code changes — API-driven content management was essential
• Guest browsing before sign-in significantly reduced drop-off — users needed to explore before committing to an account

Competitive Research

• Most auction platforms offered either web or mobile — very few delivered a consistent real-time experience across both from a single API
• Background job processing for auction lifecycle was rare — most competitors relied on cron jobs or manual admin actions, causing delays and errors at scale
• Admin tools on competing platforms were generic — no tailored auction lifecycle management, marketing content control, or per-auction order visibility

User Persona

• Name: Priya
• Role: Active bidder, uses both web and mobile
• Goals: Discover upcoming auctions, place bids confidently, track won items, pay quickly, and stay informed without constantly checking the app
• Pain Points: Stale prices requiring a refresh, missing auction endings, no clear view of order and payment status after winning

Information Architecture

• Public Web — Home with curated auction sections (ending soon, active, upcoming, past), featured items, trusted partners, testimonials, How it Works, About, Contact
• Auction Discovery — Browse and search auctions by category and status; active, upcoming, and past tabs with filters
• Auction Detail & Bidding — Full listing with image gallery, auction timing, current price, and live bid placement
• Real-time Bidding Layer — WebSocket room per auction; live price and status broadcast to all connected bidders on every accepted bid
• My Bids — Active, Won, and Loss views with rich auction detail and auto-refresh on updates
• Watchlist — Save and manage auctions for quick access
• Orders & Payments — Order list with status, full order detail, and payment trigger for pending orders
• Notifications — In-app notification centre with bell icon, unread counts, pagination, mark read, and push notification support via FCM
• Profile — Full profile management with structured address, company, date of birth, and profile image
• Admin Dashboard — Auctions, categories, users, orders, testimonials, and trusted partners management
• Mobile App — Full feature parity with web across iOS and Android, including onboarding, live bidding, orders, watchlist, notifications, and light/dark/system theme

Visual Language

The web platform was built with Tailwind CSS and Radix UI — responsive by default, accessible, and optimised for the density that auction browsing demands. The mobile app mirrors the web experience in layout and tone, adapted for touch — with bottom navigation for quick access to bids, orders, and watchlist, and a drawer menu for full module access. Swiper carousels handle featured auction browsing. The admin area prioritises clarity and control over visual decoration.

Wireframes & Early Ideas

Early wireframes focused on two critical moments — the live auction detail page and the admin auction creation flow. The live bidding page went through several iterations to find the right balance between price prominence, bid history, and the bid input — all needing to be visible and usable simultaneously. The mobile auction detail required particular care to ensure the bid button was always accessible without scrolling, even on smaller screens. The notification system was prototyped early to validate the bell icon, dropdown preview, and full list pattern before backend work began.

Designing Solutions

Problem: Stale prices and missed bid changes in a competitive live auction

• Built a WebSocket layer using Socket.IO with a Redis adapter — each auction has its own room and all connected clients receive live price and status updates the moment a bid is accepted
• Redis adapter ensures the real-time layer scales horizontally — multiple API instances share socket state without users on different instances missing updates
• No polling, no page refresh — the UI updates instantly for every connected bidder

Problem: Auction end processing required manual admin intervention at scale

• Built a scheduled job using that periodically finds active auctions whose end time has passed and processes them automatically — marking status, determining outcomes, creating orders, and dispatching notifications
• BullMQ queues handle reliable, asynchronous background work — retries, failure handling, and job visibility built in
• Winners and all participants are notified without any manual admin action per auction

Problem: No mobile experience for bidders on the go

• Built a full React Native mobile app for iOS and Android — same feature set as web including live bidding, orders, watchlist, notifications, and profile management
• Onboarding flow introduces new users to the app before they start; guest browsing allows exploration before sign-in
• Bottom navigation provides instant access to bids, orders, and watchlist; drawer menu covers all modules
• Light, dark, and system theme support; push notification registration via FCM

Problem: Admins needed full platform control without developer involvement

• Built a dedicated admin area with role-based access — only ADMIN-role users can access auction management, user oversight, order visibility, and marketing content
• Testimonials and trusted partner sections are fully API-driven — admins update them without any code change
• Admin dashboard covers the full auction lifecycle: draft, active, ended, and cancelled statuses with lifecycle management tools

Tech & Implementation

• Frontend (Web): Next.js 14, React 18, TypeScript — App Router structure, SEO-friendly, fast rendering
• Styling: Tailwind CSS, Radix UI, Swiper, CKEditor — responsive layout, accessible components, carousels, rich text
• Mobile: React Native — cross-platform iOS and Android with full feature parity
• Backend: NestJS 11 on Fastify, TypeScript — modular REST API, input validation, Swagger documentation
• Database: MySQL via Prisma ORM — relational model covering users, auctions, bids, orders, payments, and notifications
• Real-time: Socket.IO with Redis adapter — live auction room updates, horizontal scaling
• Background jobs: BullMQ + Redis — reliable async processing with retries and failure handling
• Scheduling: — cron-style tasks for auction end processing and notification batches
• Auth: Passport JWT, bcrypt — secure login, refresh tokens, role-based access control, API rate limiting
• Email: Nodemailer — transactional email for verification, password reset, and order updates
• Media: Uploadcare — image hosting for auction listings and profile photos
• Push: Firebase Admin (FCM) — server-initiated push for mobile and browser notifications
• API documentation: Swagger/OpenAPI — available for integrators and QA

Real-world Features & Highlights

• Live bidding → WebSocket room per auction, instant price updates for all connected bidders with no refresh
• Automated auction processing → scheduled jobs close auctions, create orders, and notify participants without manual intervention
• React Native mobile app → full feature parity across iOS and Android including live bidding, orders, watchlist, and push notifications
• My Bids → Active, Won, and Loss views with rich detail and auto-refresh on live updates
• Watchlist → save and manage auctions for quick access
• Orders & payments → complete order lifecycle with status tracking and payment trigger for pending orders
• In-app notifications → bell icon with unread count, dropdown preview, full paginated list, mark read, and push via FCM
• Admin dashboard → full auction lifecycle, categories, users, orders, and API-driven marketing content
• Guest browsing → explore auctions and content before signing in, reducing drop-off
• Light / dark / system theme → on both web and mobile

Results & Impact

• Full auction platform delivered from scratch — web, mobile, and admin — production-ready and live
• Real-time bidding works reliably across concurrent sessions — WebSocket layer with Redis scaling handles load without price drift
• Auction lifecycle fully automated — no manual admin action required to close auctions, create orders, or dispatch winner notifications
• Mobile app live on iOS and Android — bidders can participate in live auctions from any device with the same real-time experience
• Admin team manages auctions, users, orders, and marketing content independently — no developer involvement needed for day-to-day operations
• Notification system covers every key event — outbid, auction ending, won/lost, payment, and order updates — in-app and via push

Challenges & Learnings

• WebSocket scaling — ensuring all bidders on multiple API instances receive the same live updates required careful Redis adapter configuration and thorough concurrency testing
• Auction end race conditions — processing ended auctions reliably without double-processing or missed auctions under load required idempotent job design and BullMQ's built-in retry logic
• Mobile and web parity — building two frontends against the same API required disciplined API design from the start; any endpoint ambiguity surfaced differently on mobile and web
• Notification reliability — ensuring notifications were generated for every relevant event (bid, end, payment, order) without duplication required careful event-driven design across the job and scheduling layers
• Payment foundation — the order and payment data model was designed to be gateway-agnostic from day one, so production integration with Stripe, Razorpay, or PayPal can be added without restructuring

Takeaways

• Real-time is a first-class requirement: In a live auction, a one-second delay in price updates can cost a bidder the item — WebSockets and Redis had to be the foundation, not a feature added later
• Automate everything that happens at scale: Auction end processing, order creation, and notification dispatch cannot rely on manual triggers when running dozens of auctions simultaneously — background jobs are the only reliable answer
• Build once for web and mobile: A single well-designed API serving both Next.js and React Native eliminated duplication and kept feature parity effortless throughout development
• Design for gateway flexibility: Treating the payment layer as an integration point rather than a specific provider meant the platform shipped without payment dependency and can add any PSP cleanly
• Guest access reduces friction: Allowing users to browse and explore before signing in measurably reduced the barrier to entry — a small product decision with a meaningful impact on user conversion

Next Steps

• Production payment gateway integration — Stripe, Razorpay, or PayPal with webhooks, idempotent payment APIs, and refund handling
• Full-text search and faceted filters — category, price range, date, and location filtering as the auction catalogue grows
• Seller / vendor portal — dedicated seller accounts, payout statements, and bulk auction import
• Executive analytics dashboard — GMV, bid velocity, sell-through rate, and CSV export for reporting
• Anti-sniping extensions and reserve price rules — additional auction mechanics as the product matures
• Two-factor authentication and GDPR tooling — for enterprise and regulated market expansion

Client Feedback

"WhizCloud delivered a complete auction platform that we are genuinely proud of. The real-time bidding works flawlessly, the mobile app matches the web experience exactly, and the admin tools give us full control without needing to involve developers in day-to-day operations. What impressed us most was their ability to think through the architecture — the automated auction processing and notification systems work without us lifting a finger. A strong team and a strong platform."

— WhizAuction Client

Call to Action

If you are looking to build a real-time auction platform, marketplace, or bidding system across web and mobile, contact us at WhizCloud — we'd love to partner with you.