Product Catalog & Search
Full product browsing with category filtering, search, featured products, and detailed product pages with ingredients, benefits, and FAQs.
E-commerce
Health & Nutrition E-Commerce Platform
Built a full-stack nutrition brand platform with React, Express, MongoDB, Firebase auth, affiliate program, AI chatbox, and fitness tracking.
12+
Pages built
2
Auth systems (Firebase + JWT)
4
Product categories
AI
Chatbox integration
Overview
Designed and developed a complete direct-to-consumer e-commerce platform for a health and nutrition brand. The platform combines product sales with lifestyle content, an affiliate referral program, fitness tracking, and AI-powered customer support — creating a holistic brand experience beyond just shopping.
The Challenge
Health and nutrition brands need more than a standard online store. They need to build a community, educate customers about products, enable referral-based growth, and provide personalized fitness tools — all while maintaining a premium brand experience with smooth animations and engaging UI.
The Solution
Built a full-stack platform with React and Framer Motion for a dynamic, animated frontend, Express/MongoDB backend for product management and user data, Firebase for social authentication, and integrated AI chatbox for customer support. The platform includes an affiliate program, fitness tracking with body measurements, and a blog system for content marketing.
Tech Stack
Frontend
React 18TypeScriptViteReact Router DOMTailwind CSSFramer Motion
Backend
Node.jsExpressMongoDBMongoose
Authentication
Firebase (Google Auth)JWTbcryptjs
Features
React Hook FormReact MarkdownjsPDFLucide ReactReact Helmet (SEO)
Key Features
Dual Authentication
Firebase Google sign-in combined with custom JWT authentication for flexible, secure user management.
Affiliate Program
Built-in referral system with unique codes, earnings tracking, and referral attribution for organic growth.
AI Customer Support
Integrated AI chatbox providing instant product recommendations and answering customer queries.
Fitness Tracking
User profiles with body measurements, weight tracking, calorie targets, activity levels, and fitness goals.
Content & Blog System
Markdown-based blog with lifestyle content, product education, and brand storytelling.
Animated Brand Experience
Framer Motion animations throughout — hero sections, product cards, page transitions, and marquee text for premium feel.
SEO & PDF Generation
React Helmet for meta tags and dynamic SEO, plus jsPDF for generating downloadable content.
My Role
Full-Stack Developer
Full-stack development — built the React frontend with Framer Motion animations, Express/MongoDB backend, Firebase authentication integration, affiliate referral system, AI chatbox, and fitness tracking features.
Results & Impact
- Delivered a complete brand platform beyond traditional e-commerce
- Affiliate program enabling organic referral-based growth
- AI chatbox reducing customer support workload
- Fitness tracking creating personalized user engagement
- Animated UI with Framer Motion creating premium brand perception