Meals 4 Me

Inspiration

We wanted to create a website that helps people with deciding what meals to cook based on their personal preferences with health and dietary restrictions.

What it does

The website has a Google Firebase authentication system set up and takes the user to a "choose your preferences" page where they can choose what restrictions and types of meals they want to make. The website then gives a list of meals with pictures and a link to recipes.

How we built it

We built this website using React.js, HTML, CSS, and Google Firebase with Javascript for implementing the database. We also utilized the Edamam API documentation for requesting recipes.

Challenges we ran into

We ran into problems when trying to link the front-end and back-end branches, especially when dealing with the Google Firebase real-time database and the CSS styling and formatting syntax. We also had issues with trying to implement the Google OAuth sign-in method through Firebase on the login page.

Accomplishments that we're proud of

We are proud of being able to link the front-end and back-end branches and store all of the user information in the Firebase databases. This allows specific information users to personalize users experience using the website

What we learned

We learned to work with Google Firebase and use the various features that the database service offers. Furthermore, we learned of various SDK imported methods with React.js so that we could integrate the front end and back end effectively.

What's next for Meals 4 Me

We plan on implementing more queries so that the website will become very personalized for individuals and we hope to account for more filters such as calories and workout goals.