July 1, 2026

24wigs E-Commerce Site

24wigs is a responsive e-commerce storefront built for a wig and hair brand, from browsing the catalog through to cart. The focus has been on getting the shopping experience right — clean product pages, a filterable catalog, and a smooth cart flow — using React and Next.js.

🔗 Live Demo

View the live site →

🧩 Features

Category browsing across HD Wigs, Frontals & Closures, 613 Blonde, and Accessories
Filterable “Shop All” catalog page with category and style filters
Product detail pages with quantity selection and add to cart
Persistent cart with quantity controls and order subtotal
Campus-focused delivery messaging (free delivery on campus orders over a set amount)
Fully responsive, mobile-first layout with a soft, boutique-style visual identity

💡 Technologies used

React
Next.js
Tailwind CSS
Supabase — backend and data
Vercel — hosting and deployment

🖼️ A Look Around the Site

Homepage:

Homepage of 24wigs showing a hero banner with the tagline "Welcome to 24wigs" and a shop now button

Product highlights:

Products section of 24wigs showing a grid of wig and hair products including HD wigs, bundles, and frontals with prices

Shop All catalog:

Shop All page of 24wigs with category and style filters alongside a grid of products

Product detail:

Product detail page for the Body Wave Lace Front wig showing price, description, and an add to cart button

Cart:

Cart page showing a selected product, quantity controls, and an order subtotal with a proceed to checkout button

🎯 What I Learned

Building a storefront for a brand this visual meant the design details carried as much weight as the functionality — getting the catalog filtering, cart state, and product pages feeling smooth and consistent with the brand’s aesthetic across every screen size.

🚀 Built by Ebenezer Asamoah-Addo (Kwabena).