Giter Club home page Giter Club logo

everybite's Introduction

EveryBite

Everybite helps you reduce food waste and save money. Simply enter the ingredients you already have at home, and EveryBite will show you recipes that include your ingredients. This app uses the Yummly API.

Enter the ingredients you have on hand: Screen Shot 2019-04-17 at 8 42 01 AM

Browse recipes that include all of your ingredients: Screen Shot 2019-04-17 at 8 42 42 AM

Click 'More Info' on any recipe card to see cooking instructions, nutritional information, and ingredient measurements: Screen Shot 2019-04-17 at 8 43 02 AM

Setup

In your terminal:
git clone https://github.com/JustinTorrance/EveryBite.git every-bite
cd every-bite
npm install
npm start

Tech Stack

  • React
  • Redux
  • React Router
  • SASS
  • Fetch API
  • Yummly API
  • Enzyme, Jest

Author

Justin Torrance
Github: https://github.com/JustinTorrance
LinkedIn: https://www.linkedin.com/in/justintorrance/

everybite's People

Contributors

justintorrance avatar

Watchers

James Cloos avatar

everybite's Issues

Iteration 1 Functionality (MVP)

  • Allow users to enter up to 5 ingredients which they already have on hand

  • Return recipes from Yummly api based on user's ingredients

    • Display each recipe's name, image, cook time, and full ingredient list on card
  • Implement router

    • / displays the ingredients form
    • /recipes displays the recipe cards
  • 404 page

  • Implement Redux

  • PropTypes

  • Loading component

  • Error handling component

  • Clicking on Card will direct you to webpage containing that recipe

Iteration 1 Testing

  • Actions

  • Reducers

  • Thunks

  • mapDispatchToProps

  • mapStateToProps

  • components are unit-tested

  • prop-types

Iteration 2 (Extensions)

  • User can enter food allergies/restrictions into an input. Returned recipes must not include any restricted ingredients

  • Masonry to style CardContainer

  • Include a 'Show More' button at the bottom of each page, which renders 10 more recipes

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.