The Peapod login page
Dashboard with your risk level!
Create a pod and invite friends/family
Add an activity, with tough questions to keep you accountable!
Seeing a screen of your three most recent activities
Getting notifications from other users, invitation to join pod
A list of pods - share a pod with your friend!
Ricky (Li Qi), one of our team members, has a girlfriend who lives with her grandma. Because it was hard to keep track of when both of them had done activities, they had to put extra care when deciding to meet, because that would be a high threat to his girlfriend's grandma. He proposed to our team to create this web-app so that both families could have a higher ease of tracking whatever activity they were doing so that the couple could meet safety.
What it does
Our web-app gathers people by putting them in a pod, which would have a maximum size of 10 people. It would then analyze each person's activities and return a risk meter for each person. This meter would then be used to see if that pod could meet on that day safely, according to each person's exposure to Covid.
How we built it
Our front-end and all of its animations are in vanilla React.js, with the exception of CircularProgression meters from the material-ui library. The front-end uses Redux for state management. The account logging mechanism uses a Google or Facebook passport. The back-end is done in express.js with a PostgreSQL database. Our web-app will be hosted on Heroku.
Challenges we ran into
We are still amateur developers, and we had some difficulty loading data with axios before the react component was loaded. Our solution: using react-queries and useState to know when the component had to load or not.
Accomplishments that we're proud of
We are absolutely proud of our UI and it's graphic design. Our front-end developer spent a lot of time smoothing transitions and change of pages, etc. We are also proud of the idea of our project, as it could actually help a lot of individuals gradually reconnect, while doing so safely and following Covid-19 guidelines.
What we learned
We learned during this hackathon that workflow management is actually important. While we all did our part and worked very hard, our efforts were not always coordinated, and we ended having a lot of bugs in the communication between out front-end and our back-end.
What's next for Peapod
We are planning to add new feature to Peapod in the future. We plan to add a calendar of future events and what will be showing this person's risk level on different days in the future. We plan to also bring this feature to pods so that they can plan meeting in the future more effectively. Since we want Peapod to be accessible, we are also planning on porting this app to native devices as well as create a PWA version!