Hungry Helper

Home page and form
Recipe result page

Inspiration

We noticed that we often could not find recipes online that fit the list of ingredients that were available to us. We were a group of hungry, carless, penniless high school students who were often stuck at home alone during the summer, and with COVID-19 keeping the businesses in the neighborhood down, it was hard to find ways to satisfy our hunger. We had to cook for ourselves, and we were usually missing many ingredients, and had to either find iffy substitutes or spend hours searching for a suitable recipe. So we decided to take matters into our own hands and create an application that would allow the user to easily find recipes based on the ingredients currently at their disposal. Along with this, we decided to add other search parameters, such as specific recipes, dietary restrictions and calories

What it does

It is a web application that welcomes users with a clean, easy-to-use UI and uses the Spoonacular API to get a recipe based on the user's search parameters (which include what's in their pantry, allergies, specific dishes etc.) . The application searches for recipes that can be made easily by the user without using many additional ingredients.

How we built it

We used jQuery and Bootstrap for the front end and some Flask for the back end. We also used Photoshop to design the logo and Figma to plan out the UI. Initially we had decided on using ReactJS for front end interactivity, but ended up deciding that jQuery was better suited to our purposes.

Challenges we ran into

Because we did a lot of research and brainstorming prior to the event, the project initially progressed very smoothly. However, once the environment was set up and the frameworks were linked, more issues began to pop up, chief among them being that we had no idea how to take multiple inputs from HTML input forms with Flask. However this is where the mentorship program was really useful. We submitted a request, and less than an hour later we were greeted by a mentor who helped us quickly and effectively resolve our issue. We also entered another request about hosting and came across ngrok, a tool which we used to host our site.

Accomplishments that we're proud of

We are very proud of our UI, as it achieved the aesthetic that we were looking to create from the start, and looks very clean and gets the job done very effectively. We are also proud of learning all the technologies and languages used in such a short amount of time. We are also proud of the accuracy of our application's food recommendations, which match the match the search parameters set by the user very well.

What we learned

We learned a lot of new technologies and the both of us learned new programming languages. We had to learn most of the technologies that we used on the spot. Most of our knowledge about these technologies came from the Gear Up workshops. Aayush did not know much about web development and Carl did not know any Python nor what an API was prior to this hackathon, and we had to learn a lot of new technologies which was very exciting. We were able to meet many people in workshops and events, and managed to learn a lot and took away lots from this experience.

What's next for Hungry Helper

We want to add more search criteria, and make the search process more user-friendly. We also plan on sourcing recipes from a variety of APIs, which will give us access to a greater variety of recipes and cuisines. We will also display the ingredients and instructions on our own page rather than linking to other sites, which will make the application easier to use.

Another feature that Hungry Helper will receive is a predictive model that learns your food preferences and recommends the recipes that the user will most like. This will give the user a positive meal experience almost every time they use our service.

Due to the possible use case of Hungry Helper as a meal planning tool, we will also add a diet planning system, which will allow you to stay calorie-conscious while still enjoying the foods you love.