Solution for a challenge from Devchallenges.io.
ETC: ~50h
This application/site was created as a submission to a DevChallenges challenge. The challenge was to build an application to complete the given user stories:
- User story: I can search for cat breeds and select a breed of my choice
- User story: I can see the most popular searched cat breeds summary on the homepage
- User story: I can see the top 10 most searched cat breeds
- User story: I can see the breed details including description, temperament, origin, life span, adaptability, affection level, child-friendly, grooming, intelligence, health issues, social needs, stranger friendly
- User story: I can see more photo of the breed
- User story: On mobile, when I select the search option, a modal for breed search should pop up
- User story (optional): I can go to an article about cats when I click read more on Why you should have a cat section
- User story (optional): I can go to the top 10 cats by clicking see more in the dashboard
To clone and run this application, you'll need Git and Node.js (which comes with npm) installed on your computer.
CatWiki full-stack app holds two main folders server and client.
create .env file with MONGODB_URI
# install packages
cd server && npm install
# start server
npm startFrom another terminal window:
# install packages
cd client && npm install
# start React app
npm start- Change SVG Color Using CSS Filter
- Put icon inside input element in a form
- Maintain the aspect ratio of a div with CSS
- Before and After pseudo classes used with styled-components
- Using Apollo Link to Handle Dependent Queries
- Re-render a React Component on Window Resize
- Mongoose - Increment with findOne
- Store images in a MongoDB database