/ecommerce-redux-practice

Primary LanguageJavaScript

Ecommerce application - Frontend

Objective

To implement an eCommerce application using Reactjs and Redux which lists all products and ability to view each product in detail. Apart from this, the user should be able to add products to the cart and then place the order

Features

  • User login

    A simple page allowing the user to enter his/her email and password to be able to login. This will put the user's entry into the users[] array in db.json file. The user's details are saved onto localstorage and are cleared when logging out image

  • List all products

    The main dashboard page which lists all the products present in db.json (products[]) array image

  • View details of a particular product

    A page to view in detail about a product such as its name,description, price, etc. image

  • Add products to cart

    This lets the user add products to the cart, whose details can be viewed by clicking on the top-right cart-icon on the navbar. At the moment, I've allowed the user to only buy 1 of each item, which means one cannot buy the same product twice at the same time. image

  • Buy product

    Once the user has added items to the cart, he/she can place the order, this data is written onto the orders[] array in db.json image

  • Favorite product

    A simple feature to allow a user to choose his/her favorite products, these details are saved onto favourites[] in db.json

Tech stack

  • ReactJS
  • TailwindCSS
  • Redux toolkit
  • json-server

Shortcomings

Owing to lack of time, the following are some of the drawbacks of this product:

  • Direct login, no signup functionality
  • Inability to add duplicates of the same product
  • Lack of clarity such as success toasts, error toasts, etc.
  • No functionality for searching and filtering of products
  • A particular user will have certain orders, for now they are not mapped, but if time permits for a user, can have orders[] which would list all orders of that particular user

Instructions to run

First, clone the repository:

git clone https://github.com/sahas-01/ecommerce-tanx.git
cd ecommerce-tanx

Install dependencies:

npm install

Run the app:

npm start

Start the server:

npm run server

This will open up the project on http://localhost:3000/ and the server will run on http://localhost:3001/