From 832ecda946accc3f0e8da990beebae33a2205e5f Mon Sep 17 00:00:00 2001
From: Vivek Dhanade <vivek01110110@gmail.com>
Date: Tue, 4 Nov 2025 15:29:27 +0530
Subject: [PATCH] Update README with dummy data and import components

Added essential components import code as well as dummy data for easy plug and play for developers instead of fetch data
---
 README.md | 28 +++++++++++++++++++++++-----
 1 file changed, 23 insertions(+), 5 deletions(-)

diff --git a/README.md b/README.md
index fd4c1b84b..20f9fe01b 100644
--- a/README.md
+++ b/README.md
@@ -52,17 +52,35 @@ You may also need to install the peer dependencies if you don't have them alread
 npm i lodash marked react-responsive-carousel
 ```
 
+Import Grid and mandatory CSS:
+
+```ts
+import DataEditor, { GridColumn, GridCell, Item } from "@glideapps/glide-data-grid";
+import "@glideapps/glide-data-grid/dist/index.css";
+```
+
+Add dummy data:
+```shell
+const data = [
+  {
+    firstName: "John",
+    lastName: "Doe"
+  },
+  {
+    firstName: "John",
+    lastName: "Wick"
+  }
+];
+
+const numRows = data.length;
+```
+
 Create a new `DataEditor` wherever you need to display lots and lots of data
 
 ```tsx
 <DataEditor getCellContent={getData} columns={columns} rows={numRows} />
 ```
 
-Don't forget to import mandatory CSS
-
-```ts
-import "@glideapps/glide-data-grid/dist/index.css";
-```
 
 Making your columns is easy