Tech challenge for allplants! 🌱 A small fictional cat adoption site.
You can see the site live at https://annas-allcats.netlify.com/ 🐱
This project was bootstrapped with Create React App.
After cloning the repo, in the project directory, run npm i to install dependencies.
Then run yarn start or npm start
to run the app in the development mode.
Open http://localhost:3000 to view it in the browser.
The page will reload if you make edits.
You will also see any lint errors in the console.
I spent approximately 4 hours on the challenge (with a lunch & a cinema break).
- even though I followed a mobile-first approach throughout most of the project, I started with the desktop naviagtion and did not have time to finish the hamburger menu for the mobile version
- tests!!
- 'Take me home' buttons should explode in a heart, currently they do not do anything
- polish the design! (there are still spacing issues here and there)
- revisit the cat tiles and figure out a better way of sizing them (right now the list width and the images are set in pixels which is not the most accessible)
- add a loading state (there are really nice easy-to-use libraries with simple designs, I have used react-content-loader before which was a delight)
Thank you for checking out my AllCats ✨