SyncfusionExamples · sridhar-alagirisamy · Apr 27, 2026 · Apr 27, 2026 · Apr 27, 2026
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/README.md b/README.md
@@ -1,15 +1,29 @@
 # Getting Started with the React Spreadsheet Component
 
-A quick-start project that shows how to create and configure the Syncfusion React Spreadsheet component. This project also contains code example to configure a few of the control’s basic features like data-binding, importing, and exporting Excel documents.
+A quick-start project that helps you create and configure the Syncfusion React Spreadsheet component. This project enables users to clone and run the app easily to explore Spreadsheet features.
 
-Documentation: https://ej2.syncfusion.com/react/documentation/spreadsheet/getting-started/
+## Documentation
 
-Online examples: https://ej2.syncfusion.com/react/demos/#/bootstrap5/spreadsheet/default
+- Getting Started Guide: https://help.syncfusion.com/document-processing/excel/spreadsheet/react/getting-started
+- Online Demo: https://document.syncfusion.com/demos/spreadsheet-editor/react/#/tailwind3/spreadsheet/default
+- Tutorial Videos: https://www.syncfusion.com/tutorial-videos/react/spreadsheet
 
-## Project prerequisites
+## Project Prerequisites
 
-Make sure that you have the latest versions of NodeJS and Visual Studio Code in your machine before starting to work on this project.
+- Node.js(v14.15.0 or higher)
+- npm or yarn
+- React (latest stable)
 
-### How to run this application?
+## How to run this application?
 
-To run this application, you need to clone the `getting-started-with-the-react-spreadsheet-component` repository and then open it in Visual Studio Code. Now, simply install all the necessary react packages into your current project using the `npm install` command and run your project using the `npm start` command.
+1. Clone the repository.
+2. Open the project in Visual Studio Code.
+3. Install the required dependencies using:
+   ```
+   npm install
+   ```
+4. Run the application using:
+   ```
+   npm start
+   ```
+5. Open http://localhost:3000 in your browser.
diff --git a/eslint.config.js b/eslint.config.js
@@ -0,0 +1,21 @@
+import js from '@eslint/js'
+import globals from 'globals'
+import reactHooks from 'eslint-plugin-react-hooks'
+import reactRefresh from 'eslint-plugin-react-refresh'
+import { defineConfig, globalIgnores } from 'eslint/config'
+
+export default defineConfig([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{js,jsx}'],
+    extends: [
+      js.configs.recommended,
+      reactHooks.configs.flat.recommended,
+      reactRefresh.configs.vite,
+    ],
+    languageOptions: {
+      globals: globals.browser,
+      parserOptions: { ecmaFeatures: { jsx: true } },
+    },
+  },
+])
diff --git a/index.html b/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>spreadsheet-app</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.jsx"></script>
+  </body>
+</html>
diff --git a/package.json b/package.json
@@ -1,44 +1,28 @@
 {
-  "name": "myreactapp",
-  "version": "0.1.0",
+  "name": "spreadsheet-app",
   "private": true,
-  "dependencies": {
-    "@syncfusion/ej2-react-spreadsheet": "^20.1.47",
-    "@testing-library/jest-dom": "^5.16.4",
-    "@testing-library/react": "^12.1.4",
-    "@testing-library/user-event": "^13.5.0",
-    "@types/jest": "^27.4.1",
-    "@types/node": "^16.11.26",
-    "@types/react": "^17.0.43",
-    "@types/react-dom": "^17.0.14",
-    "react": "^18.0.0",
-    "react-dom": "^18.0.0",
-    "react-scripts": "5.0.0",
-    "typescript": "^4.6.3",
-    "web-vitals": "^2.1.4"
-  },
+  "version": "0.0.0",
+  "type": "module",
   "scripts": {
-    "start": "react-scripts start",
-    "build": "react-scripts build",
-    "test": "react-scripts test",
-    "eject": "react-scripts eject"
+    "dev": "vite",
+    "build": "vite build",
+    "lint": "eslint .",
+    "preview": "vite preview"
   },
-  "eslintConfig": {
-    "extends": [
-      "react-app",
-      "react-app/jest"
-    ]
+  "dependencies": {
+    "@syncfusion/ej2-react-spreadsheet": "^33.2.3",
+    "react": "^19.2.5",
+    "react-dom": "^19.2.5"
   },
-  "browserslist": {
-    "production": [
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
+  "devDependencies": {
+    "@eslint/js": "^10.0.1",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^6.0.1",
+    "eslint": "^10.2.1",
+    "eslint-plugin-react-hooks": "^7.1.1",
+    "eslint-plugin-react-refresh": "^0.5.2",
+    "globals": "^17.5.0",
+    "vite": "^8.0.10"
   }
 }
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/favicon.svg b/public/favicon.svg
diff --git a/public/icons.svg b/public/icons.svg