BudgetFridge

• 

  Home — Enter and Select Your Fridge Contents

• 

  Loading — We are cooking...

• 

  Recipe — Choose the Recipe You Like and Save It!

• 

  My Recipes — View and Remove Your Saved Recipes

Inspiration

We drew inspiration from our own experiences as university students trying to cook for ourselves with what's available in our fridge. BudgetFridge enables students to enter what's in their fridge and view what recipes they can make from it.

Key features

Ingredient selection — checkboxes on each item with a select-all/deselect-all toggle. Only selected ingredients are sent to the API.

Recipe generation — navigates to a loading screen immediately while the API call runs in the background, then redirects to the recipe page on success.

Save & revisit — recipes are serialised to localStorage under savedRecipes. Duplicate saves are prevented. The My Recipes page loads from localStorage with a card grid, popup detail view, and delete capability.

Persistent fridge — the ingredient list survives page refreshes via localStorage under fridgeItems.

How we built it

Our tech stack is tabulated below

Challenges we ran into

We faced a few challenges along the way since this was our very first UniHack. Our first challenge was meshing the frontend and backend together. Our frontend and backend teams worked separately until Friday night and we knew this needed to be implemented as soon as possible.

However, our biggest was right before the due date! We had difficulties getting the demo fully running on Vercel because everything was done locally until the very end. It was our first time trying to migrate it to an online platform and it was complicated moving from local hosting to an online platform. Ultimately, seeing it live was so exciting and a huge accomplishment for our team.

Accomplishments that we're proud of

We are proud that as a first-time team, we have created a polished final product that is fully-functional, user-oriented and deployed to an online service that is accessible to everyone on the internet.

What we learned

To move from a product idea, design a prototype, develop as a team step by step and reaching a final product. This is the first time for all of us to go through this process together, and we have learned a lot about working as a team and communicating our ideas.

What's next for BudgetFridge

Some functionality we didn't get toward was filtering the recipes down to required characteristics, such as:

• maximum budget cost
• cooking time
• parsing of a photo of the fridge (or pantry) to a series of ingredients
• support for allergies
• consumption of ingredients when recipes are cooked

Built With

• express.js
• react.js
• typescript