diff --git a/src/App.js b/src/App.js
index 3017066..a06697a 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,19 +1,32 @@
-import React from "react";
-import Greet from "./Greet";
-const App = () => {
+import React, { useState } from "react";
+import "./App.css";
+
+const Counter = ({ counter, increment, decrement }) => {
   return (
     <div>
-      <Greet name="Sam" age="20" gender="male">
-        <p>This is a para</p>
-      </Greet>
-      <Greet name="Luna" age="15" gender="female">
-        <button>Click me</button>
-      </Greet>
-      <Greet name="John" age="18" gender="male" />
-      <Greet name="Amy" age="20" gender="female" />
-      <Greet name="xyz" age="25" gender="male" />
+      <div>Counter :{counter}</div>
+      <button onClick={increment}>+</button>
+      <button onClick={decrement}>-</button>
     </div>
   );
 };
 
+const App = () => {
+  const [counter, setCounter] = useState(0);
+  const increment = () => {
+    setCounter(counter + 1);
+  };
+
+  const decrement = () => {
+    setCounter(counter - 1);
+  };
+  return (
+    <>
+      <Counter counter={counter} increment={increment} decrement={decrement} />
+      <Counter counter={counter} increment={increment} decrement={decrement} />
+      <Counter counter={counter} increment={increment} decrement={decrement} />
+    </>
+  );
+};
+
 export default App;
diff --git a/src/Greet.js b/src/Greet.js
deleted file mode 100644
index bf19bd8..0000000
--- a/src/Greet.js
+++ /dev/null
@@ -1,16 +0,0 @@
-import React from "react";
-import "./App.css";
-
-const Greet = (props) => {
-  const { name, age, gender } = props;
-  console.log(props);
-  return (
-    <>
-      <h1 className="container">Hello {name}</h1>
-      <p>My age is {age}</p>
-      <p>My gender is {gender}</p>
-      {props.children}
-    </>
-  );
-};
-export default Greet;