Pines&Butter Recipe Finder App

A recipe finder app that answers to the question: "Too lazy to shop. What can I cook from my leftovers?"

Built with React and utilizes recipe data from Spoonacular API + ingredient autocomplete from Tasty API.

Check out the deployed site

Core packages

Hooks, Context API - State management
React-Router - Routing
SCSS - Styling
Axios - Network call

Features

Add/remove items in pantry
Search recipes according to pantry items
Search recipes according to keywords
Favorite/Unfavorite a recipe
Add an ingredient to grocery list
Remember the recipe that the grocery item was added from
Pantry item input autocomplete

Running locally

Inside of your project file create an .env.local file with the following contents:

REACT_APP_API_KEY=<YOUR_API_KEY>

Then run npm i and npm start to see the app in action.

Sections walkthrough

Add ingredients to Pantry with autocomplete suggestions

Search for recipes from Pantry ingredients

Faved Recipes (Recipe Book)

Recipe Details

Grocery List

Search section for dish name/style