PantryPal

• 

  Home Page

• 

  Recipes Page

Inspiration

As college students who are just beginning to live and cook independently, one of our biggest struggles (and we’re sure many others can relate!) is figuring out what to make with the random assortment of ingredients left in the fridge. More often than not, we end up grocery shopping on a whim without planning ahead, only to watch in disappointment as once-fresh produce turns into fridge casualties a week later...

This relatable frustration became our main source of inspiration. We wanted to solve this all-too-common problem and make cooking not just easier but more intentional and fun.

What it does

Our website is like a personal kitchen assistant! It takes in user information such as cuisine preferences, available cooking utensils, dietary restrictions, and of course - the ingredients the users have sitting in the fridge. The app then connects to Spoonacular - a food api with more than 5000 recipes and 2600 ingredient information, and it suggests customized recipes tailored perfectly to the user's needs and preferences. No more wasted ingredients, no more decision fatigue.

How we built it

We worked with the MERN stack for this project. We utilised MongoDB for storing and managing user login information, Express.js to simplify server-side code with middleware and routing capabilities, React.js for the frontend where we build an interactive, easy to use and visually appealing UI, and Node.js as the runtime environment for executing server-side code.

Challenges we ran into

Most of us had only worked with JavaScript very few times before, so refreshing those concepts within a 24 hour period was quite the task. Especially when it came to establishing an end-to-end connection from the API to the React frontend, we kept running into server side errors that took us hours to debug. Every error led us to gain a more comprehensive understanding of the task we were dealing with!

Accomplishments that we're proud of

This was our first time working with the complete MERN stack, and the fact that we had at least gotten the user sign-in and the user data management to work using MongoDB is an accomplishment that we are truly proud of. The 24 hour timeline also allowed us to be productively efficient, allowing us ample time to deal with errors and not have to rush through anything!

Built With

• api
• css
• database
• express.js
• javascript
• mongodb
• node.js
• react
• tailwind