One of our team members, Welvin, was outside looking for a snack before the hackathon started, but he had no idea where the vending machines are or what was available in them; therefore, he came up with the idea of an app that let's you find them.

What it does

The app allows the user to pick their favorite snack, and it will give the user all nearby vending machines that have the snack and plot their location on a map. It also provides additional info such as what else is available at a specific machine if you choose a vending machine on the map.

How we built it

We used react-native to build a cross-platform mobile app, with the react-native-maps component and google maps api. We also used Firebase for the database of locations of vending machines. We also built a plain JS, HTML, CSS frontend for vendors to add their own vending machines.

Challenges we ran into

We had problems with react-native-maps not loading the map correctly, leading to various errors, which was solved by configuring the ios settings of react-native. UI/UX was something we had very little experience with, so we talked with the mentors about that and have a much better UI/UX than we had before.

Accomplishments that we're proud of

We are proud of the map and the functionality of the react-native app in general, as it works quite well and smoothly with features like getting current locations.

What we learned

We learned how to use Firebase extensively to build a real application and many things about react-native. We also learned much of UI/UX by talking to the mentor.

What's next for Snackdar

We can add many features. We can add raspberry pi support and more custom hardware support to be able to change vending machine item count in real-time. We need to fully integrate and better setup the Firebase as it is very hacky right now. We can also add Alexa and Google home support so people can just ask those assistants about the location of vending machines.

Share this project: