Library Management System
Library Management System
IT- ELECTIVE 1
Submitted by:
Mendoza, Aj Boy T.
Submitted to:
December 2024
Contents
Introduction.................................................................................................................................................3
Functions.....................................................................................................................................................4
Header..........................................................................................................................................................4
Library Management System...............................................................................................................4
Available Books....................................................................................................................................4
Navigation Menu..........................................................................................................................................4
Search Book… & Search.......................................................................................................................4
Title
Sorting
Content.........................................................................................................................................................5
Category..............................................................................................................................................5
Apply/Clear Filters...............................................................................................................................5
Main Content...............................................................................................................................................5
Books...................................................................................................................................................5
Code Algorithms...........................................................................................................................................6
CSS…styling..........................................................................................................................................6
Html..web.structure.............................................................................................................................6
PHP…backend.operations....................................................................................................................6
Javascript…client-side..logic.................................................................................................................6
Json..data..representation...................................................................................................................6
Page | 2
LIBRARY MANAGEMENT SYSTEM
Introduction
- Our website called is Library Management System is an which can borrow books
and other available books on the website. Through this site, people can borrowed
and return books, making comfortable online website.
Functions
Header
(Library Management System)
- When you click on the logo, the program will bring you back to the homepage, no
matter where you are in the website.
Navigation Menu
(Search Books Functionality)
- To enhance the ease of finding books, a search bar is available for users to quickly
locate specific titles, authors, or keywords. By entering a keyword or phrase and
clicking the "Search" button, the system will display all books matching the entered
criteria, making the process of finding desired items fast and efficient.
Content
(Category)
- The system organizes books into various categories to simplify browsing and
discovery. Categories may include genres like fiction, non-fiction, fantasy, mystery,
romance, or academic topics. By selecting a specific category, users can quickly view
all books related to that theme, helping them explore their interests or find relevant
materials more efficiently.
Main Content
(Books)
- Library Management System offers a wide variable content of books, displaying
them in an library list in the center of the website. Each component has a picture as
well as additional details such as its title, author and borrowed books.
Page | 4
Page | 5
Code Algorithms
HTML:
- The HTML provides the structural foundation of the Library Management System,
including navigation bars, search inputs, dropdowns for filtering and sorting, and
modals for borrowing and returning books.
Navbar: Includes a search bar, dropdowns for filters and sort orders, and buttons for
executing search and clearing inputs.
CSS:
- CSS styles the system, offering responsive layouts, hover effects on book cards,
animations for the sidebar, and well-structured modals to ensure an intuitive and
visually appealing user experience.
Hover Effects:
Highlights elements (e.g., book cards) when the user hovers over them to
improve interactivity.
.card:hover {
transform: scale(1.05);
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}
PHP:
- PHP serves as the backend logic, handling actions such as borrowing, returning, and
searching for books, as well as managing user queues, all while reading and writing
data to a JSON file.
borrowBook($bookId, $userId):
Updates the book's status to "borrowed."
Adds borrow and return dates for tracking.
loadBooks:
Dynamically generates HTML content for the available and borrowed books lists
based on the current data.
books.forEach((book) => {
const card = document.createElement("div");
card.className = "card";
card.innerHTML = `<h3>${book.title}</h3>`;
});
JSON:
The JSON file acts as a lightweight database, storing book information, including titles,
authors, genres, statuses, and borrow/return dates, ensuring data persistence across
the application.
Structure:
Each book is represented as an object with fields like id, title, author, genre,
status, etc.
{
"id": 1,
"title": "The Great Gatsby",
"author": "F. Scott Fitzgerald",
"genre": "Classic",
"status": "available"
}
Integration Flow
1. Frontend Interaction:
o User searches for a book or performs actions (e.g., borrow/return).
2. JavaScript:
o Captures user inputs and sends requests to the server.
o Updates the UI with the results (filtered books or updated lists).
3. PHP:
o Processes the requests, updates the JSON data, and sends responses
back.
4.JSON: Stores updated book details, ensuring data persistence across user
sessions.
Page | 6