myPetPal

Taking care of our pets is a lot of work! Use this app to keep track of all the tasks necessary to keep your furry, feathered, & scaley friends happy & healthy.

---

Table of Contents

• myPetPal
• Table of Contents
• Links:
• Demo
• Screenshots
• Tech Stack
• Features
• Run Locally
• Environment Variables
• Roadmap
• Lessons Learned
• Authors

---

Links:

• Submit a bug/issue
• User flow (in Wiki)

Demo

myPetPal

To avoid signing up, you may log in with the following credentials:
- Email: tester3@gmail.com
- Password: testtest

Screenshots

Screenshots

Home page

Calendar

Pet dashboard

Daily task view

Tech Stack

Client: JavaScript, EJS, Bootstrap CSS

Server: Node, Express, MongoDB

Dependencies: apicache, bcrypt, connect-mongo, node-fetch, date-fns, dotenv, ejs, express, express-flash, express-session, method-override, mongodb, mongoose, morgan, node-cache, nodemon, passport, passport-local, unsplash-js, validator

Features

• Secure login with Passport Auth
• Cache for external API calls
• Responsive for desktop & mobile

Run Locally

Clone the project

  git clone https://github.com/raissa-k/myPetPal.git

Go to the project directory

  cd mypetpal

Install dependencies

  npm install

Start the server

a) With nodemon

  npm run dev

b) With node

  npm run start

Environment Variables

To run this project, you will need to add the following environment variables to your .env file in /config/.env

PORT: <port> (can be any port, ex: 3000)

DB_STRING: <your database uri>

Roadmap

• Add cache method for external API calls, namely Unsplash for the index picture
• Increased readability of controllers
• Improved accessibility by adding ARIA roles, adding an accessible date picker, and ensuring buttons, labels and inputs had appropriate names/descriptions.
• Add monthly calendar view for tasks color-coded for each pet and/or type of task
• Improve accessibility by adjusting color contrast, reviewing roles, and ensuring keyboard navigation
• Add accessible modals for task/pet editing.
• Warn users that deletion is permanent.
• Improve a date's to-do list view
• Reproduce and fix an error where an edited pet is duplicated
• Add template partials
• Re-style the app into a more elegant template
• Enable marking tasks complete from All Tasks page
• Add different profile pictures for pets, depending on species
• Enable password change/reset
• Clean and minimize .css and .js files
• Add tests

Lessons Learned

As a team:

• We also learned how important good communication is for successful app development as a team.
  • Communicating and tracking issues is critical. Even without Jira, Github projects helps keep track of what needs to be done.
• Having a clear view of the final product is invaluable to guide decisions, especially when there isn't a team lead
  • Wireframes and user flows, even with no UI/UX professionals around, help with such a view

On the technical aspect:

• Handling merge conflicts
• Working with date formats
• Storing external API calls in local cache
• Method overriding

Authors

• @raissa-k
• @AdamRobinsonSE
• @valerievozza
• @HauntedHamburger
• @Jaehwajh
• @KClemente11