Dynamic Product Categories
Multiple jewelry segments (Rings, Necklaces, Bangles, Mangalsutra, Pendants, Earrings, Chains) with dedicated sections.
Project Overview
Key Features (Main Functions):
- Dynamic Product Categories for all major jewelry types
- Real-time product search with SearchContext
- Responsive, animated UI/UX
- Cloudinary-powered media management
- Custom Contact Us form for inquiries
Technical Stack:
- Frontend: React.js, Vite, HTML5, CSS3
- Backend: Node.js, Express.js
- Database: MongoDB (MERN stack)
- State: React Context API
- Cloud: Cloudinary
Technical Highlights:
- RESTful APIs for seamless frontend-backend data flow
- SPA navigation with React Router and breadcrumbs
- Component-based, scalable codebase
- Fast builds with Vite
Project Structure:
- backend/: Server logic and Cloudinary config
- frontend/src/components/: All reusable UI components
- frontend/src/style/: Section-specific CSS modules
🎯 Project Purpose
Shyara Gold provides a premium jewelry shopping experience with high-fidelity visuals, real-time search, and secure checkout.
🛍️ Project Checkouts (Key Highlights)
Live Search Functionality
Advanced SearchContext for real-time product search across the platform.
Interactive UI/UX
Polished animations and responsive design using custom CSS and React components.
Media Management
Cloudinary integration for efficient storage and serving of high-quality jewelry images.
Contact & Inquiry System
Dedicated Contact Us form for custom user inquiries.
🧩 Technology Stack
Frontend
React.js, Vite, HTML5, CSS3
Backend
Node.js, Express.js
Cloud & Infrastructure
MongoDB (MERN stack)
📂 Project Structure
backend/: Server logic (server.js) and Cloudinary config files.
frontend/src/components/: All reusable UI components (BanglesSection, RingsSection, Home_page, etc.)
frontend/src/style/: Section-specific CSS modules for clean styling.
⭐ Why This Project Stands Out
- MERN Stack Expertise: RESTful APIs for seamless frontend-backend data flow.
- SPA Experience: React Router for smooth navigation and breadcrumbs.
- Component-Based Architecture: Easy maintenance with reusable UI components.
- Performance: Vite for fast development and production builds.