trankhacvy
commented
1 year ago Hello @DinhSonFE , well done!
Requirements
- [x] Render book list with pagination
- [x] Create book
- [x] Delete book
- [x] Search book by title
- [x] Standard use of React component & state
- [x] Light/dark mode
Final result: ✅ passed
Feedback
We also have some comments for your work:
- A reducer function should be a pure function, meaning it should not contain any side-effect code.
- Instead of placing the entire event object inside the payload, consider including only the search string in the payload object.
-
It's a good practice to use self-closing tags for components. So, instead of
, use . -
Adding a slight delay when inputting a search is a good idea, but one second might be too long. It would be better to consider a shorter delay, such as 250ms or 300ms.
-
While colors and animations can enhance a website, using them excessively can make users uncomfortable. Consider opting for a clean, simple, and modern design to create a better user experience.
Website Link : https://df-frontend-2023-6dn7.vercel.app/
Bookstore features : -Search by title: Users can enter the title of a book into the search bar to find that book in the bookstore. -Add new books to the bookstore: Users can add new books to the bookstore -Delete books from the bookstore: Users can delete books from the bookstore by clicking the delete button next to the book. -All books are stored in local storage: All books in the bookstore are stored in the user's browser's local storage. This means that the books will still be there even if the user closes the website. -Pagination : Pagination by book list. Each page will have 5 products. You can view the products of each page -Change theme dark or light : Users can toggle between light and dark mode to suit their preference. The theme is saved locally, so users will always be greeted by their preferred interface upon returning to the website.
Thank you for reviewing my article. I appreciate any feedback you can provide, as it will help me improve.