From 1e412fd4e5271fe02c85c0b23f1453e97e949673 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Fri, 14 Aug 2026 10:06:48 +0100
Subject: [PATCH 01/36] complete missing closing ')' in render() for loop

---
 debugging/book-library/script.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index 75ce6c1d3..eed706fdc 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -54,7 +54,7 @@ function render() {
   let table = document.getElementById("display");
   let rowsNumber = table.rows.length;
   //delete old table
-  for (let n = rowsNumber - 1; n > 0; n-- {
+  for (let n = rowsNumber - 1; n > 0; n--) {
     table.deleteRow(n);
   }
   //insert updated row and cells

From 25d43db0bf06d90ea1bd5f7f48a12fff892a14ab Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Fri, 14 Aug 2026 10:08:37 +0100
Subject: [PATCH 02/36] correct typo in book title: Robinson Crusoe

---
 debugging/book-library/script.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index eed706fdc..14f4ec84b 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -7,7 +7,7 @@ window.addEventListener("load", function (e) {
 
 function populateStorage() {
   if (myLibrary.length == 0) {
-    let book1 = new Book("Robison Crusoe", "Daniel Defoe", "252", true);
+    let book1 = new Book("Robinson Crusoe", "Daniel Defoe", "252", true);
     let book2 = new Book(
       "The Old Man and the Sea",
       "Ernest Hemingway",

From 626dc3d37683b1d739a8352612b54bbae731f366 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Fri, 14 Aug 2026 10:15:33 +0100
Subject: [PATCH 03/36] keep delButton consistently named

---
 debugging/book-library/script.js | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index 14f4ec84b..9a18d872e 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -90,11 +90,11 @@ function render() {
 
     //add delete button to every row and render again
     let delButton = document.createElement("button");
-    delBut.id = i + 5;
-    deleteCell.appendChild(delBut);
-    delBut.className = "btn btn-warning";
-    delBut.innerHTML = "Delete";
-    delBut.addEventListener("clicks", function () {
+    delButton.id = i + 5;
+    deleteCell.appendChild(delButton);
+    delButton.className = "btn btn-warning";
+    delButton.innerHTML = "Delete";
+    delButton.addEventListener("clicks", function () {
       alert(`You've deleted title: ${myLibrary[i].title}`);
       myLibrary.splice(i, 1);
       render();

From 11cc372d19e346f6d5122fdcb7f67b311ce828ef Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Fri, 14 Aug 2026 10:16:48 +0100
Subject: [PATCH 04/36] correct event listener event name to click

---
 debugging/book-library/script.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index 9a18d872e..2bb1cd07e 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -94,7 +94,7 @@ function render() {
     deleteCell.appendChild(delButton);
     delButton.className = "btn btn-warning";
     delButton.innerHTML = "Delete";
-    delButton.addEventListener("clicks", function () {
+    delButton.addEventListener("click", function () {
       alert(`You've deleted title: ${myLibrary[i].title}`);
       myLibrary.splice(i, 1);
       render();

From 8da7a71ddfbf5e0cdee6f44c77cddac693d794f6 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Fri, 14 Aug 2026 13:07:37 +0100
Subject: [PATCH 05/36] add title in html

---
 debugging/book-library/index.html | 143 ++++++++++++------------------
 1 file changed, 55 insertions(+), 88 deletions(-)

diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html
index 23acfa71e..872dc5e99 100644
--- a/debugging/book-library/index.html
+++ b/debugging/book-library/index.html
@@ -1,96 +1,63 @@
 <!DOCTYPE html>
 <html>
-  <head>
-    <title> </title>
-    <meta
-      charset="utf-8"
-      name="viewport"
-      content="width=device-width, initial-scale=1.0"
-    />
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
-    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
-    <link
-      rel="stylesheet"
-      href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
-    />
-    <link rel="stylesheet" type="text/css" href="style.css" />
-  </head>
 
-  <body>
-    <div class="jumbotron text-center">
-      <h1>Library</h1>
-      <p>Add books to your virtual library</p>
-    </div>
+<head>
+  <title>Book Library</title>
+  <meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1.0" />
+  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
+  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
+  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" />
+  <link rel="stylesheet" type="text/css" href="style.css" />
+</head>
+
+<body>
+  <div class="jumbotron text-center">
+    <h1>Library</h1>
+    <p>Add books to your virtual library</p>
+  </div>
 
-    <button data-toggle="collapse" data-target="#demo" class="btn btn-info">
-      Add new book
-    </button>
+  <button data-toggle="collapse" data-target="#demo" class="btn btn-info">
+    Add new book
+  </button>
 
-    <div id="demo" class="collapse">
-      <div class="form-group">
-        <label for="title">Title:</label>
-        <input
-          type="title"
-          class="form-control"
-          id="title"
-          name="title"
-          required
-        />
-        <label for="author">Author: </label>
-        <input
-          type="author"
-          class="form-control"
-          id="author"
-          name="author"
-          required
-        />
-        <label for="pages">Pages:</label>
-        <input
-          type="number"
-          class="form-control"
-          id="pages"
-          name="pages"
-          required
-        />
-        <label class="form-check-label">
-          <input
-            type="checkbox"
-            class="form-check-input"
-            id="check"
-            value=""
-          />Read
-        </label>
-        <input
-          type="submit"
-          value="Submit"
-          class="btn btn-primary"
-          onclick="submit();"
-        />
-      </div>
+  <div id="demo" class="collapse">
+    <div class="form-group">
+      <label for="title">Title:</label>
+      <input type="title" class="form-control" id="title" name="title" required />
+      <label for="author">Author: </label>
+      <input type="author" class="form-control" id="author" name="author" required />
+      <label for="pages">Pages:</label>
+      <input type="number" class="form-control" id="pages" name="pages" required />
+      <label class="form-check-label">
+        <input type="checkbox" class="form-check-input" id="check" value="" />Read
+      </label>
+      <input type="submit" value="Submit" class="btn btn-primary" onclick="submit();" />
     </div>
+  </div>
+
+  <table class="table" id="display">
+    <thead class="thead-dark">
+      <tr>
+        <th>Title</th>
+        <th>Author</th>
+        <th>Number of Pages</th>
+        <th>Read</th>
+        <th></th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr>
+        <td></td>
+        <td></td>
+        <td></td>
+        <td></td>
+        <td></td>
+      </tr>
+    </tbody>
+  </table>
 
-    <table class="table" id="display">
-      <thead class="thead-dark">
-        <tr>
-          <th>Title</th>
-          <th>Author</th>
-          <th>Number of Pages</th>
-          <th>Read</th>
-          <th></th>
-        </tr>
-      </thead>
-      <tbody>
-        <tr>
-          <td></td>
-          <td></td>
-          <td></td>
-          <td></td>
-          <td></td>
-        </tr>
-      </tbody>
-    </table>
+  <script src="script.js"></script>
+</body>
 
-    <script src="script.js"></script>
-  </body>
-</html>
+</html>
\ No newline at end of file

From db875d7d3a60dad24c5b9895da015325ffc543c8 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Fri, 14 Aug 2026 13:12:37 +0100
Subject: [PATCH 06/36] fix variable name in submit() from library to myLibrary

---
 debugging/book-library/script.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index 2bb1cd07e..f2452ae2e 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -38,7 +38,7 @@ function submit() {
     return false;
   } else {
     let book = new Book(title.value, title.value, pages.value, check.checked);
-    library.push(book);
+    myLibrary.push(book);
     render();
   }
 }

From 9e96d3e42c0ea5635d21dfacac87365ead9fc768 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Fri, 14 Aug 2026 13:15:46 +0100
Subject: [PATCH 07/36] fix title being used as an author (still in render())

---
 debugging/book-library/script.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index f2452ae2e..11ead3509 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -37,7 +37,7 @@ function submit() {
     alert("Please fill all fields!");
     return false;
   } else {
-    let book = new Book(title.value, title.value, pages.value, check.checked);
+    let book = new Book(title.value, author.value, pages.value, check.checked);
     myLibrary.push(book);
     render();
   }

From c1214391795ee94d8dc7cf4c2d6558d86b615a2a Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Fri, 14 Aug 2026 13:35:20 +0100
Subject: [PATCH 08/36] add missing author validation

---
 debugging/book-library/script.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index 11ead3509..fb1447f43 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -31,6 +31,8 @@ function submit() {
   if (
     title.value == null ||
     title.value == "" ||
+    author.value == null ||
+    author.value == "" ||
     pages.value == null ||
     pages.value == ""
   ) {

From b3ed0a2862973bde008072654f74cce237b3234d Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Fri, 14 Aug 2026 13:42:59 +0100
Subject: [PATCH 09/36] fix new book read? (y/n) display in table

---
 debugging/book-library/script.js | 7 +------
 1 file changed, 1 insertion(+), 6 deletions(-)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index fb1447f43..2a4d25157 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -77,12 +77,7 @@ function render() {
     changeBut.id = i;
     changeBut.className = "btn btn-success";
     wasReadCell.appendChild(changeBut);
-    let readStatus = "";
-    if (myLibrary[i].check == false) {
-      readStatus = "Yes";
-    } else {
-      readStatus = "No";
-    }
+    let readStatus = myLibrary[i].check ? "Yes" : "No";
     changeBut.innerText = readStatus;
 
     changeBut.addEventListener("click", function () {

From 8dd9945c82b2df2514b40bff9cbab21f91eff5f9 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Fri, 14 Aug 2026 13:46:24 +0100
Subject: [PATCH 10/36] fix type input to be text for title and author in HTML

---
 debugging/book-library/index.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html
index 872dc5e99..e6ce57bb4 100644
--- a/debugging/book-library/index.html
+++ b/debugging/book-library/index.html
@@ -24,9 +24,9 @@ <h1>Library</h1>
   <div id="demo" class="collapse">
     <div class="form-group">
       <label for="title">Title:</label>
-      <input type="title" class="form-control" id="title" name="title" required />
+      <input type="text" class="form-control" id="title" name="title" required />
       <label for="author">Author: </label>
-      <input type="author" class="form-control" id="author" name="author" required />
+      <input type="text" class="form-control" id="author" name="author" required />
       <label for="pages">Pages:</label>
       <input type="number" class="form-control" id="pages" name="pages" required />
       <label class="form-check-label">

From 276fa65af0196520b4106c106224ed6c7fca7e14 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Fri, 14 Aug 2026 13:59:22 +0100
Subject: [PATCH 11/36] remove redundant code from css

---
 debugging/book-library/style.css | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/debugging/book-library/style.css b/debugging/book-library/style.css
index 302950cb8..4cd9ca897 100644
--- a/debugging/book-library/style.css
+++ b/debugging/book-library/style.css
@@ -1,7 +1,6 @@
 .form-group {
   width: 400px;
   height: 300px;
-  align-self: left;
   padding-left: 20px;
 }
 
@@ -16,4 +15,4 @@
 
 button.btn-info {
   margin: 20px;
-}
+}
\ No newline at end of file

From af09d6dd0150518642c916963e40e10b76f9c313 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sat, 15 Aug 2026 14:43:04 +0100
Subject: [PATCH 12/36] add language in html

---
 debugging/book-library/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html
index e6ce57bb4..7faac0d8b 100644
--- a/debugging/book-library/index.html
+++ b/debugging/book-library/index.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html>
+<html lang="en">
 
 <head>
   <title>Book Library</title>

From 4faebe8c3ad153d6d672666a46b8c7e78c9cbfc7 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sat, 15 Aug 2026 15:37:46 +0100
Subject: [PATCH 13/36] separate out meta tag

---
 debugging/book-library/index.html | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html
index 7faac0d8b..d23c4a769 100644
--- a/debugging/book-library/index.html
+++ b/debugging/book-library/index.html
@@ -3,7 +3,8 @@
 
 <head>
   <title>Book Library</title>
-  <meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1.0" />
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>

From fe78e545aee7e876699a58673a0b6806538fd1fe Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sat, 15 Aug 2026 15:43:25 +0100
Subject: [PATCH 14/36] remove extra rneder() in populateStorage()

---
 debugging/book-library/script.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index 2a4d25157..c748e1f16 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -16,7 +16,6 @@ function populateStorage() {
     );
     myLibrary.push(book1);
     myLibrary.push(book2);
-    render();
   }
 }
 

From fed4503fce27ae3e11694e1c683e815c38443a92 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 10:15:27 +0100
Subject: [PATCH 15/36] add min attribute to book pages

---
 debugging/book-library/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html
index d23c4a769..928f33156 100644
--- a/debugging/book-library/index.html
+++ b/debugging/book-library/index.html
@@ -29,7 +29,7 @@ <h1>Library</h1>
       <label for="author">Author: </label>
       <input type="text" class="form-control" id="author" name="author" required />
       <label for="pages">Pages:</label>
-      <input type="number" class="form-control" id="pages" name="pages" required />
+      <input type="number" class="form-control" id="pages" name="pages" min="1" required />
       <label class="form-check-label">
         <input type="checkbox" class="form-check-input" id="check" value="" />Read
       </label>

From 6ded0c06257b6672cc63af90101e28f978641110 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 10:40:11 +0100
Subject: [PATCH 16/36] rename variables to more descriptive names

---
 debugging/book-library/script.js | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index c748e1f16..151d16338 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -19,10 +19,10 @@ function populateStorage() {
   }
 }
 
-const title = document.getElementById("title");
-const author = document.getElementById("author");
-const pages = document.getElementById("pages");
-const check = document.getElementById("check");
+const titleInput = document.getElementById("title");
+const authorInput = document.getElementById("author");
+const pagesInput = document.getElementById("pages");
+const checkInput = document.getElementById("check");
 
 //check the right input from forms and if its ok -> add the new book (object in array)
 //via Book function and start render function

From 202b52005c4d6274fbcc91df26dd6c45d089a865 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 13:29:23 +0100
Subject: [PATCH 17/36] add type attribute to add new book button

---
 debugging/book-library/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html
index 928f33156..a583f5bcf 100644
--- a/debugging/book-library/index.html
+++ b/debugging/book-library/index.html
@@ -18,7 +18,7 @@ <h1>Library</h1>
     <p>Add books to your virtual library</p>
   </div>
 
-  <button data-toggle="collapse" data-target="#demo" class="btn btn-info">
+  <button type="button" data-toggle="collapse" data-target="#demo" class="btn btn-info">
     Add new book
   </button>
 

From bc7961b2f6f037e4a6987bb1283afb9a75c073d9 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 13:31:22 +0100
Subject: [PATCH 18/36] wrap inputs in form element

---
 debugging/book-library/index.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html
index a583f5bcf..eb6f6177d 100644
--- a/debugging/book-library/index.html
+++ b/debugging/book-library/index.html
@@ -23,7 +23,7 @@ <h1>Library</h1>
   </button>
 
   <div id="demo" class="collapse">
-    <div class="form-group">
+    <form id="book-form" class="form-group">
       <label for="title">Title:</label>
       <input type="text" class="form-control" id="title" name="title" required />
       <label for="author">Author: </label>
@@ -34,7 +34,7 @@ <h1>Library</h1>
         <input type="checkbox" class="form-check-input" id="check" value="" />Read
       </label>
       <input type="submit" value="Submit" class="btn btn-primary" onclick="submit();" />
-    </div>
+    </form>
   </div>
 
   <table class="table" id="display">

From e3f87fdb1020843e74bfbea1e9b7dadae61255a3 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 14:23:34 +0100
Subject: [PATCH 19/36] convert input to submit element

---
 debugging/book-library/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html
index eb6f6177d..5fd38dd8e 100644
--- a/debugging/book-library/index.html
+++ b/debugging/book-library/index.html
@@ -33,7 +33,7 @@ <h1>Library</h1>
       <label class="form-check-label">
         <input type="checkbox" class="form-check-input" id="check" value="" />Read
       </label>
-      <input type="submit" value="Submit" class="btn btn-primary" onclick="submit();" />
+      <button> type="submit" value="Submit" class="btn btn-primary"</button>
     </form>
   </div>
 

From 7509788de75cace571bc1df45fc5574f230e2453 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 14:24:34 +0100
Subject: [PATCH 20/36] add header for actions in table

---
 debugging/book-library/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html
index 5fd38dd8e..f587ea733 100644
--- a/debugging/book-library/index.html
+++ b/debugging/book-library/index.html
@@ -44,7 +44,7 @@ <h1>Library</h1>
         <th>Author</th>
         <th>Number of Pages</th>
         <th>Read</th>
-        <th></th>
+        <th>Action</th>
       </tr>
     </thead>
     <tbody>

From f325171387f394660dd90bf5b4b5fb6323724f2d Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 14:32:01 +0100
Subject: [PATCH 21/36] delete emplty table rows and add id to tbody

---
 debugging/book-library/index.html | 10 ++--------
 1 file changed, 2 insertions(+), 8 deletions(-)

diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html
index f587ea733..7bb8ffb07 100644
--- a/debugging/book-library/index.html
+++ b/debugging/book-library/index.html
@@ -47,14 +47,8 @@ <h1>Library</h1>
         <th>Action</th>
       </tr>
     </thead>
-    <tbody>
-      <tr>
-        <td></td>
-        <td></td>
-        <td></td>
-        <td></td>
-        <td></td>
-      </tr>
+    <tbody id="books-table-body">
+
     </tbody>
   </table>
 

From a61281f9dd8cbc2d9252589c8c5b47a4fa5e576f Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 14:41:18 +0100
Subject: [PATCH 22/36] add type=module to script tag

---
 debugging/book-library/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html
index 7bb8ffb07..2d0641e19 100644
--- a/debugging/book-library/index.html
+++ b/debugging/book-library/index.html
@@ -52,7 +52,7 @@ <h1>Library</h1>
     </tbody>
   </table>
 
-  <script src="script.js"></script>
+  <script src="script.js" type="module"></script>
 </body>
 
 </html>
\ No newline at end of file

From 96c8779205ae337b1470e36293d4cce680f019e3 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 14:46:58 +0100
Subject: [PATCH 23/36] fix: move button attributes inside the opening tag for
 submit button

---
 debugging/book-library/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html
index 2d0641e19..4c59a33d8 100644
--- a/debugging/book-library/index.html
+++ b/debugging/book-library/index.html
@@ -33,7 +33,7 @@ <h1>Library</h1>
       <label class="form-check-label">
         <input type="checkbox" class="form-check-input" id="check" value="" />Read
       </label>
-      <button> type="submit" value="Submit" class="btn btn-primary"</button>
+      <button type="submit" value="Submit" class="btn btn-primary"></button>
     </form>
   </div>
 

From 07a64a1f2415a1c79d627f26b5c56d17acc5632c Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 14:49:16 +0100
Subject: [PATCH 24/36] fix: add text on submit button: 'Submit'

---
 debugging/book-library/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html
index 4c59a33d8..faee35038 100644
--- a/debugging/book-library/index.html
+++ b/debugging/book-library/index.html
@@ -33,7 +33,7 @@ <h1>Library</h1>
       <label class="form-check-label">
         <input type="checkbox" class="form-check-input" id="check" value="" />Read
       </label>
-      <button type="submit" value="Submit" class="btn btn-primary"></button>
+      <button type="submit" value="Submit" class="btn btn-primary">Submit</button>
     </form>
   </div>
 

From 06ea7717ce491d29e276026c8723f5e49bec9ac0 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 14:50:22 +0100
Subject: [PATCH 25/36] fix: remove value from button element

---
 debugging/book-library/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html
index faee35038..abf2ea58c 100644
--- a/debugging/book-library/index.html
+++ b/debugging/book-library/index.html
@@ -33,7 +33,7 @@ <h1>Library</h1>
       <label class="form-check-label">
         <input type="checkbox" class="form-check-input" id="check" value="" />Read
       </label>
-      <button type="submit" value="Submit" class="btn btn-primary">Submit</button>
+      <button type="submit" class="btn btn-primary">Submit</button>
     </form>
   </div>
 

From e93ea3284b3b6ab2248f15a61365dc328ad790fd Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 15:27:17 +0100
Subject: [PATCH 26/36] update populateStorgage() to take number page values &
 condense pushing the books to the library into a single statement

---
 debugging/book-library/script.js | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index 151d16338..7e3d61ea8 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -7,15 +7,14 @@ window.addEventListener("load", function (e) {
 
 function populateStorage() {
   if (myLibrary.length == 0) {
-    let book1 = new Book("Robinson Crusoe", "Daniel Defoe", "252", true);
-    let book2 = new Book(
+    const book1 = new Book("Robinson Crusoe", "Daniel Defoe", 252, true);
+    const book2 = new Book(
       "The Old Man and the Sea",
       "Ernest Hemingway",
-      "127",
+      127,
       true
     );
-    myLibrary.push(book1);
-    myLibrary.push(book2);
+    myLibrary.push(book1, book2);
   }
 }
 

From 596c6f550291536daafb5e8b1ab050e5e49ca1c7 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 15:45:22 +0100
Subject: [PATCH 27/36] rename form input variables in submit function

---
 debugging/book-library/script.js | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index 7e3d61ea8..c5fd16f16 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -27,12 +27,12 @@ const checkInput = document.getElementById("check");
 //via Book function and start render function
 function submit() {
   if (
-    title.value == null ||
-    title.value == "" ||
-    author.value == null ||
-    author.value == "" ||
-    pages.value == null ||
-    pages.value == ""
+    titleInput.value == null ||
+    titleInput.value == "" ||
+    authorInput.value == null ||
+    authorInput.value == "" ||
+    pagesInput.value == null ||
+    pagesInput.value == ""
   ) {
     alert("Please fill all fields!");
     return false;

From 624dc39e9b964ba5277a256cbbe1d5a4d57e540f Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 15:47:33 +0100
Subject: [PATCH 28/36] remove unnecessary null checks for string inputs

---
 debugging/book-library/script.js | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index c5fd16f16..744334a9f 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -27,11 +27,8 @@ const checkInput = document.getElementById("check");
 //via Book function and start render function
 function submit() {
   if (
-    titleInput.value == null ||
     titleInput.value == "" ||
-    authorInput.value == null ||
     authorInput.value == "" ||
-    pagesInput.value == null ||
     pagesInput.value == ""
   ) {
     alert("Please fill all fields!");

From a0034601cf0b4bf90ce1ee00e50a2717a3a8f3a0 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 16:25:30 +0100
Subject: [PATCH 29/36] grab book-form and save it to variable  bookForm

---
 debugging/book-library/script.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index 744334a9f..d992509fa 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -18,6 +18,7 @@ function populateStorage() {
   }
 }
 
+const bookForm = document.getElementById("book-form");
 const titleInput = document.getElementById("title");
 const authorInput = document.getElementById("author");
 const pagesInput = document.getElementById("pages");

From 3cf13da3951ec318475f19ad4c0cb45a5f6dffb4 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 16:57:55 +0100
Subject: [PATCH 30/36] replace submit fnction with form submit event listener

---
 debugging/book-library/script.js | 27 +++++++++++++++------------
 1 file changed, 15 insertions(+), 12 deletions(-)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index d992509fa..7ce70c5f7 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -26,20 +26,23 @@ const checkInput = document.getElementById("check");
 
 //check the right input from forms and if its ok -> add the new book (object in array)
 //via Book function and start render function
-function submit() {
-  if (
-    titleInput.value == "" ||
-    authorInput.value == "" ||
-    pagesInput.value == ""
-  ) {
+bookForm.addEventListener("submit", function (e) {
+  e.preventDefault();
+
+  const title = titleInput.value.trim();
+  const author = authorInput.value.trim();
+  const pages = Number(pagesInput.value);
+  const wasRead = checkInput.checked;
+
+  if (!title || !author || !pages) {
     alert("Please fill all fields!");
-    return false;
-  } else {
-    let book = new Book(title.value, author.value, pages.value, check.checked);
-    myLibrary.push(book);
-    render();
+    return;
   }
-}
+  const book = new Book(title, author, pages, wasRead);
+  myLibrary.push(book);
+  render();
+  bookForm.reset();
+});
 
 function Book(title, author, pages, check) {
   this.title = title;

From b84a87190336fbe46047e36db7eab64cd7d42c75 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 17:13:56 +0100
Subject: [PATCH 31/36] refactor render() -clear book-table-body with innerHTML
 -append rows in order -replace innerHTML with textContent for title, author,
 pand ages

---
 debugging/book-library/script.js | 18 ++++++++----------
 1 file changed, 8 insertions(+), 10 deletions(-)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index 7ce70c5f7..59a32f08d 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -52,24 +52,22 @@ function Book(title, author, pages, check) {
 }
 
 function render() {
-  let table = document.getElementById("display");
-  let rowsNumber = table.rows.length;
-  //delete old table
-  for (let n = rowsNumber - 1; n > 0; n--) {
-    table.deleteRow(n);
-  }
+  const bookTableBody = document.getElementByID("book-table-body");
+
+  bookTableBody.innerHTML = "";
+
   //insert updated row and cells
   let length = myLibrary.length;
   for (let i = 0; i < length; i++) {
-    let row = table.insertRow(1);
+    let row = bookTableBody.insertRow();
     let titleCell = row.insertCell(0);
     let authorCell = row.insertCell(1);
     let pagesCell = row.insertCell(2);
     let wasReadCell = row.insertCell(3);
     let deleteCell = row.insertCell(4);
-    titleCell.innerHTML = myLibrary[i].title;
-    authorCell.innerHTML = myLibrary[i].author;
-    pagesCell.innerHTML = myLibrary[i].pages;
+    titleCell.textContent = myLibrary[i].title;
+    authorCell.textContent = myLibrary[i].author;
+    pagesCell.textContent = myLibrary[i].pages;
 
     //add and wait for action for read/unread button
     let changeBut = document.createElement("button");

From 769936a4cce92e0b83b76913bf043e223eed898e Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 17:40:39 +0100
Subject: [PATCH 32/36] -remove duplicate button ids, -rename buttons to
 toggleReadBtn and deleteBtn, -use textContent for button text, -add confirm()
 to check if user wants to delete a book

---
 debugging/book-library/script.js | 39 ++++++++++++++++----------------
 1 file changed, 20 insertions(+), 19 deletions(-)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index 59a32f08d..a2145750f 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -53,7 +53,6 @@ function Book(title, author, pages, check) {
 
 function render() {
   const bookTableBody = document.getElementByID("book-table-body");
-
   bookTableBody.innerHTML = "";
 
   //insert updated row and cells
@@ -69,29 +68,31 @@ function render() {
     authorCell.textContent = myLibrary[i].author;
     pagesCell.textContent = myLibrary[i].pages;
 
-    //add and wait for action for read/unread button
-    let changeBut = document.createElement("button");
-    changeBut.id = i;
-    changeBut.className = "btn btn-success";
-    wasReadCell.appendChild(changeBut);
-    let readStatus = myLibrary[i].check ? "Yes" : "No";
-    changeBut.innerText = readStatus;
+    //read/unread toggle button
+    const toggleReadBtn = document.createElement("button");
+    toggleReadBtn.className = "btn btn-success";
+    toggleReadBtn.textContent = myLibrary[i].check ? "yes" : "no";
+    wasReadCell.appendChild(toggleReadBtn);
 
-    changeBut.addEventListener("click", function () {
+    toggleReadBut.addEventListener("click", function () {
       myLibrary[i].check = !myLibrary[i].check;
       render();
     });
 
-    //add delete button to every row and render again
-    let delButton = document.createElement("button");
-    delButton.id = i + 5;
-    deleteCell.appendChild(delButton);
-    delButton.className = "btn btn-warning";
-    delButton.innerHTML = "Delete";
-    delButton.addEventListener("click", function () {
-      alert(`You've deleted title: ${myLibrary[i].title}`);
-      myLibrary.splice(i, 1);
-      render();
+    //delete button with confirmation prompt
+    const deleteBtn = document.createElement("button");
+    deleteBtn.className = "btn btn-warning";
+    deleteBtn.textContent = "Delete";
+    deleteCell.appendChild(deleteBtn);
+
+    deleteBtn.addEventListener("click", function () {
+      const confirmDel = confirm(
+        `Are you sure you want to delete "${myLibrary[i].title}"?`
+      );
+      if (confirmDel) {
+        myLibrary.splice(i, 1);
+        render();
+      }
     });
   }
 }

From 61a0126c4cf4ef2959ea575bab1ddfd5329a5822 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 17:43:05 +0100
Subject: [PATCH 33/36] change let to const where possible

---
 debugging/book-library/script.js | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index a2145750f..a16de660d 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -1,4 +1,4 @@
-let myLibrary = [];
+const myLibrary = [];
 
 window.addEventListener("load", function (e) {
   populateStorage();
@@ -56,14 +56,14 @@ function render() {
   bookTableBody.innerHTML = "";
 
   //insert updated row and cells
-  let length = myLibrary.length;
+  const length = myLibrary.length;
   for (let i = 0; i < length; i++) {
-    let row = bookTableBody.insertRow();
-    let titleCell = row.insertCell(0);
-    let authorCell = row.insertCell(1);
-    let pagesCell = row.insertCell(2);
-    let wasReadCell = row.insertCell(3);
-    let deleteCell = row.insertCell(4);
+    const row = bookTableBody.insertRow();
+    const titleCell = row.insertCell(0);
+    const authorCell = row.insertCell(1);
+    const pagesCell = row.insertCell(2);
+    const wasReadCell = row.insertCell(3);
+    const deleteCell = row.insertCell(4);
     titleCell.textContent = myLibrary[i].title;
     authorCell.textContent = myLibrary[i].author;
     pagesCell.textContent = myLibrary[i].pages;

From e997b5e34900bc85cddd2fbb87e97520737ebb63 Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 17:51:04 +0100
Subject: [PATCH 34/36] enforce valid integer for pages in html and js

---
 debugging/book-library/index.html | 2 +-
 debugging/book-library/script.js  | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html
index abf2ea58c..bf07ab3a8 100644
--- a/debugging/book-library/index.html
+++ b/debugging/book-library/index.html
@@ -29,7 +29,7 @@ <h1>Library</h1>
       <label for="author">Author: </label>
       <input type="text" class="form-control" id="author" name="author" required />
       <label for="pages">Pages:</label>
-      <input type="number" class="form-control" id="pages" name="pages" min="1" required />
+      <input type="number" class="form-control" id="pages" name="pages" min="1" step="1" required />
       <label class="form-check-label">
         <input type="checkbox" class="form-check-input" id="check" value="" />Read
       </label>
diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index a16de660d..9999edef7 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -34,8 +34,8 @@ bookForm.addEventListener("submit", function (e) {
   const pages = Number(pagesInput.value);
   const wasRead = checkInput.checked;
 
-  if (!title || !author || !pages) {
-    alert("Please fill all fields!");
+  if (!title || !author || !Number.isInteger(pages) || pages <= 0) {
+    alert("Please fill all fields with valid information!");
     return;
   }
   const book = new Book(title, author, pages, wasRead);

From 2cade972427d6239ec011c6a7855de6a09f0985b Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 18:08:18 +0100
Subject: [PATCH 35/36] correct typo and ensure book-table-body matches the js
 DOM reference

---
 debugging/book-library/index.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html
index bf07ab3a8..5c89812d5 100644
--- a/debugging/book-library/index.html
+++ b/debugging/book-library/index.html
@@ -31,7 +31,7 @@ <h1>Library</h1>
       <label for="pages">Pages:</label>
       <input type="number" class="form-control" id="pages" name="pages" min="1" step="1" required />
       <label class="form-check-label">
-        <input type="checkbox" class="form-check-input" id="check" value="" />Read
+        <input type="checkbox" class="form-check-input" id="check" name="check" />Read
       </label>
       <button type="submit" class="btn btn-primary">Submit</button>
     </form>
@@ -47,7 +47,7 @@ <h1>Library</h1>
         <th>Action</th>
       </tr>
     </thead>
-    <tbody id="books-table-body">
+    <tbody id="book-table-body">
 
     </tbody>
   </table>

From 03993a08a074eeb1f52139d0c9ea7a2e7ccc7f3e Mon Sep 17 00:00:00 2001
From: Edina Kurdi <edina.kurdi@gmail.com>
Date: Sun, 16 Aug 2026 19:04:15 +0100
Subject: [PATCH 36/36] fix typos

---
 debugging/book-library/script.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js
index 9999edef7..5e7231f99 100644
--- a/debugging/book-library/script.js
+++ b/debugging/book-library/script.js
@@ -52,7 +52,7 @@ function Book(title, author, pages, check) {
 }
 
 function render() {
-  const bookTableBody = document.getElementByID("book-table-body");
+  const bookTableBody = document.getElementById("book-table-body");
   bookTableBody.innerHTML = "";
 
   //insert updated row and cells
@@ -74,7 +74,7 @@ function render() {
     toggleReadBtn.textContent = myLibrary[i].check ? "yes" : "no";
     wasReadCell.appendChild(toggleReadBtn);
 
-    toggleReadBut.addEventListener("click", function () {
+    toggleReadBtn.addEventListener("click", function () {
       myLibrary[i].check = !myLibrary[i].check;
       render();
     });