You can have a look at the app/run the app on the netlify badge above. Then, if not in mobile mode, F12 -> Ctrl+Shift+M.

Bookshelf App

An app for searching books and getting details, mobile first.

Project made with react, typescript and react-router-dom.

Project

In this project I tried a lot of concepts that I know, like lifting up state with Context API, custom hooks, debouncing api calls, CSS-in-JS with styled-components, even getting props through styled-components to render a border based on focus state and added a spinner during API calling.
It was a lot of work but a lot of fun.

Improvements and feedforward

During the development of this project, some improvement ideas have shown up, like having a better polishing through useReducer or even a better state lifting tool, like redux-toolkit.

Project Running

bookshelf_app.mp4

Project WakaTime

Installation and Setup Instructions

Clone down this repository. You will need node and npm or yarn installed on your machine.

Installation:

npm install or yarn

Before running, you can rename the file .env-example to .env and set new values if you want.

Then to start server:

npm start or yarn start

To visit app:

localhost:3000