Spoiler Alert — Shared Fridge Tracker
A React and Flask application for tracking shared fridge contents, expiration dates, recipes, and missing ingredients.
Technologies Used
Spoiler Alert — Shared Fridge Tracker
Table of Contents
Where it started
Spoiler Alert was my first substantial full-stack web project. The original idea was simple: a shared fridge should be able to tell its users what is inside and what needs to be eaten soon. From there, the project grew into accounts, shared access, recipe suggestions, and shopping lists.
Building it early in college forced me to work through the entire path from a button in React to a database update in Flask. That experience is still more memorable to me than any single feature.
Fridge inventory
Users can create a fridge, share access to it, and add food with a quantity, unit, category, expiration date, and freezer status. The visual fridge interface makes the inventory feel spatial, while search and sorting make it useful once the list becomes long. Items approaching their expiration date receive a clear warning.
The backend stores users, fridges, fridge access, contents, recipes, wishlists, and wishlist items in related MySQL tables. The Flask API has separate operations for creating, reading, updating, and deleting these records.
Recipes and shopping
The React frontend includes Google’s Generative AI client for suggesting categories, estimated expiration dates, and recipes based on the ingredients on hand. A user can save a recipe, compare its ingredient list with the current fridge, and add only the missing items to a wishlist.
The useful engineering problem was not simply generating a recipe. The application had to turn an uncertain model response into data that could be checked against quantities and inventory records. I kept the deterministic inventory logic separate from the generated suggestion.
Accounts and shared access
The Flask service hashes passwords with bcrypt and issues time-limited user tokens. Fridge access is modeled separately from ownership, so more than one account can use the same inventory. The frontend talks to the API with Axios and React Router organizes the login, fridge, recipe, and wishlist screens.
The repository reflects a student project rather than a production security model. For example, its authentication and broad CORS setup would need a careful review before internet deployment. Documenting that limitation is more honest—and more useful—than presenting the prototype as finished software.
What the project changed for me
Spoiler Alert taught me how quickly “just add one feature” spreads across a UI, an API, and a relational schema. It also gave me a solid reference point for later projects: I now start by drawing the data model and failure cases before polishing the interface.
The public GitHub repository includes the React frontend, Flask API, and database helper modules.