Scribd
Upload
71 views2 pages

Task 1 - E-Commerce Product Listing

The document outlines the requirements for building a basic e-commerce platform using the MERN stack and Redux for cart state management. Key features include a product listing page, cart page, and order placement functionality, along with backend APIs for product retrieval, cart management, and order processing. Optional bonus features include user authentication, LocalStorage for cart persistence, and product filters and sorting options.

Uploaded by

anuj.k
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
71 views2 pages

Task 1 - E-Commerce Product Listing

The document outlines the requirements for building a basic e-commerce platform using the MERN stack and Redux for cart state management. Key features include a product listing page, cart page, and order placement functionality, along with backend APIs for product retrieval, cart management, and order processing. Optional bonus features include user authentication, LocalStorage for cart persistence, and product filters and sorting options.

Uploaded by

anuj.k
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

Task 1: E-commerce Product Listing

🛠 Task Description:
You need to build a basic e-commerce platform where users can browse products, add
products to the cart, and place an order. The project should be developed using the MERN
stack (MongoDB, Express.js, React.js, Node.js), and Redux must be used for managing the
cart state.

📌 Requirements:
Frontend (React.js + Redux)

1.​ Product Listing Page


○​ Fetch and display all products from the backend.
○​ Each product should have a name, price, and image.
○​ Users should be able to click "Add to Cart" for any product.
2.​ Cart Page
○​ Display all added products from the cart.
○​ Users should be able to remove products from the cart.
○​ Show the total price of items in the cart.
3.​ Order Placement
○​ Users should be able to click a "Place Order" button that sends the cart data to
the backend.
○​ After placing an order, the cart should be cleared.
4.​ State Management (Redux)
○​ Use Redux Toolkit to manage the cart state.
○​ Store cart items globally using Redux.
○​ Ensure data persists across page reloads.

Backend (Node.js + Express.js + MongoDB)

1.​ Product API


○​ Create an API endpoint (GET /products) to return all products from the
database.
2.​ Cart API
○​ Create an API endpoint (POST /cart) to add products to the cart (temporary
storage).
3.​ Order API
○​ Create an API endpoint (POST /order) to save the order details in the
database.

🔹 Bonus Features (Optional but recommended)


●​ User Authentication: Implement user login/signup using JWT.
●​ LocalStorage: Store cart data in LocalStorage for persistence.
●​ Filters & Sorting: Add filters (e.g., price range, category) and sorting options for
products.

Expected Outcome:

By the end of this task, you should have a functional e-commerce app where users can browse
products, add them to the cart using Redux, and place an order. The backend should handle
product retrieval, cart storage, and order processing.

🎯 Tech Stack: React.js, Redux Toolkit, Node.js, Express.js, MongoDB


​

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy