Refactor to be React App w/ Flask Backend about shelf-help HOT 10 CLOSED

Mantine UI Components

from shelf-help.

Helpful article on Pydantic for BE validation / JSON serde:
https://medium.com/@danielwume/exploring-pydantic-and-dataclasses-in-python-a-comprehensive-comparison-c3269eb606af

from shelf-help.

Started with create react app, but might want to look into their pwa template: https://create-react-app.dev/docs/making-a-progressive-web-app/

from shelf-help.

This might be needed for awaiting components to finish? https://stackoverflow.com/questions/71778278/how-can-i-ensure-that-a-react-component-is-loaded-only-after-some-api-call-has-b

Or loading behavior?

from shelf-help.

https://stackoverflow.com/questions/66444067/react-display-loading-animation-for-api-call-duration

Loading behavior example

from shelf-help.

https://dev.to/will_yama/how-to-render-responses-96c

Another helpful article about calling external apis

from shelf-help.

Render static site info regarding redirects: https://community.render.com/t/cant-connect-api-calls-to-web-service-express-from-my-static-site/10229/3

from shelf-help.

Looks like I need to go with a Vite template because create react app doesn’t work maybe?

https://help.mantine.dev/q/can-i-use-mantine-with-cra

Vite PWA- https://vite-pwa-org.netlify.app/guide/

Vite PWA- https://dev.to/_ibrahimturan/adding-pwa-to-vite-applications-1bce

from shelf-help.

Might need this for changing the URL without refreshing the page?
https://stackoverflow.com/questions/57101831/react-router-how-do-i-update-the-url-without-causing-a-navigation-reload

from shelf-help.

Backend: Might need to consider the BE returning ALL the books, so that the FE can avoid using bandwidth to simply get a random selection.

Frontend: This might mean a refactor to use ReactQuery and manage the cache that way.

from shelf-help.