Recipe made Easy! - Mobile Repo

 

 

 

 

Table of Contents

• Table of Contents
• Introduction
• Key Features
• Installation
• Technologies Used
• Eggroll Team Members
• Developer Notes
• Credits

Introduction

Our mobile app allows you to scan items in your pantry and suggest recipes based on the ingredients scanned. Based on the suggestions, you can also vote with your family and friends what you all want for dinner!

This project is divided into 3 parts: mobile, server, and website. This repo, mobile, has the code of our mobile app. The server repo is the one that contacts Spoonacular API. The website repo allows people to vote for people's favorite recipe.

We hope that you have fun and enjoy our app!

Key Features

+ Item Quikshot - Add items on your pantry through your camera or text.
+ Recipe Finder - suggest recipes based on the items on your pantry.
+ Recipe Selector - Vote for the best recipe for your next meal. The app can add more voting participants.
+ Data Storage - Create an account and store your favorite recipes.
+ Mobile Cross Platform - Works with Android and iOS.

Installation

1. Install Expo CLI - https://expo.dev
2. Git clone https://github.com/jaredhud/QuikDine-mobile.git
3. Git clone https://github.com/jaredhud/Quikdine-server.git
4. Git clone https://github.com/Kshitija118/QuikDineWebPage.git
5. npm install all the repos above
6. npm run start all the repos above

Technologies Used

+ Core: React Native - React
+ API: Spoonacular Google Vision API
+ SendGrid Node.js Javascript HTML CSS Firebase Express.js Expo Go
+ Collaboration: Discord Github Zoom Trello Basecamp Figma

Eggroll Team Members

• Kshitija Shirsathe - GitHub - LinkedIn
• Romell Bermundo - GitHub - LinkedIn
• Jared Huddleston - GitHub - LinkedIn
• Chris Desmarais - LinkedIn - Scrum Master

Developer Notes

• Context is used to transfer data from page to page
• Firebase is used to store data
• SendGrid is used for handling email functionality
• Navigation is handled 2 ways: Screen and Tab navigation
• _RecipeNav and similar folders handles the Tab Navigation part
• Modal is used to create pop-ups (useful for creating help notes)
• When creating page layout, use percentages to divide sections. ie. 10% 10% 30%

Important: Add this code on src/context/ folder and name it as IPAddress.js:

import { useState } from "react";
 
export function setIP() {
// your IP address, ipconfig in command prompt
const [serverIP, setServerIP] = useState("Your IP address here");
return { serverIP, setServerIP };
}

Credits

• Node.js
• Base logo vector made by Freepik from Flaticon.