gaj23 / fitlit

A vanilla javascript project that calls on a restful API to display a users fitness data. Desktop and mobile enabled.

Hi, I'm Gabrielle (she/her)

I'm a novice Ornithologist and a Software Engineer.

Languages and Tools:

• 🔭 I’m currently working on BigBirds

• 🌱 I’m currently learning PWAs & React Native

• 👯 I’m looking to collaborate on FaceIt

• 🤝 I’m looking for help with PenPosts

• 👨‍💻 All of my projects are available on GitHub

• 💬 Ask me about React, Router, SASS/SCSS, Cypress, Chai/Mocha

• 📫 How to reach me [email protected]

• 📄 Know about my experiences through my resume

• ⚡ Fun fact I've seen 197 species of birds.

Connect with me:

fitlit's Issues

helper.js

• want to create a helper file to hold all calculations methods
• used these methods in other files (BUT HOW?)

Iteration 4 - Activity: Data (Activity.js)

DUE 12/16

Create classes & methods that can calculate:

for a specific day

• (specified by a date), return the miles a user has walked based on their number of steps (use their `strideLength to help calculate this)

for a user

• (identified by their userID) how many minutes were they active for a given day (specified by a date)
• how many minutes active did they average for a given week
• did they reach their step goal for a given day (specified by a date)
• find all the days where they exceeded their step goal
• find their all-time stair climbing record

Build out MVP for:

• HTML
• CSS

Iteration 3 - Sleep-Repo: Data

DUE 12/13

Create classes & methods that can calculate:
for all users

• the average sleep quality
• who average a sleep quality greater than 3 for a given week: you should be able to calculate this week for any week not just the latest week

for a given day

• (identified by the date), find the users who slept the most number of hours(one or more if they ti

helper-test.js

Need to buildout helper-test for the helper file

Iteration 4 - Activity: Dashboard

DUE 12/16

Items to add to the dashboard:

for a user

• the number of steps for the latest day
• the number of minutes active for the latest day
• the distance they have walked (in miles) for the latest day based on their step count
• how their number of steps, minutes active, & flights of stairs climbed compares to all users for the latest day
• a weekly view of their step count, flights of stairs climbed, & minutes active

Iteration 4 - Activity: Build Comp

Build out comp for Actvity class

Iteration 1: Dashboard

DUE 12/9

• Use the scripts.js file to add information to the DOM.
• NOTE: This file should call methods from your classes to retrieve information. There SHOULD NOT be any DOM manipulation within the User or UserRepository class files

To develop this dashboard, first choose a random user, then on the dashboard for the user

• create info card with all of the user's info on the page
• Display their first name somewhere prominently on the page to welcome them
• For a specific user, display how their step goal compares to the average step goal amongst all users (this displayed should not be hard-coded)

Iteration 1 - Data: *UserRepopsitory* class

new UserRepository(data);

• A UserRepository holds onto all of the User objects
• Needs to have a parameter that takes in user data
• A method that takes in a user's ID and outputs their data
• A method that takes the average step goals among all the users

Iteration 3 - Sleep: Dashboard

DUE 12/13

Items to add to the dashboard:

for a user

• their sleep data for the latest day (hours slept & quality of sleep)
• their sleep data over the course of the latest week (hours slept & quality of sleep)
• their all-time average sleep quality & all-time average number of hours slept

Run Linter

DRY up code with Linter
DRY up code with Linter

• UserRepo
• UserRepo Test
• User
• User Test
• Hydration
• Hydration-test
• Sleep
• Sleep-test
• SleepRepo
• SleepRepo-test
• Activity
• Activity-test
• ActivityRepo
• ActivityRepo-test
• helper
• helper-test

Iteration 3 - Sleep: Data

DUE 12/13

Create classes & methods that can calculate:

for a user

• the average number of hours slept per day (identified by their userID)
• their average sleep quality per day over all time
• how many hours they slept for a specific day (identified by date)
• their sleep quality for a specific day (identified by date)
• how many hours slept each day over the course of a given week: you should be able to calculate this week for any week not just the latest week
• their sleep quality each day over the course of a given week: you should be able to calculate this week for any week not just the latest week

Iteration 4 - Activity: Data (AcitivityRepo.js)

DUE 12/16

Create classes & methods that can calculate:

for all users, what is the average number of

• stairs climbed for a specified date
• steps taken for a specific date
• minutes active for a specific date

Iteration 1 - Data: User class

new User(userData)

• A User represents a single user
• Needs to have a parameter that takes in a userData object
• A method to return a user's first name ONLY

Iteration 2 - Hydration: Dashboard

DUE 12/11

For your user (or any user you choose), add:

• A display to show how much water they have consumed today (these displays are often called “widgets” in the FE tech world)
• A display to show how much water they have consumed each day over the course of the latest week

READme

DUE 12/17

• Add mentors & rocks as collaborators
• credit flatiron.com with images

Dynamic Calendar

Is your feature request related to a problem? Please describe.
If I was a user, I would like to be able to select any date and be shown data in relation to the date that I chose.

Helper File Issue

A helper file was created to reduce the amount of repetitive code in our class files.

• The issue is that when you run npm test you would need to uncomment line 1 (the require) in your class file so that your class has access to the helper.js.
• Once you have run the test and passed all test make sure to comment out line 1 (the require) in your class file so that when you check your webpage or app it is working.
• Not sure why one breaks and the other works when having this helper file.

User Selection

Is your feature request related to a problem? Please describe.
As a developer, I would like if a random user was displayed upon refresh.

info to be displayed

info to be displayed

• current water intake
• hours slept
• current steps taken

Originally posted by @gaj23 in #8 (comment)

Iteration 2 - Hydration: Data

DUE 12/11

Create classes & methods that can calculate:

• For a user(identified by their userID - this is the same for all methods requiring a specific user's data), the average fluid ounces consumed per day for all the times
• For a user, how many fluid ounces they consumed for a specific day (identified by a date)
• For a user, how many fluid ounces of water consumed each day over the course of a week (7 days) - return the amount for each day

NOTE: You have to decide which classes should contain each method. Think about whose responsibility it is to own the method.

Media Queries/Responsive Design

As an user, I want to be able to go between a mobile and a desktop screen and still have my data displayed in a pleasing manner.