Skip to content

Latest commit

 

History

History
64 lines (42 loc) · 2.76 KB

README.md

File metadata and controls

64 lines (42 loc) · 2.76 KB

What's Cookin'?

Overview

In the mood to cook, but don't know what to make? What's Cookin' is an application which allows users to access a recipe repository. Users can search recipes based on name or type of meal, and add those recipes either to a list of favorites or to a list of recipes to cook.

This application was created by Nikki Balmoori, Rachel Hill and Oakley Windiate during our second module of the Front-End Engineering program at Turing School of Software & Design. The spec for this project can be found here.

How to Use

To access the application locally:

  • Clone the repository to your local machine
  • cd into the application
  • Run npm install to install the project dependencies
  • Run npm start to run the local server to see the HTML page
    • Paste http://localhost:8080/ into your browser to view the HTML page
    • If you need to stop running the local server, run Control + C
  • To view tests, run npm test

Application in Action

  • View a list of all recipes, click on a recipe of interest, and favorite a recipe from the main page.

favorites giphy

  • Search the entire list of recipes by a recipe name or by a recipe tag (ex: appetizer, dinner, lunch, snack, etc.)

search main giphy

  • Search your favorite recipes for a particular one you are looking to cook.

search favorites giphy

  • In addition to favoriting recipes, you can also add recipes to cook using the plus button next to the favorite heart button.

add recipes to cook giphy

  • A user can view the ingredients in their pantry by selecting "My Pantry" on the home page

my pantry giphy

  • When viewing your recipes to cook, you will be told if you have enough ingredients in your pantry to cook the meal.

cook recipe giphy

  • If you want to add ingredients, click "add ingredients" on your pantry page and fill out the form.

add ingredients giphy

Technologies Used

  • JavaScript
  • CSS
  • HTML
  • Test Driven Development using Mocha & Chai

Contributors

Challenges & Wins

  • This was our first experience building processes with Webpack
  • It was also our first experience implementing fetch API and post API to access remote data
  • We gained experience with Test Driven Development by writing tests
  • We also gained experience collaborating with other developers, ensuring the learning and development of each group member