Dorm Eats

Inspiration

As college students, we understand the challenges of learning to live independently, including the need to cook for ourselves. Many of us struggle with unhealthy habits, often due to a lack of nutritious meals caused by limited cooking knowledge and confidence. Balancing tight budgets and busy schedules only adds to the difficulty. This leaves us searching for simple, convenient recipes that make the most of the ingredients we already have on hand.

What it does

Our website allows users to look through a list of ingredients, simply check off ingredients they have and be matched with the most feasible recipe. Once a recipe is selected, the user will be redirected to a dedicated page that provides more details about the recipe, including step-by-step instructions, estimated preparation and cooking time, and any additional ingredients or tools they may need. This layout ensures a user-friendly experience while making it easy for college students to cook delicious meals with minimal effort.

How we built it

We made use of Vite and React.js to build the front end. For the database of recipes and ingredients, we use Supabase to store this information.

Challenges we ran into

Some challenges we ran into were the initial set up and trying to connect the front end to a database, trying to make sure the filtering function worked properly, and formatting the webpage in a functional and visually appealing layout. We were a smaller group who were very new to programming with React.js, so it took a while to figure it out.

Accomplishments that we're proud of

We are proud of the overall design of the website and the functionality. We managed to make an end product that we believe is a great prototype for our future features!

What we learned

We learned how to write functions and develop the visual components of a website through Vite and React.js. We also learned how to use databases, such as Supabase, and connect them to our front end code. We also learned how to make visually appealing websites, using Figma to plan out what we want, and ultimately playing with CSS to make it work.

What's next for Dorm Eats

Features we hope to implement in the future include, but are not limited to, dietary restriction filters, the ability for users to add their own recipes and save favorite recipes, and a cost estimator for ingredients as well as the nearest places to purchase them. We want to make it an ultimate college student reference sheet while cooking their daily meals.

Built With

• css
• html
• javascript
• react
• supabase
• vite