Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
47 changes: 40 additions & 7 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,12 +1,45 @@
This repository contains the excercise examples for the below mentioned video.<br/>
https://www.youtube.com/watch?v=lGEPmY0bOws
# React Data Grid CRUD Operations with Fetch API

This repository demonstrates how to implement server-side CRUD (Create, Read, Update, Delete) operations in a React Data Grid using Fetch API and client-side events. The project serves as a practical example of building a robust data management system with React and Express.

Learn how to perform server-side CRUD operations in the React Data Grid using Fetch API and client-side events of React Grid. In this video, you will see how to create REST APIs using the Express server and call the endpoints to a custom service using the Fetch API. Finally, learn how to bind the custom service with the React Data Grid using the dataSourceChanged event.
## Overview

To learn more about CRUD operations in the server side using AJAX, visit the following documentation.<br/>
Learn how to perform server-side CRUD operations in the React Data Grid using Fetch API and client-side events of React Grid. This implementation showcases how to create REST APIs using the Express server and call the endpoints through a custom service using the Fetch API. The project demonstrates how to bind the custom service with the React Data Grid using the dataSourceChanged event.

Watch the tutorial video: https://www.youtube.com/watch?v=lGEPmY0bOws


## Prerequisites

Before you begin, ensure you have the following installed:
- Node.js (v14 or higher)
- npm (v6 or higher)

## Installation

1. Clone the repository:
```bash
git clone https://github.com/ramyarajendran27/handling-crud-actions-using-fetch-api-and-react-grid-events.git
cd handling-crud-actions-using-fetch-api-and-react-grid-events
```

2. Install dependencies:
```bash
npm install
```

3. Start the development server:
```bash
npm start
```

## Documentation

For detailed information about CRUD operations using AJAX, visit our comprehensive documentation:
http://bit.ly/2R2TY3E

Server-side CRUD operations using DataManager video: http://bit.ly/2pWK2hf
<br/>Getting Started sample: http://bit.ly/2ONRMKJ
<br/>Server-side CRUD sample: http://bit.ly/34sNtuZ
## Additional Resources

- Server-side CRUD operations using DataManager video: http://bit.ly/2pWK2hf
- Getting Started sample: http://bit.ly/2ONRMKJ
- Server-side CRUD sample: http://bit.ly/34sNtuZ
2 changes: 1 addition & 1 deletion after/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
"@types/node": "12.11.7",
"@types/react": "16.9.10",
"@types/react-dom": "16.9.2",
"axios": ">=0.30.0",
"axios": ">=0.30.2",
"cors": "^2.8.5",
"express": "^4.17.1",
"react": "^16.11.0",
Expand Down
2 changes: 1 addition & 1 deletion before/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
"@types/node": "12.11.7",
"@types/react": "16.9.10",
"@types/react-dom": "16.9.2",
"axios": ">=0.30.0",
"axios": ">=0.30.2",
"cors": "^2.8.5",
"express": "^4.17.1",
"react": "^16.11.0",
Expand Down