https://github.com/hamadismail/library-management-client
A full-stack library management system that allows users to browse, borrow, and manage books online. The client side is built using React and provides a responsive, user-friendly interface for exploring books, managing borrow history, and accessing book details.
https://github.com/hamadismail/library-management-client
axios daisyui firebase-auth framer-motion react-router reactjs tailwindcss
Last synced: 2 months ago
JSON representation
A full-stack library management system that allows users to browse, borrow, and manage books online. The client side is built using React and provides a responsive, user-friendly interface for exploring books, managing borrow history, and accessing book details.
- Host: GitHub
- URL: https://github.com/hamadismail/library-management-client
- Owner: hamadismail
- Created: 2025-06-24T16:53:58.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-06-24T17:34:25.000Z (about 1 year ago)
- Last Synced: 2025-06-24T18:34:11.710Z (about 1 year ago)
- Topics: axios, daisyui, firebase-auth, framer-motion, react-router, reactjs, tailwindcss
- Language: JavaScript
- Homepage: https://readora1.web.app/
- Size: 3.62 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Readora - Client Side
π **Live Site:** [https://readora1.web.app/](https://readora1.web.app/)
## π Project Purpose
**Readora** is a full-stack library management system that allows users to browse, borrow, and manage books online. The client side is built using React and provides a responsive, user-friendly interface for exploring books, managing borrow history, and accessing book details.
## π Key Features
- π Browse books by category or full list
- π View book details and availability
- π Borrow books with return date selection
- ποΈ Manage userβs borrowed books
- π Protected routes and role-based access
- π± Responsive design using Tailwind CSS
## π οΈ Tech Stack
- **Frontend**: React.js, TailwindCSS, DaisyUI
- **Routing**: React Router DOM
- **Authentication**: Firebase
- **State Management**: React Context API
- **Form Handling**: React Hook Forms
- **Animation**: Swiper.js Slider, Framer Motion
## π¦ NPM Packages Used
- `react-hot-toast`
- `sweetalert2`
- `react-tooltip`
- `@headlessui/react`
- `react-simple-star-rating`
- `react-icons`
- `react-spinners`
- `date-fns`
## π Folder Structure Highlights
- `/pages`: Main page components (Home, Book Details, Borrowed Books)
- `/components`: Reusable UI components (Spinner, StarRating, etc.)
- `/api`: Custom React hooks for fetching backend data
- `/hooks`: Custom utility and authentication hooks
## π¦ Installation Guide
### β
Prerequisites
- Node.js and npm installed
- Firebase project (for authentication)
### Clone the repository:
```bash
git clone https://github.com/hamadismail/library-management-client.git
cd library-management-client
```
### Install dependencies:
```bash
npm install
```
### Create a .env.local file in the root and add:
```bash
VITE_apiKey=your_firebase_api_key
VITE_authDomain=your_project.firebaseapp.com
VITE_projectId=your_project_id
VITE_storageBucket=your_bucket
VITE_messagingSenderId=your_sender_id
VITE_appId=your_app_id
```
### Start the development server:
```bash
npm run dev
```
## π« Contact
Feel free to reach out with any questions or feedback!
- π» GitHub: hamadismail
- π§ Email: hamad.ismail.gub@gmail.com