Guest Homescreen 1
Guest Homescreen 2
Guest Homescreen 3
Add a food item to share
See available food items, we also had to show the approximate distance to each of the food items, and a CTA to request food.
Host receives a notification on a guest's food collection request
We were inspired to create the FoodShare app when brainstorming for social justice ideas that could solve issues connected with the Covid-19 crisis. As we all know, the crisis has led to an economic downturn worldwide and a lot of people have lost their jobs, especially in the hospitality and tourism fields, but not exclusively. Moreover, there is currently no end in sight and many of the people who have been affected, don’t know when they will be able to work again.
As is always the case, times of crisis can also bring out the best in people and there have been numerous reports about pantries popping up where people can leave their food to be collected by those who have nothing to eat. However, how can people find these pantries to either donate the food or to collect it?
Thinking along these lines, we saw that this is only one reason for people to share their food. Another important reason is that there is so much of it going to waste every day and there are no systems in place that would allow restaurants, stores, or individuals to share their food before it spoils. In this way, sharing the food becomes a win-win situation for all involved.
What the app does
There are two main functions of the FoodShare app: a registered user can list available food they want to share or they can see a list of available food items in their area.
If the user shares the food, they give the listing a name, describe what they have to give, select whether the food contains any common allergens and if it’s suitable for the most common diets, and give the food item an expiration date. If the food item is not collected before the expiration date, it will be archived in the system and not shown to users looking for food. If someone who is looking for food sends a request to pick up the food item, the person sharing can then communicate with them and set up a time and location that works best for them.
If the user is looking for food, they see a list of available items in their geographic area (determined based on their IP address). They can filter the list based on their allergies and diets. If they find a suitable food item, they can send a query to the user who shared it.
How we built it
For the application, we used React with redux & redux-sagas, and we borrowed elements from react-bootstrap. For the backend server, we used NodeJS and MongoDB as the database.
Challenges we had
Asheer: It was my first hackathon and I wasn’t sure how all of this will go. Given the time constraints, I was a bit apprehensive. But it was super fun to collaborate with my awesome teammates and I had an amazing experience overall.
Maia: Given that this was my first hackathon, I could not really imagine what to expect in advance. I came willing to learn and the main challenge I had was with the short deadline, which made me realize that it’s best to concentrate on what I already know and help the team as much as I can.
Philippa: The thought of working with and understanding the people I just met was the most challenging part. It turned out that they were amazing so I didn’t need to give in to my fears.
Tayeeb: Building a react app was pretty straight forward until I encountered the weirdest bug. Right now, it’s an hour left to the deadline and here I am with my arms crossed. Overall, it was an amazing experience, I’ve never worked with teammates of this enthusiasm and caliber, but unfortunately, it doesn’t look like we’re going to be able to finish what we started.
Accomplishments we're proud of
Asheer: Very happy with how everyone collaborated and contributed to the overall project. Was not expecting for this to go as well as it did.
Maia: I was quite amazed by how much we were able to accomplish together in such a short amount of time and I’m proud to have been a team member on this important project.
Philippa: I am proud of the fact that we worked so well together given the short period of time. Everyone’s opinions were taken int consideration and no one was left out.
Tayeeb: I have always struggled with CSS but this time I was able to reproduce a UI/UX design, and my attempt was pretty close to the overall design. So that’s something I'm happy about.
What we learned
Asheer: Projects worked together as a team come out a lot better than being individually worked upon. I had almost no experience of working together with other people on Github and this hackathon provided me an opportunity to experience that as well.
Maia: I can say that I learned a great deal and not only about the technical side of developing a web app, but also about the way hackathons work, how to work quickly in a team where members are not very familiar with each other’s skills, and how to pull together a viable app in a very short time. It’s been a huge learning experience all around. From the technical aspect, I learned about the structure of a React app and Bootstrap React components.
Philippa: Setting my priorities and above all the act of explaining myself to other people and collaborating with a team
Tayeeb: I overestimated what I might be able to do with 36 hours and this has been very humbling. Next time I will be more cautious of the time I have left and set my priorities straight. I also spent way too much time getting each pixel right, resulting in me not being able to get an MVP ready.
What's next for the project
The current version of the FoodShare app is the minimum viable product and we have so many ideas for what features we can add to make it more user friendly and grow with time. At the moment, the app determines the user’s location based on their IP address but we will also add an option for users to change their location in case they were not correctly located or if they’re using a VPN.
For those who are looking for food, the app lists food items available. In the future, we will also add an option to switch to a map view and see different areas or change the radius for which the items are listed.