Try It Here (Final Project)

https://pickup-ffaa3.firebaseapp.com/

Inspiration

It is extremely common for restaurants to make more food than they sell. Wasting food is not only a social or humanitarian issue but also an environmental issue. When we waste food, we also waste all the energy and water it takes to grow, harvest, transport, and package it (usda.gov). If food goes to the landfill and rots, it produces methane—a greenhouse gas even more potent than carbon dioxide (usda.gov). US restaurants generate an estimated 22 to 33 billion pounds of food waste each year (foodprint.org).

Furthermore, restaurants are protected legally when it comes to donating food. Passed in 1996, the Bill Emerson Good Samaritan Food Donation Act protects restaurants from civil and criminal liability should a recipient get ill or hurt as a result of consumed donated food (huffpost.com). We wanted to create something that would help reduce food waste, reduce our environmental footprint, and help people in need. This can be beneficial for restaurants as well by saving money for waste management and allowing restaurants to be more involved in their community.

Last but not least, according to a study, around fifty-percent of homeless people have cell phones which allows our application to not only help people with homes but also people without homes (homelesshub.ca).

Sources:

  1. https://foodprint.org/issues/the-problem-of-food-waste/

  2. https://www.usda.gov/foodlossandwaste/why

  3. https://www.huffpost.com/entry/restaurants-that-dont-donate-because-of-liability-are-just-making-excuses-experts-say_n_577d6f92e4b0344d514dd20f#:~:text=Passed%20in%201996%2C%20the%20Bill,gross%20negligence%20or%20intentional%20misconduct.&text=%E2%80%9CThere%27s%20no%20reason%20not%20to%20donate.%E2%80%9D

What it does

Pickup links the restaurants that are about to waste their food to people who are in need of this food. It does this by allowing the restaurant to place its current location as markers so that users (people who need the food) can go to the markers and put up the leftover food. In order to reach the map screen, users (both restaurants and consumers) must Google authenticate themselves. Moreover, the restaurants can add markers, but also delete markers when the portions of food from their restaurant are all given away.

How we built it

We used React to customize the layout of our website and serve the front end of our application. We also then relied on Firebase google authentication to authenticate our user base. Firestore database was utilized to manage the marker data and reflect the changes in real-time in the front end using a snapshot listener. Additionally, we used mapbox-gl to display a map and also used geo-coding API to turn addresses into coordinates for markers.

Challenges we ran into

Initially, we had a tough time finding a map component package that worked with React. We stumbled upon MapBox, but there wasn’t an official React library for this tool. Eventually, we were able to find a React binding for Mapbox GL. However, customizing the map was a bit difficult as there wasn’t good documentation. It also had some weird quirks and performance issues. After a couple of hours of hacking, we got a barebones map to work. We also ran into several issues with the Firebase connection due to some config errors.

Accomplishments that we're proud of

We were able to create a working full-stack application within 24 hours that interacts with the Mapbox and Firebase SDK. This was the first hackathon for most of our team members, but we still managed to work together in a remote environment to build a complete prototype. Further, the fact that we were able to fully develop a prototype and then host it on the web is amazing.

What we learned

We learned various different technologies. Throughout the event, we had a lot of difficult problems, but it was also quite fun to debug and solve the problems. We learned how to interact with the Mapbox API to create a map with pins at the registered restaurant locations and update the data to firebase. We also explored various React styling libraries to make our design.

What's next for Pickup

Further projects can extend outside of food. For instance, the application could support items such as clothes. The same concept would apply to these items where one user marks their location and other users can go to the location if they want the items. Moreover, we can make a dashboard that outlines the environmental benefits and energy saved for each restaurant when they donate their food instead of throwing it away.

Built With

+ 1 more
Share this project:

Updates