Race-a-Pet is a web-based game where users can create pets and race them against each other. Users will “design” a pet with various features such as animal type, diet, and exercise. Based on the attributes, a race time is calculated and displayed to the user, along with a leaderboard of all the previous race times ranked by time. Users can manage the leaderboard by adding more pets or delete them from the database.
- To run, ensure npm and nodemon are installed in the terminal.
- Have port 3000 and 3001 available
- Open one terminal and type "npm start" and open another terminal and type "nodemon server.js". On Windows, the second terminal may need to be a command prompt.
- Login using "user" as username and "pass" as password.
- Implemented React
- Styled with Bootstrap and CSS
- Implemtnted session based authentication
- Saved Users information Using MongoDB
- Conducted User Studies (Infomation in UserTesting.md)
- Implemented Aria for Accessability
- Was not able to get Github login working
- Ran into a few issues implementing MongoDB, but was able to debug it after going to office hours multiple times.
- Had trouble loading our website to Glitch or another server that isn't local.
- Glitch does not support bootstrap
- Tried with GitHub pages but it does not run the app correctly
- I needed to put a payment method for Heroku. I am not willing to give my private info for something that is free -Render took to long to deploy -Had to submit our final locally
- Joselin
- login page
- back button on Results page
- styling pet form page
- mongodb
- Esha
- Pet form page
- Bootstrap styling
- custom CSS styling with bootstrap
- Aria for accessibility
- conducted a user test
- Jolene
- Race Results page
- race time calculation
- leaderboard functionality (display, delete)
- conducted some user tests
- https://pngfre.com/gecko-png/
- https://pngtree.com/so/cute-hamster-vector
- https://www.vecteezy.com/png/25245264-cat-clipart-icon-flat-design-on-transparent-background-animal-isolated-clipping-path-element
- https://pngtree.com/free-animal-clipart/dog
- https://commons.wikimedia.org/wiki/File:Turtle_clip_art.svg
- https://www.vecteezy.com/png/24029953-rabbit-clipart-transparent-background