Giter Club home page Giter Club logo

cookbook's Introduction

Welcome to our recipe searching app! This app was created through the collaboration of 3 developers. Their github links are available on the contributors tab on the side bar.

The goals of this app are as follows:

Allow a user to search for recipes, based on a few ingredients
Allow a user to search for replacement ingredients to ingredients they do not want to use
Allow a user to save their favorite recipes for reference later

My primary task for this app was to work on the Javascript logic behind the scenes, in order to make the app display the appropriate results.

In order to accomplish these task, our app uses the RecipePuppy API to find new recipes, and the Spoonacular Recipe Substitute API in order to find replacement items. The favorite recipes are saved via localstorage.

Getting Started

When the page is first loaded the user will be shown the home page for our app, on this page the user can search for recipes using a list of ingredients.

The ingredients need to be entered in with a comma(,) separating them in order to generate a list of recipes. If nothing is entered, a default list of recipes will be shown. There are also previous and next page buttons to generate another set of results using the same search parameters.

Homepage

Each recipe will display the name of the recipe, a list of ingredients needed, an image of the recipe (if there is one available), and a button that will allow the user to save the to their favorites list.

Recipe Results

If the user saves chooses to save a recipe they will be asked if they want to save the recipe to their favorites. If no is clicked they will be returned to their search results, however if yes is clicked, the recipe will be saved before being returned to the search results

Save Recipe

On smaller windows our app will have a dropdown menu for the rest of the pages that are included, and on larger windows the navbar will show links to all of the pages directly.

Navbar

Home will return the user to the recipe search homepage.

Substitute Ingredients will bring the user to our subtitute ingredients function

Favorites will bring the user to their list of saved recipes.

Sign Up / Log In will bring the user to our Sign Up and Log In pages, however these pages currently do not have any functionality and planned to be added at a later date.

Substitute Ingredients

On the substitute ingredients page, the user will be able to enter an ingredient and receive a list of substitutes that are available for that ingredient.

In the example below we entered butter as an ingredient, and are given a list of options that we can use to subtitute for butter. Substitute Ingredients

Favorites Page

Finally, the favorites page will show a list of the recipes that the user has decided to save. On this page the user will be shown their saved recipes by name and with a weblink to the saved recipe. They are also given the option to clear their favorites and are asked for an answer before their favorites are deleted. Favorites Page

Future Development

Here are some planned improvements for the app as it currently stands:

Fix display of images on live website - The recipe images will not display on the live site due to a security issue. May need to change API's or use a different method.
Change favorites to show more than just a recipe name
Add functionality to user login and sign up pages

cookbook's People

Contributors

alexander-camacho avatar vpickard707 avatar willtham1 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.