Full-StackFrontend2025
AR Soap & Detergent
A modern eco-friendly soap and detergent e-commerce site built with Next.js 16. Features full-screen video backgrounds, animated product cards, a shopping cart with promo codes, and 12 products across 4 categories.
https://arsoap.vercel.app
Fullscreen Technologies & Tools
Next.jsReact 19Tailwind CSS 4Framer Motionshadcn/uiEmbla Carousel
Project Case Study
The Challenge
A local soap and detergent brand needed a modern e-commerce presence showcasing eco-friendly products in a visually compelling way without a heavy backend.
The Solution
Built with Next.js 16 App Router and Framer Motion. Each product has a dedicated video, category pages have dynamic video backgrounds, and the cart supports promo codes and a free shipping threshold — all managed via React Context.
The Outcome
Video-first product presentation across 12 products and 4 categories. Fully responsive with dark/light mode, deployed on Vercel.