Regal E-Commerce Platform

Overview

A full-featured storefront backed by FakeStoreAPI for product data, with Stripe handling checkout and an AI-assisted product recommendation layer.

Technical Challenges

Stripe Webhook Reliability

Payment state (pending → paid → fulfilled) is driven by Stripe webhooks rather than redirect URLs, since redirects can be closed before firing. Implemented idempotent webhook handlers keyed on Stripe event IDs to handle duplicate deliveries safely.

Cart State Management

Cart state is persisted to localStorage and reconciled on session restore to survive page refreshes without requiring a backend cart service. Merge logic handles the edge case where a user adds items as a guest, then authenticates with an existing account that carries its own cart.

AI Recommendations

Used the OpenAI API to generate product recommendations from cart contents by embedding the current cart items and performing a similarity lookup against product descriptions, surfaced as a "You might also like" component.

API Data Normalisation

FakeStoreAPI returns inconsistent category casing and missing fields on some items. Added a normalisation layer at the fetch boundary so the rest of the app works against a stable, typed product schema rather than defensive checks scattered throughout the UI.