📚 Library

About the project

Simple browser library app, where user can add and remove books, specify book pages, update read status.
Created as part of The odin Project full stack Javascript curriculum.

► Live demo 👀

Features

• Add a book
• Specify book page numbers and read status when adding a new book
• Update the read status of an existing book
• Delete an existing book

Built with

🪄 Technologies

• JS
• CSS
• HTML

🔧 Tools

• Visual Studio Code
• Git & GitHub
• macOS Terminal

🧰 Data storage

• Data saved to localStorage

💙 Credits

• Refered to mooniiDev's project for layout inspiration & user interaction study

Takeaways

• Learned how to save data to localStorage, JSON stringify & parse methods
• Learned how to use HTMLSelectElement.checkValidity() to prevent form data from being sent, when user form input did not meet requirements
• Learned to use event.preventDefault() to block default click event handling
• Improved knowledge of DOM manipulation
• Practiced usage of counter variable to assign a unique ID to objects & DOM elements
• Practiced array methods (e.g. filter(), find())
• Practiced object constructors & this
• Practiced styling HTML table element
• Practiced BEM naming convention for CSS classes