Architecture
- List all the languages/frameworks/libraries/services/APIs you plan to use. Explain how they will tie together. For example: This will be a native Android app written in Kotlin, using the android.graphics library, using firebase real-time database for cloud data, and firebase authentication for user accounts.
This is an android app written in React Native, utilizing a form of 3rd party API to get the restaurant information, using firebase for authentication for user accounts.
- What package/build manager will you use? npm, gradle, yarn, flutter, pipenv, etc.
For our package manager we will use npm.
- List what each person will work on. Everyone must make significant code contributions, or they will fail the class, see Syllabus.
Kylie - I will work on the part of the code which is interacting with the api, retrieving information and figuring out what to store and also when to communicate back and forth between the app and the api. I will also help wherever else needs help.
Jack - I intend on working on the payment side of the app. Saving a card to a users account as well as using firebase to connect to stripe payment API. I will code screens for these and functionality. I will also help wherever needed.
Nick - I will work on the customer side of the app developing the screens for customers to look through restaurants/locations. I will ensure these are functional and easy for the user to use.
Siona - I will be working on the developing UI and the functionality of the app screens including login, signup, user profile, rating and order tracking and also willing to help with other needed screens as well.
Vidhee - I will work on Backend.
- Release: How will you create and deliver a binary to testers? Explain. Note that the testers include us (the teachers of this class, when we grade your app). You must deliver a simple to install app: double-click to install.
The testers can get the application from Github after we generate the APK and publish it on Github.
- Are you using Virtual Machines (vmware, vbox, etc) or Containers (docker) for development? If so, explain.
We are using containers for development. This is because in react, containers are responsible for maintaining our apps state. Nicholas Garofalo is using the VBox virtual machine in order to be able to develop in the IOS atmosphere, as he is using a HP laptop that cannot download XCode. VBox allows me to create a Mac OS machine on my laptop by downloading the correct optical disk for the correct IOS update that I can use Xcode on. Other four people are using Xcode for development and testing.
- The Models for your app. These could be UML class diagrams, or just models with attributes (with type) and descriptions (in English).
Since javascript - according to google - isn't typically described by UMLs, this is a model with attributes and descriptions.
https://lucid.app/lucidchart/13a898d9-26e0-4287-8635-8e261abe402d/edit
- How will your app maintain state? in memory? or database? or both? Note this in your Model Classes.
The app is going to maintain state in database through the use of sessions. The app will use cookies to establish a key from the client to the server. This session key is going to be stored in a database which normally isn’t good practice but for coding purposes will start here and hopefully get closer to autonomy.
- If you are using a db-backend (say firebase) then include the Database schema: set of tables/documents with list of attributes and their types.
Database schemas:
Table Places { NAME varchar(50); ADDRESS varchar(255); id int PRIMARY KEY }
Table Restaurants{ Id int PK Name varchar(50); Address varchar(255); }
Table Customer{ id int PK; NAME varchar(255); CONTACT varchar(255); ADDRESS varchar(255); EMAIL varchar(255); CONFIRMATION_CODE varchar(255); PASSWORD varchar(255); }
Table Food Product { Id int pk; NAME varchar(255); PRICE int; CATEGORY varchar(255); DESCRIPTION varchar(500); AVAILABILITY char(50); QUANTITY int; }
Table Driver { NAME varchar(255); Id int PK; CONTACT varchar(255); EMAIL varchar(255); PASSWORD varchar(255); }
Table Placed_Order { Order_id int pk; Customer_id int FOREIGN KEY; Food_id int FOREIGN KEY; Food_quantity int; Date Date; Restaurant_id int FOREIGN KEY; Food_ready bool; Delivery_add varchar(500); Payment_id int FOREIGN KEY; Delivery_time timestamp; }
Table Payment { Payment_id int PK; Order_no. Int; Customer_id int; Payment_method varchar(100); Total real; }
Table delivery { Delivery_id int PK; Customer_id int FK; Order_id int FK: Driver_id int FK; Address varchar(255); Date date; }
Table Review { Customer_id int FK; Stars int; description varchar(500); restaurant_id int FK; }
- List of common queries you expect will be needed. Do any of then need to join tables?
User info- Username (String), Password (String), Favorite Restaurants (String), , Order history (String) Card info (int). User Info will contain a users basic info. Restaurants- List of restaurants(String), Rating, public (boolean). Restaurants will be in a table, their rating, if they are public, and who has access to them. Items List- Item ID (int), Foods(String), cost (int), quantity(int). Item List will be a table of users lists. Purchase history- Number of times ordered(int), items ordered (String). Purchase history will be a table that contains the information about history of the order in a users pantry.
Common queries: User info- Favorite Restaurants. User info- Card Info. Restaurant Search, Favorite Restaurants, Edit User profile, Get Restaurant list.
- The Views of your app: name, describe. Embed the images from your Design Milestone. Typically, one page in the app is composed of multiple View elements.
https://developer.apple.com/documentation/uikit/views_and_controls Views:
Login Screen:
LoginID - The email that the user used to sign up for a Campus Eats account. Click this and it will allow the user to type in their email address.
PasswordID - Clicking this will allow the user to enter their password that they created when they signed up for a Campus Eats account.
SignUpButton - Clicking this will bring the user to a screen where they can create a Campus Eats account.
SignInButton - Clicking this button will either sign the user in, if they have inputted a correct username and password combination, or ask the user to sign in again if they have inputted an incorrect username and password combination.
Main Location Selection Screen:
LocationButtons - Each location will be a different button that will bring the user to the screen containing the restaurants within that location.
SearchBar - Clicking on this will allow the user to type in which specific location they want to look at, and pressing enter on this will show that location/locations that have a match with the input the user typed.
NextArrow - This is a button that will bring the user to the next page containing a list of locations that are available on Campus Eats.
NavigationButton - Clicking this button will pull up the side navigation bar, where the user can select from a list of options to where on the app they want to travel.
Location Specific Screen:
RestaurantButtons - Each restaurant has a different button that, when clicked, will bring the user to the restaurant page to see the meal options.
NextArrow - This is a button that will bring the user to the next page containing a list of restaurants that are available on Campus Eats.
PreviousArrow - This is a button that will bring the user to the previous page containing a list of locations that are available on Campus Eats.
NavigationButton - Clicking this button will pull up the side navigation bar, where the user can select from a list of options to where on the app they want to travel.
RestaurantSearchBar - Clicking on this will allow the user to type in which specific restaurant they want to look at, and pressing enter on this will show that restaurant/restaurants that have a match with the input the user typed.
SortByButton - Clicking on this button will bring up a menu where the customer can pick how the restaurants are listed on the screen.
Sort By Screen:
AlphabeticalButton - Clicking this button will sort the restaurants by name.
WaitTimeButton - Clicking this button will sort the restaurants by the shortest wait time.
FavoritesButton - Clicking this button will only list the user’s favorite restaurants.
RatingsButton - Clicking this button will sort the restaurants by the highest rating.
Restaurant food screen:
IndividualMenuItemButtons - Each item on the menu will have their respective button, clicking on this button will allow you to read a short description, customize the item, and add the item to the cart.
NextArrow - This is a button that will bring the user to the next page containing a list of restaurants that are available on Campus Eats.
PreviousArrow - This is a button that will bring the user to the previous page containing a list of restaurants that are available on Campus Eats.
NavigationButton - Clicking this button will pull up the side navigation bar, where the user can select from a list of options to where on the app they want to travel.
Order screen:
IndividualCartItem- Each item that the customer added to the cart will be listed on this screen.
QuantityButton - Next to the individual items will be the amount of that item the customer added to the cart. The customer can click on this button which will allow them to change the quantity of the item.
CardTypeDropDown - Clicking this will bring a dropdown menu that the customer can decide if they want to pay with Debit, Credit, Meal Plan, or CarolinaCash. Like this:
CancelButton- Clicking this will clear the customer’s cart and bring them back to the main location screen. Place order button - Clicking this will finalize the customer’s order and begin searching for drivers to deliver the food.
CardNumberID - The customer is able to input the credit card number or carolina card number by clicking this bar.
Comments - Clicking this will allow the customer to type in any additional delivery comments that they may feel necessary to give to the driver to help delivery be easier.
NavigationButton - Clicking this button will pull up the side navigation bar, where the user can select from a list of options to where on the app they want to travel.
Navigation Screen:
ProfileButton - Clicking this will bring the user to a screen containing their profile information, and where they can edit that information.
OrdersButton - Clicking this will allow the customer to see any active/previous orders that the customer has completed.
FavoritesButton - Clicking this will bring the customer to a screen containing all of their restaurants that they had listed as favorites.
ApplyButton - Clicking this will bring the user to a screen where they are able to apply to become a driver for Campus Eats.
LogInAsDriverButton - Clicking this will bring the user to a screen where they are able to sign in as a driver and begin making deliveries.
Sign out button - Clicking this button will sign the user out and bring them back to the main login screen.
NavigationButton - Clicking this will close the navigation screen
Profile Screen:
OrdersButton - Clicking this will allow the customer to see any active/previous orders that the customer has completed.
EditPaymentDetails - Clicking this will bring the customer to a screen that will allow them to input their card information.
HelpButton - Clicking this button will bring the customer to a screen that has helpful people to contact/helpful information that the customer can use if needed.
PrivacyPolicyButton - Clicking this button will display the privacy policy to the customer.
SignOutButton - Clicking this will log the customer out and return them back to the login screen.
Order confirmation screen:
PreviousArrow - Clicking this will bring the customer to the previous page that they were on
NextArrow - Clicking on this button will bring the customer to the GPS screen where they can track the order.
NavigationButton - Clicking on this button will pull up the navigation menu where the user can move to different locations of the app.
Driver login screen:
DriverLoginID - This will allow a driver to type in the email address that they used to create a driver account.
DriverPasswordID - This will allow a driver to type in the password that they used to create a driver account.
ApplyNowButton - Clicking this will bring the user to the application screen to become a driver.
Driver clock in screen:
BeginDrivingButton - Clicking this button will clock the driver in and allow them to begin accepting orders.
PreviousArrow - Clicking this button will bring the driver back to the login screen.
OderAmountScreen - This screen shows the driver how busy the app is with orders, and the prediction of how busy the app will be later.
Driver Restaurant Screen:
RestaurantButtons - Each restaurant, contained in the location that the driver selected, will be a button that the driver can click which will bring them to all available orders at the restaurant.
PreviousArrow - Clicking this button will bring the driver back to the screen containing all of the locations with available deliveries.
Orders Screen:
PersonOrderButton - Each individual order that has been placed, at the restaurant chosen, will be a button that the driver can click on to view order details, and decide if they want to accept the order.
PreviousArrow - Clicking this button will bring the driver back to the screen containing the list of all the restaurants with available deliveries.
NavigationButton - Clicking on this button will pull up the navigation menu where the user can move to different locations of the app.
Driver Application Screen:
FirstName - This will allow the user to input their first name.
LastName - This will allow the user to input their last name.
EmailID - This will allow the user to input the email that they would like designated with their account.
PhoneNumber - This will allow the user to input their phone number.
DOB - This will allow the user to input their date of birth to confirm they are old enough.
USCID - This will allow the user to input their USCID that they want to be combined with their account.
ApplyButton - Clicking this button will submit the application if all information is input correctly, or ask the user to try again if the information is not input correctly.
PreviousArrow - Clicking this button will bring the user back to the Driver Login Screen.
Payment Detail Screen:
CreditButton - Clicking this selects Credit as the card type that the customer is going to input
DebitButton - Clicking this selects Debit as the card type that the customer is going to input.
CardFirstName - This will allow the customer to input the first name that they have on the card.
CardLastName - This will allow the customer to input the last name that they have on the card.
CardExpiry - This will allow the customer to input the expiration date on their card.
CardSC - This will allow the customer to input the security code on their card.
AddCardButton - Clicking this button will add the card to the user’s saved cards.
NavigationButton - Clicking on this button will pull up the navigation menu where the user can move to different locations of the app.
GPS Screen:
PreviousArrow - Clicking this will bring the driver back to the order confirmation screen.
GPSImage - This shows the driver live directions on how to get to the address of the delivery.