https://github.com/rafal19987/recruitment-task-dynamic-table-nextjs-tailwind-typescript

An application created as part of a recruitment task for a front-end developer position. The task was to use google books api to present the required information.
https://github.com/rafal19987/recruitment-task-dynamic-table-nextjs-tailwind-typescript

2023 breadcrumb context frontend google-books-api junior-developer nextjs react recruitment-task tailwindcss typescript

Last synced: 7 months ago
JSON representation

An application created as part of a recruitment task for a front-end developer position. The task was to use google books api to present the required information.

• Host: GitHub
• URL: https://github.com/rafal19987/recruitment-task-dynamic-table-nextjs-tailwind-typescript
• Owner: rafal19987
• License: mit
• Created: 2023-06-19T18:59:14.000Z (over 2 years ago)
• Default Branch: master
• Last Pushed: 2024-08-02T15:09:35.000Z (about 1 year ago)
• Last Synced: 2025-01-21T06:26:58.417Z (9 months ago)
• Topics: 2023, breadcrumb, context, frontend, google-books-api, junior-developer, nextjs, react, recruitment-task, tailwindcss, typescript
• Language: TypeScript
• Homepage: https://dynamic-table-project.vercel.app
• Size: 64.5 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
![image](https://github.com/user-attachments/assets/c4dd9ab0-7881-401d-880b-17b42613868b)

![image](https://github.com/user-attachments/assets/80289788-5647-4ada-a955-a7802d609f19)

![image](https://github.com/user-attachments/assets/4df683b2-3817-41a0-973a-8c877f8a37d5)

![image](https://github.com/user-attachments/assets/68a35e1f-4921-40c6-89de-0019ee21e40d)

Live APP https://dynamic-table-project.vercel.app/

## About

Project:

The application has been developed based on business requirements that include the following capabilities:

- Connecting to and fetching data from a public API (Google Books API was chosen).

- Displaying the fetched data, such as ID, Title, and Author, in a table.

- Interacting with the displayed data by clicking on a specific cell, which triggers the loading of new data specific to the selected cell.

- Implementing breadcrumbs that show our position in the data structure and allow interaction by navigating to previous structures.

- Implementing a responsive application design suitable for various types of displays.

Stack:

- React 18

- Next.js 13

- Tailwind 3

- Typescript 5

Deployment:

- Vercel https://dynamic-table-project.vercel.app/

Used API:

- Google Books API https://developers.google.com/books

## How to run

```bash

git clone https://github.com/rafal19987/dynamic-table-project.git

cd dynamic-table-project

npm i

npm run dev

```

Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.