Online Library Management System

A premium, modern, and responsive Library Management System built with Vanilla JavaScript. This application allows users to manage a collection of books, track borrowing status, and maintain a history of actions.

🚀 Features

Core Functionality

• Browse Library: View a grid of books with covers, ratings, and status.
• Search & Filter: Real-time searching by title/author and filtering by category.
• Sort: Sort books by Newest, Title (A-Z), or Rating (High-Low).
• Add Books: Add new books with custom covers and summaries. (Includes validation).
• Borrow/Return: Simulate borrowing and returning books with status persistence.

Advanced Features

• Favorites: Mark books as favorites and view them in a dedicated "Favorites" tab.
• History: Track all borrowing and returning history in the "History" tab.
• Persistence: All data (Books, Status, Favorites, History) is saved to LocalStorage, ensuring it remains available after page reloads.
• Book Details: View detailed information including full summaries in a modal.

Technical Highlights

• Event Delegation: Optimized event handling for performance.
• Robust Error Handling: Safe storage operations and input validation.
• Zero Dependencies: Built entirely with HTML5, CSS3, and Modern JavaScript (ES6+ Modules).

🛠️ Setup & Usage

1. Clone or Download the repository.
2. Open index.html in any modern web browser.
   • Note: For ES Modules to work strictly without local server warnings, using a simple local server (like Live Server in VS Code) is recommended, though it may work directly in some browsers depending on security headers.

📖 How to Use

1. Adding a Book: Click the "Add Book" button in the header. Fill in the details. The Cover URL is validated automatically.
2. Browsing: Use the Sidebar to switch between "Browse", "Favorites", and "History".
3. Interacting:
   • Click the Heart icon on a book to favorite it.
   • Click the Bookmark/Return icon to toggle status.
   • Click the Eye icon to view full details and summary.
4. Sorting: Use the dropdown next to the search bar to change the sort order.

💻 Technlogy Stack

• HTML5: Semantic structure.
• CSS3: Custom variables, Grid/Flexbox layouts, Glassmorphism effects.
• JavaScript: ES6 Modules, Classes, LocalStorage API.

---

Created by [Prateek Mishra]