This project was created as a challenge for GNAR. It’s a platform that helps people to find a cat for adoption, showing a list of cats and their info.
Regarding the layout, some dummy stuff was added just to make the project look more like a complete application, instead of just showing the required components. If you just want to see how the application looks like, check the PAGES folder in this repo, or check the live demo here: Purrrfect Match
-
Style library: Styled Components. Chosen because using CSS-in-JS gives you superpowers like modularization, theming, style scoping, mixins and props.
-
Framework: React.js. Chosen because it is a powerful library that is built with a reactive way of thinking. This project uses React Class Components and functional components, as a way to show capability to work with pre-hooks React components.
-
Chart.js to generate dynamic charts.
-
Responsive application.
-
Well moduled and componentially structured.
-
Commits following a conventional commit structure for easier maintenance and automatic changelog/versioning.
All icons, logo and desktop design were supplied by GNAR team using Figma. Images were freely hosted by https://thecatapi.com. Mobile design adapted by me <3.
Run yarn server
for the API dev server. The app will automatically reload if you change any of the source files.
Run yarn start
for a dev server. Navigate to http://localhost:3000/
. The app will automatically reload if you change any of the source files.
Run yarn build
to build the project. The build artifacts will be stored in the build/
directory.
You can find detailed instructions on using Create React App and many tips in its documentation