endonoh0 / winged-it

A recipe web app for users to search for recipes, ingredients, and local farmer's market in Vancouver.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Winged It

Wingin’ it here. Why waste your time thinking about what you should make to eat when you could just wing it? If you wing it, we provide you a flexible and customize experience for planning your meal rather than guessing what you need. Simply look in your fridge and type in your ingredients.

This is our final project for the Lighthouse Labs Web Development Bootcamp where we build an application from the ground up.

  • Testing: Storybook, Katalon
  • Front-End: React, Sass, Boostrap, MapBox, Material UI, Framer Motion, iFrame
  • Back-End: Node, Firestore

Main Features

  • Searching for recipes based on ingredients, health and diet
  • Modal that links to external website
  • MapBox for farmers’ market
  • Favorite/Edit/Delete Recipe
  • Seasonal Availability for ingredients
    • Click on a seasonal ingredient to have it redirect to the results page with that ingredient as one of the tags
  • Compatibility to smaller screen

Screenshots

Recipe Results

Customize your recipes based on health and diet labels.

Recipe Instructions

Find out more information about your recipes in our recipes modal.

Farmer's Market

Look for local ingredients nearby using Mapbox.

Installation

  1. Fork and then clone this repository into your machine.

  2. Install dependencies using the npm install command.

  3. Start the web server using the npm run start command. The app will be served at http://localhost:3000/.

  4. Search for your first recipe today!

Dependencies

  • react
  • react-dom
  • node-sass
  • classnames
  • react-cookie
  • react-scripts request-promise
  • react-router-dom
  • react-scrolllock
  • react-onclickoutside
  • bootstrap: 4.5.x or above
  • firebase: 7.17.x or above
  • mapbox-gl: 1.11.x or above
  • react-iframe: 1.8 or above
  • react-icons: 3.10.x or above
  • react-map-gl: 5.2.x or above
  • framer-motion: 2.3.x or above
  • material-ui/core: 4.1 or above
  • react-bootstrap: 1.3.x or above
  • material-ui/lab: 4.0.0-alpha.56
  • react-map-gl-geocoder: 2.0 or above

About

A recipe web app for users to search for recipes, ingredients, and local farmer's market in Vancouver.


Languages

Language:JavaScript 85.6%Language:CSS 14.1%Language:HTML 0.3%