Fashion & Apparel House is a cutting-edge e-commerce web application that brings together the finest fashion brands in one convenient place. With a responsive design for mobile, tablet, and desktop users, it offers a seamless shopping experience. This README provides an overview of the project from a developer's perspective.
- Introduction
- Features
- Technologies Used
- Getting Started
- Authentication
- Admin Panel
- Responsive Design
- Cart Management
- Contributing
- License
Fashion & Apparel House is a feature-rich web app built using React for the frontend, Node.js with Express for the backend, and MongoDB Atlas as the database. It offers a unified platform for users to shop from top fashion brands like Zara, H&M, Gucci, Adidas, Nike, and more.
-
User-Friendly Navigation: The website features a top navbar for easy navigation to essential pages, including login, sign-up, and the user's shopping cart.
-
Latest Deals Banner: A visually appealing banner on the homepage showcases the latest deals from various brands.
-
Brand Showcase: Brand cards on the homepage allow users to explore specific brands, including promotions and products.
-
Featured Sections: The homepage features three dynamic sections: "Best Sellers of the Week," "Trending Products," and a section dedicated to women's products. These sections randomly shuffle products on each page load, keeping the content fresh.
-
Product Details: Users can view product details, including price, description, and more. 📦
-
Cart Management: Users can add products to their cart and view all carted items in the "My Cart" route. The total price, discounts, taxes, and delivery charges are calculated and shown. 🛒
-
Authentication: The website offers secure authentication using Firebase, allowing users to sign in with Google or use email and password authentication. Access to brand product categories and private routes is restricted to authenticated users.
-
Admin Panel: An exclusive admin panel provides administrators with the ability to update existing products, add new products for each brand, and manage advertising banners and sliders.
-
Responsive Design: Fashion & Apparel House is responsive and optimized for various devices, ensuring a seamless shopping experience on mobile, tablet, and desktop.
-
Contact Information: The website's footer includes a map, address, and a contact form for user inquiries. 📞
- Frontend: React
- Backend: Node.js, Express
- Database: MongoDB Atlas
- Authentication: Firebase
- Styling: CSS
- Deployment: Firebase Hosting
To set up this project locally, follow these steps:
- Clone the repository.
- Navigate to the project's root directory.
- Install dependencies using
npm installfor both the frontend and backend. - Configure your environment variables.
- Run the frontend and backend using
npm start.
Fashion & Apparel House utilizes Firebase for authentication. Follow these steps to set up Firebase for your project:
- Create a Firebase project on the Firebase Console.
- Set up authentication methods for Google and email/password.
- Add your Firebase configuration in the project code.
The admin panel is accessible through a private route, enabling administrators to manage product data and advertising content.
To access the admin panel, log in as an admin and visit /admin on the website.
Fashion & Apparel House is designed to provide an optimal shopping experience across all devices. The responsive design ensures that users on mobile, tablet, and desktop have a consistent and user-friendly interface.
Users can add products to their cart and view all carted items in the "My Cart" route. The total price, discounts, taxes, and delivery charges are calculated and shown.
Contributions to this project are welcome. If you have suggestions or want to report issues, please open a GitHub issue or submit a pull request.