/fitlit-group-project

FitLit project starter kit for students

Primary LanguageJavaScript

FitLit

Learning Goals:

  • Implement ES6 classes that communicate to each other as needed.
  • Use object and array prototype methods to perform data manipulation.
  • Create a dashboard that is easy to use and displays information in a clear way.
  • Implement a robust testing suite using TDD.
  • Work with a local server and make network requests to API endpoints to retrieve and manipulate data.

Abstract:

Tracking progress while going through your health and wellness journey can be difficult and complicated. Fortunately FitLit is here to save the day! Through this web app user data can be collected, stored, and displayed to the user in truly meaningful ways. By using FitLit you can track a user's progress on important health aspects like step goals, sleep, and hydration while also being able to compare them to user averages for all three categories.

Installation Instructions:

  • Clone down the Local Server
  • Cd into the repository and rn npm install, followed by npm start
  • Leave this server running and then
  • Clone down this repository
  • cd into the repository
  • Install NPM packages by running npm install in your terminal
  • Start the server by running npm start in your server
  • After starting the server, the project will run in your browser at http://localhost:8080/

Preview of App:

ezgif com-gif-maker (3)

Context:

Faye, Kirsten, Ryan, and Rick all worked on this project for 17 days. We are all in our fifth week in our second module in Turing.

Technologies Used

  • Javascript
  • HTML
  • CSS
  • Mocha/Chai
  • Webpack
  • Chart.js

Contributors:

Wins + Challenges:

Some challenges included:

  • Handling inconsitent data, during the first iteration we could expect there to always be a weeks worth of data. In the second iteration the data we were given was much less consitent and lead to the need to refactor a lot of our code related to finding week-long data.
  • Fetching data while utilizing promises. Having to understand JavaScript execution context and the call stack in order to have functions call after the data has already been fetched.
  • Chart.js, learning how to utilize a third-party extension

Some wins included:

  • Chart.js, we successfully implemented the extension which allowed us to display user data in a meaningful way.
  • Testing in Mocha and Chai, we feel that our tests and test data allowed us to accurately gauge how the code would perform when the website was active
  • Post request! We were able to send information to our API and update the DOM to match that updated data accordingly.
  • Project board utilization, we successfully utilized the project board tool, the issues tab, and had very positive and meaningful task delegation and communication by using these tools.