Assignment Category: 08

Library Management System : A Library Management Application

Overview

A well-renowned school requires the development of a Library Management System, accessible via a website. The system should allow the addition and categorization of books in their collection, with the ability to update book information. It should also support tracking of borrowed and returned books, ensuring efficient management of all transactions. The website should offer a user-friendly interface for users, facilitating smooth operations and easy access to the library's resources.

Purpose

To create an efficient Library Management System for managing book transactions and providing easy access to the library's resources.

Live URI

Live Site: https://librarysystem-bb68d.web.app

Features

• **Book Addition and Categorization: Easily add new books and categorize them.
• **User-Friendly Interface: Intuitive and responsive design for a smooth user experience.
• **Secure Authentication: Email and password-based authentication with social login options.
• Responsive Design: Mobile-friendly interface using Tailwind CSS for styling.

Key Features

1. Book Management: Add, update, and categorize books.
2. Borrow and Return Books: Track borrowed and returned books with automated quantity updates.
3. User Authentication: Secure user login and registration using Firebase.
4. Responsive Design: Fully responsive design for mobile, tablet, and desktop.
5. Dynamic Titles: Dynamic website titles based on routes.
6. Loading Spinner: Show loading spinner when data is in a loading state.
7. CRUD Notifications: Toast notifications for all CRUD operations.

Technologies Used

Frontend:

-   React.js
-   React Router
-   Tailwind CSS
-   React-Toastify for notifications
-   React Rating Stars Component for ratings

Backend:

-   Node.js
-   Express.js
-   MongoDB
-   JWT for authentication
-   Firebase for user authentication

Dependencies

-   Firebase for frontend
-   Vercel for backend

Challenges

Required Challenges

1. Meaningful Commits:

   • At least 15 meaningful commits on the client side.
   • At least 8 meaningful commits on the server side.

2. Responsive Design:

   • Ensure the website is fully responsive on mobile, tablet, and desktop.

3. Secure Configuration:

   • Secure Firebase configuration keys using environment variables.
   • Secure MongoDB credentials using environment variables.

4. Deployment Guidelines:

   • Ensure the server is working perfectly on production without any CORS/404/504 errors.
   • Ensure the live site is working perfectly without errors on landing or reloading.

5. Deployment Guidelines:

   • Ensure the server is working perfectly on production without any CORS/404/504 errors.
   • Ensure the live site is working perfectly without errors on landing or reloading.

6. Layout & Page Structure:

   • Include a Navbar, Main Section, and Footer.
   • Implement a Home Page with banner, book categories, and extra sections.
   • Implement authentication system with login and registration.
   • Implement private routes for All Books, Add Book, and Borrowed Books pages.

7. Extra Features:

   • Dynamic Title for every route change.
   • 404 page for non-existing routes.
   • Loading spinner when data is being loaded
   • Toast notifications for all CRUD operations.

Optional Challenges (Highly Recommended)

1. Animations with Framer Motion:

   • Explore and implement animations from Framer Motion.

2. Axios Interceptors:

   • Use Axios interceptors to manage network requests.

3. Swiper JS:

   • Implement Swiper JS for the banner and slider.

4. React Hook Form:

   • React Hook Form

5. Limit Borrowed Books:

   • Allow a maximum of 3 books to be borrowed per person. Show a toast alert if exceeded.

Getting Started

Prerequisites

• Node.js and npm installed on your machine.
• Modern web browser (Chrome/Edge) with support for the Web Speech API.

Installation

1. Clone the repository: https://github.com/programming-hero-web-course2/b10a11-client-side-DeveloperMonirBD.git, cd b10a11-client-side

2. Install the dependencies: bash npm install

3. Start the development server:

bash npm start

4. Open your browser and navigate to

https://librarysystem-bb68d.web.app to view the application.

What to Submit

Assignment Category: Library Management System - 08

Your client-side code GitHub repository link : https://github.com/programming-hero-web-course2/b10a11-client-side-DeveloperMonirBD

Your server-side code GitHub repository link: https://github.com/programming-hero-web-course2/b10a11-server-side-DeveloperMonirBD

Live link to the deployed project : https://librarysystem-bb68d.web.app