/Recipe-Mapper

A web-application designed to help people from around the world discover new recipes and learn new cultures, at the comfort of their home!

Primary LanguageJavaScript

🍽 Recipe-Mapper

Hackathon project @ HackAttack. A web-application designed to help people from around the world discover new recipes and learn new cultures, at the comfort of their home!

Figma Application Prototype

A Figma prototype was created to demonstrate the purpose and functionality of our application

Link

Recipe Mapper

Sign Up/Log In Page

Signing up and logging in is a standard feature over most applications so we decided it would be a good idea to implement it It is quite easy to follow, you can choose either log in and sign up. Then when you click sign up or log in it will fill in the section automatically for demonstration purposes.

Map Page

This page displays a map of the world with three sample locations Mexico, India, and Italy.

List of Recipes Page

If the user clicks on one of the locations it will bring up a recipe menu with different recipes native to location. You can click on the top left icon to return back to the previous page (map page). Mexico's first recipe is a clickable recipe example (only one recipe was created for demonstration purposes although in reality they would all have linked recipe pages)

Recipe Page

A clickable sample Recipe Page was created for "Carnitas-Pressure Cooked" for demonstration. This page is what actually gives you the recipe information. It contains both a button at the bottom to return to the previous page but you are also able to return using the top left logo.