Skip to content

Latest commit

 

History

History
226 lines (137 loc) · 9.5 KB

File metadata and controls

226 lines (137 loc) · 9.5 KB

SnapGreen | Cal Poly Software Engineering I & II 2020

Build Status Quality Gate Status Technical Debt Code Smells

Providing users with a measurable awareness of their environmental impact. Users can track daily habits and scan products to increase and improve their environmental score.

Understanding Our Backend

Coding Style

Kotlin Style Convention

Javascript Style Convention: Prettier

Static Code Analysis

View SonarCloud Project Dashboard

Continuous Integration Software

View Travis CI Dashboard

Design Diagrams and Prototypes

View Diagrams Here

UI Prototypes

View Figma Mockup

Component Diagram

Screen Shot 2020-06-01 at 2 31 37 PM

Use Case Diagram

The app involves two actors, one being a player(user) and the other being a clock. The player can perform various activities. They can login to the app and if they don't have an account they can create a new account. A player can also access their settings, add friends, enter usage stats which will also lead to the system to calculate the stats. They can create a new game, which in turn will start the game clock countdown and this is managed by the clock. Finally the player can scan the product barcode and in return view the environmental impact of it. Screen Shot 2020-03-08 at 3 20 23 PM

Activity Diagram

This diagram displays the process of creating, playing, and ending a game. Reading from top to bottom you can see the different decisions at each step and what happens after the user makes a decision on whether or not to perform a certain action. The diagram is pretty self-explanatory and easy to follow. Screen Shot 2020-02-21 at 11 51 02 AM

This diagram shows the basic workflow when adding usage data into SnapGreen. Several different statistics are updated including any games in progress. StatsActivityDiagram

Class Diagram

This diagram is a rough draft that shows the interaction between the different main classes of the game. It also shows the different methods that perform the various actions within the app. It also highlights the dependencies between one class and another.

Screen Shot 2020-03-08 at 4 15 50 PM

Sequence Diagram

This diagram shows the interaction between the app, server, and database when a user tries to login. The app sends the login attempt information to the server and the server queries the database and recieves a response. The server then sends a response to the app based on whether the login attempt was valid, whether the user doesn't exist, or whether the password doesn't match. Annotation 2020-03-02 212312

Testing

Our team is utilizing Espresso and JUnit for Kotlin and Jest for JS testing.

View Code Coverage

Acceptance Tests:

View Acceptance Test Specification

View Acceptance Test Code

Unit / Integration Tests:

View Android Unit / Integration Test Code

View Backend Unit Test Code

Setting up the Developer Environment

Our app utilizes Android Studio for front-end development and Node.js for the backend. View both

Android Studio Setup

Installation:

  1. Install latest version of [Android Studio](https://developer.android.com/studio).
  2. Navigate to Tools > SDK Manager
  3. Download and Install Android 9.0 (Pie)
  4. Navigate to SDK Tools
  5. Download and Install Google Play Services
  6. Clone the repository
  7. Go to File > Open and select the "Client" folder from the repository.
  8. Wait for import and gradle sync to complete.
  9. If prompted, download and install the latest versions of both gradle and kotlin (may not be neccessary)
  10. Download the GoogleServices.json from the Firebase console.
  11. Place the JSON in the "app" directory
  12. Connect an android phone with developer mode activated and USB debugging turned on

    OR Navigate to Tools > AVD Manager Select Create Virtual Device Select Pixel 3 > Pie > Finish

  13. Click on the play button on the top of Android Studio to build and run the app!
Node Server Setup

Installation:

Windows

We recommend enabling WSL (Windows Subsystem for Linux) first--while it is possible to install these programs on Windows without doing so, the server will ultimately be hosted in a Linux environment and therefore will be expressed with Linux commands. When choosing a "flavor" of Linux to install, choose "Ubuntu 18.04 LTS" from the Microsoft store--certain commands vary depending on which variety of Linux you choose, and for this we are going with Ubuntu (for now).

How to install/enable WSL on Windows 10

Once WSL has been installed/enabled, you can start it by going to any folder in explorer, clicking in the box showing your location (e.g. "This PC > Local Disk (C:) > Users...," just above the folder contents), then typing "wsl" and hitting enter. That will put you into the Linux command line.

Linux

Installing node.js (from the command line)

sudo apt update

sudo apt install nodejs

nodejs -v

Installing npm (node package manager)

sudo apt install npm

npm -v

Installing express.js

npm install express

Mac

First, you need to install XCode (from the Apple App Store), and Homebrew (Apple's package manager for Mac). All following commands should be entered into the terminal:

Installing Homebrew

ruby -e "$(curl -fsSl https://raw.githubusercontent.com/Homebrew/install/master/install)"

Installing node and npm

brew install node

node -v

npm -v

updating node and npm

brew upgrade

brew upgrade node

node -v

npm -v

Uninstall:

Windows

If you've installed via WSL, follow the Linux instructions below from the linux command line. Otherwise, uninstall programs as you normally would.

Linux

sudo apt remove nodejs

sudo apt purge nodejs

sudo apt autoremove

Mac

brew uninstall node

Some Important Dev Dependencies

husky: Allows for pre-commits hooks (Used to run prettier styling for every JS commit) jest: Testing framework for JS nodemon: Utilized to have the server refresh automatically with every change prettier: Automatic code formatting for every JS commit

Running the Server

Running the server is as simple as two commands

npm install

npm run serve

You may get a warning from your firewall--go ahead and let it slide. Your terminal should announce that the server is running. Open up a browser window, and go to "localhost:8080". You should see a blank page with a button at the bottom; you should also see a message in the terminal that states "user connected." Try clicking on the button--you will see repeated messages.