Welcome to the eCommerce Frontend project, a fully responsive web application built using React and Tailwind CSS. This project delivers a comprehensive online shopping experience with intuitive navigation and seamless functionality across all devices.

This eCommerce platform provides users with a complete shopping journey from product discovery to checkout. The application features a clean, responsive design that adapts perfectly to mobile, tablet, and desktop views, ensuring customers can shop conveniently from anywhere. Built with React and styled with Tailwind CSS, the codebase is modular, maintainable, and follows modern frontend development practices.

• Responsive Design: Fully optimized for all screen sizes with dedicated mobile and desktop layouts
• Product Discovery: Browse products by category with advanced filtering options
• Search Functionality: Find products quickly with an intuitive search interface
• Product Details: View comprehensive product information with high-quality images
• Shopping Cart: Add products to cart with quantity management
• Save for Later: Save products for future consideration
• Mobile Navigation: Smooth drawer-based navigation for mobile users

• React 18: Component-based UI development with hooks for state management
• React Router: For seamless navigation between pages
• Tailwind CSS: Utility-first styling for rapid UI development
• Context API: For global state management (cart, saved items)
• Vite: Fast, modern frontend build tool

• Node.js (v14.0.0 or later)
• npm or yarn

1. Clone the repository:

   git clone https://github.com/yourusername/ecommerce-frontend.git
   cd ecommerce-frontend

2. Install dependencies:

   npm install

3. Start the development server:

   npm run dev

4. Open your browser: The application will be available at http://localhost:5173

src/
├── assets/         # Static assets (images, icons)
├── components/     # Reusable UI components
│   ├── Cart/       # Cart-related components
│   ├── Home/       # Homepage components
│   ├── ProductDetails/ # Product detail components
│   └── ProductSearch/  # Search and filtering components
├── context/        # Global state management
├── data/           # Mock data for products
├── pages/          # Main application pages
└── App.jsx         # Main application component

• Product Browsing: Users can browse products by category, filter by price, brand, and other attributes
• Product Search: Search functionality with real-time filtering
• Product Details: Detailed product pages with specifications and pricing
• Shopping Cart: Add, remove, and update quantities of products
• Save for Later: Save products for future consideration

• User authentication and profiles
• Order processing and history
• Payment integration
• Wishlist functionality
• Product reviews and ratings

This project is an Internship Program provided by DeveloperHub.co which is situated in Islamabad.

• Muhammad Haris - Initial work and development

This project was developed as part of an internship program focused on modern frontend development practices.