Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/dhaya3132/library_management
A online front-end book library management add the books and view the detailed information about books, categories the books based on the topics
https://github.com/dhaya3132/library_management
css form-validation html javscript react-router reactjs redux redux-toolkit tailwind
Last synced: 1 day ago
JSON representation
A online front-end book library management add the books and view the detailed information about books, categories the books based on the topics
- Host: GitHub
- URL: https://github.com/dhaya3132/library_management
- Owner: Dhaya3132
- Created: 2024-08-22T03:08:34.000Z (about 1 month ago)
- Default Branch: main
- Last Pushed: 2024-08-25T16:26:48.000Z (about 1 month ago)
- Last Synced: 2024-09-22T05:02:40.661Z (6 days ago)
- Topics: css, form-validation, html, javscript, react-router, reactjs, redux, redux-toolkit, tailwind
- Language: JavaScript
- Homepage: https://librarymanagement-dhayas-projects-99541db5.vercel.app
- Size: 12.6 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## Online Library Management System
This project is an Online Library Management System built using React.js, Redux, and Tailwind CSS. It allows users to browse, add, and manage books in an online library. The application includes a responsive UI and uses React Router for navigation.
## Table of Contents
- Features
- Pages
- Components
- Technologies Used
- Installation
- Usage
- Folder Structure
- Contributing
- License
## Features
- Browse and search for books
- View detailed information about a book
- Add new books to the library
- Responsive design
- Error handling for invalid routes
## Pages
- Home Page: Introduction and overview of the library system.
- Book Detail Page: Displays detailed information about a selected book.
- Add Book Page: Form to add a new book to the library.
- Browse Book Page: Lists all available books with options to categories and search.
- Error Page: Displays a 404 error for invalid routes.
## Components
- Navbar: Navigation bar for navigating through the application.
- BookCard: Component to display individual book details in a card format.
- BooksData: Component that lists all the books in the library.
- Categories: Component for filtering books based on categories.
- Footer: Footer section of the website.
- SearchField: Input field for searching books.
- TabButton: Buttons for navigate between different book categories.
- Store Folder: Contains Redux store and slice logic.
- Utils Folder: Contains utility functions, including bookSlice and mockData.
- BookPage: Contains the selectes category books.
## Technologies Used
- React.js: JavaScript library for building user interfaces.
- Redux: State management library for React applications.
- Tailwind CSS: Utility-first CSS framework for styling.
- React Router: Library for handling routing in React applications.
- nanoid: Library for generating unique IDs.
- Vite: Development tool that provides a fast build and development environment for modern web projects.
## Folder Structure
online-library-management/
├── public/
├── src/
│ ├── assets/
│ ├── components/
│ │ ├── BookCard.js
│ │ ├── Booksdata.js
│ │ ├── Categories.js
│ │ ├── Footer.js
│ │ ├── Navbar.js
│ │ ├── Searchfield.js
│ │ └── Tabbutton.js
│ ├── pages/
│ │ ├── AddBookPage.js
│ │ ├── BookDetailPage.js
│ │ ├── BrowseBookPage.js
│ │ ├── ErrorPage.js
│ │ └── HomePage.js
│ ├── store/
│ │ ├── index.js
│ ├── utils/
| | |__bookSlice.js
| | |
│ │ ├── mockData.js
│ ├── App.js
│ ├── index.js
│ └── ...
└── package.json
## Running application
- 1.Clone repository
- 2.navigate to the folder
- 3.npm install
- 4.npm run dev