Architecture

Libraries and Frameworks

Our project will use the following:

React Native
Used to create the user interface.
React-navigation
Used for navigation between pages within the app.
React-native-firebase
Interface between the app and Firebase.
Firebase
Data hosting and user authentication.
npm
Package manager.
Expo
Building and testing the application.
USDA FoodData Central API
Used to retrieve nutritional data.

Work Distribution

Brent Hopkins: #22, #25
Mostafa Mohamed Ali: #17, #18, #19

Model

Database

Schema

Common Queries

get the food diary of a specific user
get the sleep diary of a specific user

Views

Login Views

Email Login

New User Landing Page

Home Screen

Diary View

The food diary view will consist of the calorie overview, 4 meal components, and the navigation bar The overview component will consist of the currently selected date, buttons to change the date, the users currently remaining calories, and an ellipsis which will navigate to the nutrients page for the currently selected date when clicked. The meal components will display the entries for that meal along with buttons to remove each entry and a button to add a new entry to that meal. When clicked this button will navigate to the food search screen.

Nutrient View

The nutrient view will consist of the date header, nutrient components, and the navigation bar. The date header component will contain the currently selected date, buttons to change the date, and a button to return to the food diary page. Each nutrient component will contain the name of the nutrient they represent and display the %DV for that nutrient based on diary entries.

Food Search View

The food search view will consist of the search bar, search results, and the navigation bar. The search bar component will contain a text input field and a button. When this button is clicked it will populate the search results component with results obtained from the USDA API using the text from the input field. The Search results component will consist of a flat list containing food components. These components will display the name, calories, brand, and serving size of each result and will add the corresponding item to the users food diary on click.