Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Cart Project using React with Redux Toolkit

NotificationsYou must be signed in to change notification settings

pktcodes/cart-redux-toolkit-react-project-v2

Repository files navigation

PROD [Live] :https://react-redux-toolkit-cart-v2-prod.netlify.app/

Cart consists of a straightforward user interface where there is a

  • List of some of the items added to the cart,Navbar with the titleRedux Toolkit ,cart amount i.e. total number of items added by default, and aCLEAR CART button which upon click triggers a pop-up modal with few options i.e.,CONFIRM to clear all items in the cart, closes the modal and displaysYOUR BAG is currently empty orCANCEL to close the modal
  • Each cartItem has theimage ,title ,price ,amount, along with a few buttons i.e.remove to remove the item from the cart, 🔼 to increase , 🔽 to decrease the amount of that particular item and when the item amount gets less than 1, it is automatically removed from the cart.
  • For every change in cartItem, thetotal price andcart amount gets adjusted.
  • Data is handled bydata.js, and styles are handled byindex.css
  • To run the project locally, clone the repo,npm install to install the dependencies, andnpm run dev to start up the development server on default port 5173.

Languages

HTML, CSS, JavaScript, ECMAScript, React - Hooks ~ useEffect, Redux Toolkit - createAsyncThunk

Deployment / Hosting

Netlify


Note: I have developed this project ~ [22] as part of the React 18 Tutorial and Projects Course (2023) taught by John Smilga.


[8]ページ先頭

©2009-2025 Movatter.jp