/foodfinder-1

Primary LanguageJavaScript

FoodFïnder

Hack the North 2021

By Angela Du, Dylan Xiao, Rohan Batchu, and Simhon Chourasia

Inspiration

The inspiration for our project is mainly how indecisive we are as a group and our need to try new things! Earlier in the year, we, as a group, had spent almost half an hour deciding where to eat for lunch. Not the best usage of time, leading to the inspiration to build this app.

What it does

Our app is essentially a Tinder app for people to decide where to eat. Users can log in with an 'address', which connects them to another person. Both members are given a list of restaurants in which they can either swipe left (do not want to eat here) or swipe right (want to eat here). They can then go to the ‘Matches’ tab to see where both people want to eat!

How we built it

Through the use of sheer determination and luck, we were able to build together a web app coded in CSS, react, javascript, MongoDB, and the yelp API. We used npx create-react-app to initially create our application, then we used JS and CSS to build the front and backend, connecting with MongoDB and yelp API for functionality.

Challenges we ran into

We spent 4 hours trying to figure out how to access the yelp API. Thanks to a great mentor (Dan) we were able to get past this roadblock. Another challenge was importing CSV files into MongoDB to store the key information about the restaurants found through the API. By reading the documentation for MongoDB, we were able to figure out how to read and write to the database. In addition, we had some CSS issues in which certain elements appeared incredibly pixelated for no real reason. To counter this, we changed the design so that the pixelation was not noticeable.

Accomplishments that we're proud of

Tinder-Esque card swipes. Active database updates after each swipe Active Location-based database changes Interesting and clean front end appearances

What we learned

As many of us are relatively new to web development (using react in particular), we needed to learn a lot about how the different languages were together, and how to use them all together. In addition, we also learned how to use certain APIs to accomplish our goals, and how to connect them to our frontend. We especially learned how many components work together to accomplish one task, and how we may use this to work on our tasks.

What's next for FoodFïnder

Given that FoodFinder was coded in only 2 days, there are multiple pathways to which we can expand. The main one could be using machine learning to have restaurant recommendations to be more personalized. I.e. If someone only swipes on a certain price, then they will have more cards with that price. In addition, we could expand the area and include more features.