first commit

src/App1.jsx

@@ -0,0 +1,44 @@
+import { useState } from "react";
+import { data } from "./data";
+
+function App1() {
+  const [books, setBooks] = useState(data);
+  const clearList = () => {
+    setBooks([]);
+  };
+
+  const resetList = () => {
+    setBooks(data);
+  };
+
+  return (
+    <>
+      <h2>Advanced Web Development</h2>
+      <h3>Reducer</h3>
+
+      <div>
+        <h4>Books by JK Rowling</h4>
+        <button onClick={clearList}>Clear list</button>
+        {books.items ? (
+          books.items.map((book) => {
+            const { id, volumeInfo } = book;
+            return (
+              <article key={id}>
+                <h3>{volumeInfo.title}</h3>
+                <h4>{volumeInfo.publisher}</h4>
+                <p>{volumeInfo.description}</p>
+              </article>
+            );
+          })
+        ) : (
+          <>
+            <h3>No book is found</h3>
+            <button onClick={resetList}>RESET</button>
+          </>
+        )}
+      </div>
+    </>
+  );
+}
+
+export default App1;