susannaopal / whats-cookin

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

🍝 What's Cookin'? πŸ§‘β€πŸ³

This application was created as a group project for the Turing School of Software & Design.

Abstract

Welcome to What's Cookin'! A recipe and meal preparation application. This application allows the user to peruse a list of tasty recipes and create a list of their favorite ones. Feel free to add recipes and ingredients to your favorites page and shopping cart in order to plan your weekly meals.

Home Page View

When the page loads, there is a random user generated whose name appears in the header. From the main page, the user will scroll through a list of recipes and have the option to favorite recipes.

Adding and Removing Favorites

The user can add and remove recipes to their favorites list by clicking the "Favorite" button. The user can view the recipe card by clicking on the title of the recipe. The recipe card features the ingredients, directions, and estimated total cost for each recipe. From the recipe card page, the user can add/remove the recipe from thier favorites list or add to their shopping cart. The "Home" button will navigate back to the main page.

Search and Filter Functionality

The user has the ability to search for meals by ingredient, recipe name, or tags. The page will filter out recipes according to what the user inputs as their criteria.

Pantry Functionality

Upon clicking on a recipe, the user will be taken to a view of the recipe card, to see if their pantry has the needed ingredients and amounts for their recipes. Additionally, on the recipe card, a user can see the entire contents of the pantry available to them. If the user is missing ingredients, they can opt to purchase the ingredients and cook the recipe. This functionality is created through the use of fetching and posting to our local server APIs.

Installation and Setup:

To navigate the website live, a server download is required.

  1. In your command line, cd into your local directory and clone down this repository -
    git clone git@github.com:Emily-Cathleen/whats-cookin-starter-kit.git
  2. Install the necessary package dependencies -
    npm install
  3. Run the command npm start
  4. With both the server running and this package, and visit http://localhost:8080/ in your web browser.

Code Architecture

  • JavaScript
  • HTML
  • CSS
  • Mocha
  • Chai
  • Node.js
  • Atom
  • VS Code

Architecture & Planning

Find the Turing project spec HERE We utilized github projects to manage the workflow of this application, that board can be found HERE

Project Members

This project was completed at the Turing School of Software & Design. Functionality and design by

About


Languages

Language:JavaScript 97.6%Language:SCSS 0.9%Language:CSS 0.8%Language:HTML 0.7%