Can You Cook It?
Authors: Anshul Mathew, Katerina Bosko
Class Link
The project is part of the CS5610 Web Development at the Northeastern University.
Project Objective
Say you would like to cook something but you don't know what to cook with the ingredients available at his home. CanYouCookIt app allows you to find recipes based on the ingredients you have at home. It allows you to keep a track of the ingredients and save recipes that you find interesting. It enables search based on the ingredients you want to use.
Deliverables
Design mockups & User Personas (also in deliverables folder)
Deployed app: https://canyoucookit.onrender.com/
Screenshots
Milestones
60% progress has two releases:
100% progress has two releases:
final code for grading release:
Features
- Add ingredients to your inventory
- Provide suggestions via auto complete as you type items you want to find in the search bar
- You can delete items from the inventory if you are out of stock
- View your current stash of food items
- Get recipe information based on food items you own
- Save recipes that you like
- Recipes provide the ingredients and the method to cook it as well
Tech
Our App uses a number of open source projects to work properly:
- Node.js
- Express.js
- Bootstrap
- HTML/CSS
- MongoDB
- Docker
- React
And of course CanYouCookIt is itself is open source with a public repository on GitHub.
Using the app
We use external API - Spoonacular - to find the recipes and there are only 150 API calls for free per day. If the limit is depleted, please come back next day.
How to use the app:
- Start adding ingredients on Inventory page. To enable the “Add” button, you must select an ingredient from the dropdown menu.
- Update your ingredient’s list by deleting ingredients you no longer have by clicking on “X” button
- Use checkbox to add ingredients to the search and press “Find Recipes” button to search for recipes based on the checked ingredients.
- Explore the recipes returned from the search by clicking on the recipe card on the left.
- Add recipes you liked from the search to your recipes collection by pressing “+” button on the right.
- Go to Recipes page to see your saved recipes.
- You can edit the recipes by double clicking on title, ingredients or instructions on the right.
- You can also add your own recipes with your custom images by clicking on “+” button from Recipes page.
- Finally, you can delete recipes you no longer want to keep by clicking on “trash” icon on the right.
Installation
Setting up the database
For the database CanYouCookIt uses MongoDB in the backend. To set it up run the following commands
docker run --name mongodb -d -p 27017:27017 -v YOUR_LOCAL_DIR:/data/db mongo
Using this method, you will be able to connect to your MongoDB instance on mongodb://localhost:27017. You can try it with Compass, MongoDB’s GUI to visualize and analyze your data. Don't forget to shut down the docker instance after use.
Setting up the servers
CanYouCookIt requires Node.js v10+ to run. Install the dependencies and devDependencies and start the back end-server.
cd CanYouCookIt
npm i
You can intialize the database by running the following commands
npm run initializeDB
You can setup the front-end server by running the following commands
npm run postinstall
Running the project
Run the following command from the root directory of the project to spin up the project's back-end server in a new terminal
npm run start
To start the front-end server, you can run the following commands in a new terminal
cd front
npm run start
Open up a browser and navigate to http://localhost:3000/
Enjoy!
License
MIT Free Software, Hell Yeah!