Skip to content

React/Rails: Finds recipes based on the ingredients you have in your fridge, and creates a shopping list for what you need.

Notifications You must be signed in to change notification settings

rachelgould/clean-spoon

Repository files navigation

Clean Spoon

Have you ever thrown out groceries because you didn't know what to make?

Clean Spoon lets you track what's in your fridge, find thousands of recipes based on the food you have, and add ingredients you need to your shopping list.

You can also reference the recipes you like with our saved recipes feature, or send your shopping list to your phone via SMS.

Contributors

This was a group project for the Lighthouse Labs web development full-time bootcamp. Contributions by Rachel Gould, Patrick O'Connor, and Tristan Berezowski.

Development

Our basic tech stack is Ruby on Rails on the back-end, and React on the front-end. It uses external APIs from Qwant (for supplying ingredient images), Twilio (for SMS notification with shopping list), and Yummly (for searching and retrieving recipes).

Demos

Homepage

Fridge

Adding items to your fridge

Recipes

Searching for recipes

Shopping List

Adding recipe items to your shopping list

Setup

  1. Fork and Clone
  2. Follow below instructions to install dependencies.

In the command line:

bundle
cd client
npm i
cd ..
  1. Create config/database.yml by copying config/database.example.yml
  2. Create config/secrets.yml by copying config/secrets.example.yml
  3. Create .env by copying .env.example
  4. Run bin/rake db:reset to create, load and seed db
  5. Start with rake start

Overview

create-react-app configures a Webpack development server to run on localhost:3000. This development server will bundle all static assets located under client/src/. All requests to localhost:3000 will serve client/index.html which will include Webpack's bundle.js.

In this example, the React component App makes a request to an API server (server.js). The user's browser visits the Webpack dev server at localhost:3000. Then the React client communicates with the API server when needed at localhost:3001:

This setup uses foreman for process management. Executing foreman start instructs Foreman to boot both the Webpack dev server and the API server.

Dependencies

Back End:

* Rails
* jbuilder
* sdoc
* foreman
* postgres
* twilio-ruby
* rest-client
* dotenv-rails
* combination_generator
* combinatorics

Front End:

* axios
* babel
* bootstrap
* http-proxy-middleware
* react
* react-bootstrap-table
* react-cookie
* react-datepicker
* react-dom
* react-router-dom
* reactstrap

Acknowledgements

Initial scaffold based on create react app with rails API tutorial by Anthony Accomazzo.

About

React/Rails: Finds recipes based on the ingredients you have in your fridge, and creates a shopping list for what you need.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •