School Library Catalog

A modern, single‑page school library catalog built with vanilla HTML/CSS/JS. It provides student/librarian login UI, a fast searchable catalog, and rich book cards with cover art and borrower actions.

Aim

Create a clean, accessible interface that showcases a school library system: discover books quickly, view details in a focused modal, and surface borrower‑related actions with clear calls to action.

Features

• Search by title, author, and genre
• Pagination with result counts
• Uniform book cards with cover art
• Modal book details with blurred background
• Borrower area + action buttons (nudge & sign‑up)

Image Fetching Pipeline

1. Open Library (primary):
   • Search by title/author.
   • Use the Covers API when a cover is available.
2. Google Books (fallback):
   • Attempts a second lookup when Open Library has no cover.

Data Files

• books.json — small curated list (lightweight).
• books.generated.json — large generated dataset with cover URLs.
• index.html embeds JSON so it works via file:// without a local server.

Project Structure

• index.html — layout, modal, embedded data
• styles.css — layout + UI styling
• app.js — data loading, filtering, pagination, image fetching

Tech Stack

• HTML + CSS
• Vanilla JavaScript
• Open Library Covers + Search API
• Google Books API (fallback)

Credits

Cover data and book metadata are pulled from Open Library. Fallback cover lookup uses Google Books.