MyFridge

• 

  Home page

• 

  Log in leads to inventory page

• 

  Filled inventory page

Inspiration

You often go grocery shopping, fill in your fridge and forget what you have in it. The forgotten food turns bad and just becomes food waste. There are various reasons why this happens: not knowing what to make with the food and not remembering what you have exactly are two main reasons for it.

What it does

MyFridge is a web-based application that helps you track what is in your fridge straight from your grocery list. It provides a platform where you can create a grocery list, our database recognizes common items and estimates the best-before times. Additionally, it suggests healthy recipes based on the contents of your fridge.

How we built it

Our first prototype uses HTML, CSS and javascript to create, display and stitch buttons and functions together.

Challenges we ran into

It was the first time our team decided to code something like this. Also, we realized that CSS is very much not intuitive and time-consuming when not familiar with it. It took us a lot of time to figure out how to make it aesthetically pleasing, and it was at the cost of some functionality.

Accomplishments that we're proud of

First Hackathon. Learnt the basic of javascript and CSS as well as HTML in a few hours, and applied it. It was a lot of fun working among ourselves and it is the first time we've worked together.

What we learned

We learned how to use Figma to quickly create design concepts. We also improved our skills in HTML, CSS, and Javascript. Lastly, we learned how to use API's by integrating Google's font library.

What's next for MyFridge

We plan to improve our website, by adding features such as shopping list scanners, remaining portion of ingredients, and customization of “Make a meal” plan.

Built With

• css
• html
• javascript