Submission for assignment 1

[nhuthm-setel]

• Demo link: https://nhuthuynh-df-frontend-2023.vercel.app/
• Note: save data under localStorage and remove from it as well for the bonus items; follow up with a modal example from Twitter post creation for reference

[zlatanpham]

Hello @nhuthm-setel, great start!

Requirements

• [x] Render correct table elements
• [x] Create book
• [x] Delete book
• [x] Search book by title
• [ ] Semantic HTML
• [x] Standard use of CSS and JavaScript
• [x] Store data in LocalStorage

Final result: ✅ passed 80% of the requirements

Feedback

We also have some comments for your work:

1. Should use button element for the close button https://github.com/nhuthm-setel/df-frontend-2023/blob/main/assignment-1/index.html#L76-L79

2. Should place the search element inside a <form /> component so that we can have the native form operations such as enter to submit,... https://github.com/nhuthm-setel/df-frontend-2023/blob/main/assignment-1/index.html#L23

3. It'd be better to keep one naming convention for both naming ids and classes https://github.com/nhuthm-setel/df-frontend-2023/blob/main/assignment-1/style.css#L131-L135

4. If the search value is present, it may be worthwhile to incorporate the new addd item into the filtered list. Currently, it makes the whole list appear again after adding a new book.

5. The JSON parse should be inside try-catch and it's safer to validate the data before passing to the function call https://github.com/nhuthm-setel/df-frontend-2023/blob/main/assignment-1/script.js#L44

6. It is recommended to render the user interface from data as opposed to relying on directly reading data from the DOM, since using a single rendering method instead of two promotes consistency and clarity https://github.com/nhuthm-setel/df-frontend-2023/blob/main/assignment-1/script.js#L104-L122