https://github.com/asrieldreemurrgm/practice_of_react_with_redux

Practical React and Redux exercise focusing on converting components from useState and Fetch API to Redux Toolkit and RTK Query. While the API previously used for data fetching is no longer online, the Redux implementation remains functional and demonstrates proper state management techniques.
https://github.com/asrieldreemurrgm/practice_of_react_with_redux

create-react-app eslint fetch-api html5 react redux redux-slice redux-toolkit redux-toolkit-query state-management typescript usedispatch useselector usestate

Last synced: about 2 months ago
JSON representation

Practical React and Redux exercise focusing on converting components from useState and Fetch API to Redux Toolkit and RTK Query. While the API previously used for data fetching is no longer online, the Redux implementation remains functional and demonstrates proper state management techniques.

• Host: GitHub
• URL: https://github.com/asrieldreemurrgm/practice_of_react_with_redux
• Owner: AsrielDreemurrGM
• Created: 2024-12-13T23:15:09.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2025-09-23T00:16:47.000Z (9 months ago)
• Last Synced: 2025-09-23T02:31:16.347Z (9 months ago)
• Topics: create-react-app, eslint, fetch-api, html5, react, redux, redux-slice, redux-toolkit, redux-toolkit-query, state-management, typescript, usedispatch, useselector, usestate
• Language: TypeScript
• Homepage: https://practice-of-react-with-redux-asrdrgm.vercel.app/
• Size: 189 KB
• Stars: 0
• Watchers: 0
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
React + Redux Practice



  Este README também está disponível em Português.





  This project is a practical exercise on using React with Redux Toolkit,

  demonstrating the conversion of components from useState and Fetch API

  to Redux and RTK Query.





  🔗 Live Demo: View on Vercel





  The API used fetches data from:




https://ebac-fake-api.vercel.app





  The API hosts mock JSON data for products.



🚀 Technologies Used



  
React

  
Redux

  
Redux Toolkit

  
RTK Query

  
TypeScript

  
Fetch API (removed)

  
React Hooks (useState, useEffect, useDispatch, useSelector)

  
HTML5

  
ESLint



📦 Installation

npm install

▶️ Running the Project

npm start

📁 Folder Highlights



  


store/ – Redux store configuration

  


slices/ – Contains individual Redux slices for cart and favorites

  


services/api.ts – RTK Query setup

  


components/ – React components consuming Redux state



🎯 Goals



  
Practice converting local state logic to Redux Toolkit.

  
Implement asynchronous data fetching using RTK Query.

  
Structure Redux logic using best practices.