Project 4: E-commerce Application

[yogeshtakeo]

Task: Build a Simple E-commerce Website with React and Vite

Objective: Develop a simple e-commerce website using React and Vite, incorporating cart and wishlist functionality, login and registration pages with data flow, and a 404 error page.

Task Overview

• Set up a new React project using Vite.
• Design and implement the home page, product listing page, product details page, cart page, wishlist page, login page, registration page, and a 404 error page.
• Implement cart and wishlist functionality using React state or Redux.
• Handle login and registration data flow, either using local state management or integrating with a backend.

Task Details

1. Project Setup:

   • Set up a new React project using Vite.
   • Install necessary dependencies, including React, React Router (for routing), and any additional libraries or UI frameworks you wish to use.
   • Configure the project structure and necessary files.

2. Design and Implement Pages:

   • Design and implement the home page with product categories and featured products.
   • Create a product listing page to display products based on categories.
   • Implement a product details page to display information about a specific product.
   • Design and implement a cart page to display added items and the total amount.
   • Create a Wishlist page to allow users to add and view their Wishlist items.
   • Implement login and registration pages for user authentication.

3. Cart and Wishlist Functionality:

   • Implement cart functionality to allow users to add products to the cart, update quantities, and remove items.
   • Implement Wishlist functionality to allow users to add products to their Wishlist and view them.

4. Login and Registration Data Flow:

   • Implement data flow for login and registration pages, allowing users to sign in or register for an account.
   • If using a backend, handle user authentication and store user data securely.

5. 404 Error Page:

   • Design and implement a 404 error page to handle unknown routes and guide users back to the homepage.

6. Test and Refine:

   • Start the development server and run the React project using Vite.
   • Test the website's functionality, including cart and Wishlist features, login and registration, and handling of 404 errors.
   • Make adjustments and refinements to the design, functionality, or data flow as needed.

Task Submission

• Share the code files (App.js, ProductListing.js, ProductDetails.js, etc.) with the implemented e-commerce website, including cart and Wishlist functionality, login and registration pages, and a 404 error page.
• Optionally, provide screenshots or a live demo link showcasing the e-commerce website in action.
• Share the code files, screenshots, or links .

Building an e-commerce website is a substantial task, and it may require more time and effort than other tasks.

[ashmaupret100]

Name : Ashma Upreti
Team : Ashma and Dina
Github Link : https://github.com/ashmaupret100/ecommerce.git

[sandessth]

Team 3 : Namkhang and Sandesh Name : Sandesh git : https://github.com/Namsla/E-commerce-Application

[KabinaThapa]

Team 1 - Kabina & Jharana gitHub link - https://github.com/KabinaThapa/e-commerce.git

[babisha]

Junu and Babisha Github URL : https://github.com/babisha/ecommerce-app.git

[junuthapa011]

Team: Junu & Babisha Github Url: https://github.com/babisha/ecommerce-app.git