Monsters Rolodex 2022 (Classes)

Monsters Rolodex 2022 (Classes)

I recently upgraded this project to React 18 using a top-level React class component AND functional components. The class component contains the state, and the other components contain the props. I use the react-lazy-load-image-component package to implement lazy loading of my Robohash images fetched from the Robohash API, some of which sometimes did not load immediately and left an image placeholder. Then I would literally have to manually clear the browser cache and reload the page to fetch those straggler images from the API. With the react-lazy-load-image-component package, images are loaded from the top down instead of the other way around, and this resulted in much faster and successful loading of all the images from the API. In addition, I use yarn, create-react-app, try catch for error handling, async/await, scss modules using dart sass, and hosted the project on gh-pages.