/recipe-snap

A React Native app that generates recipes based on photos, built for Grace Hopper's 4-day Hackathon

Primary LanguageJavaScript

Recipe Snap

About

A React Native mobile app that can search for recipes based on ingredients detected in food photos (either from your camera roll or directly from your camera) and lets you save/dismiss them through them in a Tinder-like swipe UI.

Created for the Grace Hopper Program at Fullstack Academy's 4-day Stackathon. See this video for a short 4 min presentation of the app!

This project was bootstrapped with Create React Native App and uses both Clarifai's image recognition API (using the Food model) and Edamam's recipe search API.

Chooing a photo from the camera roll

Choosing ingredients and swiping through recipes

How to run locally

  1. Clone and/or fork this repo
  2. Run npm install to load dependencies
  3. Create a src/secrets.js file with your Edamam Recipe Search ID and Key and Clarifai API key as shown below:
import Clarifai from 'clarifai'

export const clarifaiApp = new Clarifai.App({
  apiKey: 'YOUR_API_KEY' // your key must have access to the Predict scope
})

export const edamamId = 'YOUR_ID_HERE'
export const edamamKey = 'YOUR_KEY_HERE'
  1. Choose an option from below:

npm start - Runs your app in development mode. You can use the Expo app on your phone to scan the QR code to run it. It will reload if you save edits to your files, and you will see build errors and logs in the terminal.

npm run ios - Just like npm start, but also attempts to open your app in the iOS Simulator if you're on a Mac and have it installed.