Skip to content

PoPsMokE07/recipe-match

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Inspiration!

As college students, food is always something that is on the top of our minds. Maybe its because of stress, or a new lifestyle but we always seem to be thinking about FOOD!!

However, as a college student, it can be difficult to think of recipes for healthy, tasty meals.

Cooking requires a significant time and effort in and outside of the kitchen (the planning that precedes before the actual act of cooking tends to be longer and tedious)

And with our busy academics and extracurriculars, we dont have time to browse Google to look for recipes that we hopefully have ingredients for.

In addition, it can be hard to keep track of all the food/ingredients we have hoard in our drawers or kitchen cabinets.

That's why we created Recipe Match

A web application that helps match ingredients with recipes you will LOVE

What it does

Recipe Match allows you to store and keep track of all the food that you have in your pantry. All you have to do is go on the app, sign in with your Google account, and add your ingredients/food.

Once your pantry is created, you have the option to create recipes for meals from ingredients/foods of your choosing.

Once you have selected the ingredients you want, just click "Generate Recipe" and a recipe for a delicious meal will generated.

How we built it

The app was built using React.js(a javascript framework), and Bulma(a CSS framework)****

For backend server-side functionality, Google's cloud platform, Firebase was used.

  • Authentication: "Sign-in with Google Authentication" - provided by Firebase
  • Realtime Database: Storing user accounts and associated pantry data

To generate recipes from provided ingredients/foods, we used the Edamam "Recipe Search API"

Edamam API

App/Data Visualization

Challenges we ran into

Learning a new technology: This project was our first time using the Google Cloud Platform, specifically: Firebase. There were multiple points throughout the project where we were struggling with the Firebase SDK which prevented us from moving forward.

However, Google has provided developers with great documentation regarding Firebase. As a result, we were able to overcome our challenges by understanding and implementing the documentation.

In the end, learning and using Firebase was fun and we cant wait to use it on future projects Thanks Google!

## Accomplishments that we're proud of

Rishi Magiawala: Full-stack developer "I was proud of learning a new technology(Firebase) and using that to build a robust application that has the potential to change the eating habits of college students and people who struggle with staying healthy"

Suryangsu Chandra: Learner/Mentee "I was proud of learning from Rishi about proper development methodologies and also how to combine front-end and back-end technologies to make one seamless web application"

Sudiksha Panda: UI Designer/Mentee "I was proud of learning UI/UX design tools such as Figma to develop prototypes of the web app. It has really inspired to pursue a career in UX design.

What we learned

Through brainstorming the project idea, we learned how to be independent as a college student and the importance of a healthy diet. Since most of us were first time hacker we learned using ReactJS, we learned about CSS, JavaScript, HTML.

Also, while integrating API we were able to grasp an understanding of JSON structure usage in the Web applications and asynchronous functions.

We made sure that the interface is user-friendly, simplifying every procedure to the best of our ability, through which we learned UI/UX feedback method.d

What's next for Recipe Match

The team has a ton of ideas on what we can implement next. We hope to further develop the app and hopefully also release a mobile version of it as well.

One idea we have is to use AI and image recognition as an easier way to enter items into a user's pantry without them having to manually type it in.

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 74.3%
  • CSS 14.1%
  • HTML 11.6%