Pantry

This is a React Native app that helps people track their food inventory, which we call Pantry, by scanning your grocery receipts to know whats in stock and what's not inorder to make your next grocery shopping a breeze.

Team

• Voniel Brown
• Jenesh Napit
• Michael Amparo

🚨 Setting up your enviroment 🚨

• Follow the React Native setup docs

• Download Simulators (Xcode only avaliable on iOS)

  • Android Studio
  • Xcode

Running iOS simulator on your iOS device

• Once you've downloaded Xcode signup for an Apple Developer Account.
• Select your project in the Xcode Project Navigator, then select your main target (it should share the same name as your project)
• Look for the "General" tab. Go to "Signing" and make sure your Apple developer account or team is selected under the Team dropdown.
• Do the same for the tests target (it ends with Tests, and is below your main target).
• Repeat this step for the Tests target in your project.

Few things you might have to install following the docs

• brew install node brew install watchman

• sudo gem install cocoapods

• npx react-native start or npx react-native run-ios

• When getting an error starting ios simulator go to cd /frontend/pantry/ios && pod install

To run the app on IOS

• If you don't already have the app: git clone https://github.com/mike923/PantryApp.git

• Install dependencies cd frontend/pantry && npm install

• Install pod changes in ios cd /ios && pod install

• Open iOS simulator cd .. npm run start:app

To run the app on Android

• If you don't already have the app: git clone https://github.com/mike923/PantryApp.git

• Install dependencies cd frontend/pantry && npm install

• Open iOS simulator cd .. npm run start:android

To run the react-native-debugger

• For macOs use Homebrew Cask to install:

• brew update && brew cask install react-native-debugger

• This puts React Native Debugger.app in your /applications/ folder.

• run open "rndebugger://set-debugger-loc?host=localhost&port=8081" to open the debugger window

• run ctrl + m (Android) or ⌘ + D (iOS) in order to connect app to react-native-debugger

Useful Resources

• Setting up Enviroment

• React Native Navigation

• Stack Navigation

• Bottom Tab Navigation

• React Native Components

• React-Redux using hooks

• React-Native Debugger

• Firebase Upload Tutorial

React Native Navigation Notes

• Routes can be accessed and interchanged between <Stack.Screen/> and <Tab.Screen/> when using the prop method navigate for navigation navigation.navigate('route-name')

TypeScript Notes

• Adding Typescript to React Native

• Typescript JSX tutorial

Server Notes

• The back end server is running of port 8282
• Back end server deployed at Pantry back end

React Native Firebase setup

• Getting Started

• Using Firebase ML Kits

Deployment

There are two different paths to deploying our app, we can either deploy to the Google Play Store or the Apple App Store.

Google Play Store

In order to deploy the app to the Google Play Store you must use the organization Play Console Account.

Resources for Deployment

In order to deploy to the play store for the first time you can follow the React Native Documentation for Publishing To Google Play Store.

Apple App Store

In order to deploy the app to the Apple App Store you must use the organization Apple Developer Account.

Resources for deployment

In order to deploying the app to the App Store you can follow the steps outlined in the Readerbytes Article.