diff --git a/src/components/Books.js b/src/components/Books.js
index 4a45bce..5dad407 100644
--- a/src/components/Books.js
+++ b/src/components/Books.js
@@ -8,7 +8,6 @@ export default function Books() {
   const dispatch = useDispatch();
   const books = useSelector((store) => store.books);
   useEffect(() => {
-    // console.log('data');
     dispatch(getBooksFromServer());
   }, []);
   return (
diff --git a/src/components/sub-components/AddNewBook.js b/src/components/sub-components/AddNewBook.js
index ceab7c0..c3acde0 100644
--- a/src/components/sub-components/AddNewBook.js
+++ b/src/components/sub-components/AddNewBook.js
@@ -6,15 +6,17 @@ export default function AddNewBook() {
   const dispatch = useDispatch();
   const handleNewBookSubmit = (event) => {
     event.preventDefault();
-    const title = event.target.elements[0].value;
-    const author = event.target.elements[1].value;
-    dispatch(addBook(title, author));
+    const title = event.target.elements[0];
+    const author = event.target.elements[1];
+    dispatch(addBook(title.value, author.value));
+    title.value = '';
+    author.value = '';
   };
   return (
     <div id="add-new-book">
       <form action="#" method="POST" onSubmit={handleNewBookSubmit}>
-        <input type="text" name="title" id="title" placeholder="Book Title" />
-        <input type="text" name="author" id="author" placeholder="Book author" />
+        <input type="text" name="title" id="title" placeholder="Book Title" required />
+        <input type="text" name="author" id="author" placeholder="Book author" required />
         <button type="submit">Add Book</button>
       </form>
     </div>