ETTEU
Boutique Fragrance // E-Commerce SPA // The Art of Scented Memories
Project Overview
ETTEU is an elegant, boutique e-commerce single-page application (SPA) dedicated to small-batch luxury fragrances. Centered around the concept of “The Art of Scented Memories,” the site serves as a digital storefront for signature perfumes designed to evoke moments of quiet luxury and timeless elegance.
Tech Stack & Architecture
Frontend
Built with React and modern JavaScript (ES2020+ / JSX).
Routing
Implemented React Router (react-router-dom) for seamless, client-side page navigation without full reloads.
Styling & UI
Crafted a responsive, high-end aesthetic using vanilla CSS (heavily utilizing Flexbox and CSS Grid), co-located per component.
State Management
Bypassed heavy libraries like Redux in favor of the React Context API, creating a custom CartContext for lightweight, efficient global state management.
Data & Persistence
Engineered a serverless architecture where product data acts as a local database (products.js). The shopping cart state is persisted across sessions using browser localStorage.
Hooks & Patterns
Extensively used modern React hooks (useState, useEffect, useMemo, useContext) and developed a custom useCart() hook to keep component logic modular and clean.
Build & Tooling
Powered by Vite for lightning-fast HMR and optimized production bundling, managed via npm, and kept strictly formatted using ESLint.
Key Features & Functionality
- 01
Seamless E-Commerce Experience
A clean, intuitive shopping interface complete with a dedicated shop, persistent cart functionality, and distinct product spotlighting for signature items like the Etteu Classic, Red Rose, and Ocean Breeze.
- 02
Brand Storytelling
The design and copy seamlessly communicate the brand's high-end ethos. Taglines like “bottled like a memory” establish a strong emotional connection with the user.
- 03
Streamlined Navigation
Built with user accessibility in mind, the platform uses a straightforward navigation menu (Home, Shop, About Us, Contact) and integrated touchpoints for customer connection.