https://github.com/kuzhalikumaraguru/reactd10crudtask
CRUD using AXIOS in React.js
https://github.com/kuzhalikumaraguru/reactd10crudtask
async-await axios browser-router http-methods reacrjs react-bootstrap react-router-dom toastify try-catch useeffect-hook usenavigate-hook useparams-hook usestate-hook
Last synced: 3 months ago
JSON representation
CRUD using AXIOS in React.js
- Host: GitHub
- URL: https://github.com/kuzhalikumaraguru/reactd10crudtask
- Owner: kuzhalikumaraguru
- Created: 2024-01-07T14:37:05.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-01-09T06:39:57.000Z (almost 2 years ago)
- Last Synced: 2025-02-21T22:34:39.893Z (9 months ago)
- Topics: async-await, axios, browser-router, http-methods, reacrjs, react-bootstrap, react-router-dom, toastify, try-catch, useeffect-hook, usenavigate-hook, useparams-hook, usestate-hook
- Language: JavaScript
- Homepage: https://b53-react-axios-crud-d10.netlify.app/
- Size: 55.7 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
1. Blog website - Helds Dashboard, Home , Create and Edit page
2. Home - Approved blogs - Listed blogs which has been approved from Dashboard
3. Dashboard - Created blogs will be listed out in the table with ststus and actions - Axios - Get method used
5. Create - Blogs can be created here - Axios - post method used
6. Edit - Blogs can be edited - Axios - put method used
7. Delete - Axios - delete method used
8. All hooks has been used here except useLocation
9. Dependencies need to be install - Axios , Toastify , react-bootstrap, react-router-dom
10. Routes are used in the form of array with createBrowserRoutes
-> Redux tool used here
-> Implementing React Redux
1. npm install @reduxjs/toolkit react-redux
2. Creating the Store
3. Provide the Redux Store to React in main.jsx
4. Create a Redux State Slice
a. Set Name, Initial state
b. Define all your reducers
c. Export the Actions and Reducer of the State Slice
5. Import reducer and add it in the store
6. Install Redux dev tools in chrome as extentions
7. Use the reducers wherever required in component
8. Use useSelector to get your state
9. Use useDispatch to call your actions