Book Dashboard Assignment for Frontend Development Internship at NUA

Welcome to the Book Dashboard project! This project is designed to give you hands-on experience with React-based development, focusing on creating an admin dashboard that displays book records. The records will be fetched from the Open Library API and presented in a tabular format. The dashboard will include essential features such as pagination, sorting, and search functionality.

Features

Data Fetching

• Fetch book records using the Open Library API.
• API documentation: Open Library API.

Columns

• ratings_average
• author_name
• title
• first_publish_year
• subject
• author_birth_date
• author_top_work

Pagination

• Default view shows 10 books per page.
• Option to change the number of records per page to 10, 50, or 100.

Sorting

• Support for ascending and descending sort on all columns.

Search

• Search books by author name.

Installation

To get started with the project, follow these steps:

Clone the repository:

git clone https://github.com/yourusername/nua-frontend-developer-intern-assignment.git
cd nua-frontend-developer-intern-assignment

Install dependencies:

npm install

Start the development server:

npm run dev

Project Structure

book-dashboard/
├── public/
├── src/
│   ├── components/
│   │   └── AdminDashboard.jsx
│   ├── services/
│   │   └── api.js
│   ├── App.jsx
│   ├── main.jsx
│   ├── index.css
├── package.json
├── README.md
├── vite.config.js

How to Use the Dashboard

1. Data Fetching: The dashboard fetches book records from the Open Library API and displays them in a table format.
2. Pagination: Navigate through the book records using pagination controls. You can set the number of records displayed per page to 10, 50, or 100.
3. Sorting: Click on the column headers to sort the book records in ascending or descending order.
4. Search: Use the search bar to find books by author name.