brabbuss-old / refactor-tractor Goto Github PK
View Code? Open in Web Editor NEWA project to practice refactoring a pre-existing codebase
A project to practice refactoring a pre-existing codebase
As a dev, I want to pull functionality off of the User class and UserRepository class, so that those classes are not so bloated and self-referential.
As a dev I need to write fetch requests to get data for users, activities, hydration, and sleep so that when the page loads I can instantiate instances of all related classes.
As a user, I want to be able to add new records for each tile and see my dashboard information update to the most accurate view.
As a developer, I want to refactor:
displaySleepInfo();
displayStairsInfo();
displayStepsInfo();
so that they are easier to read/understand and so they better comply with SRP.
As a user, I would like to submit a new record on any tile and be taken back to the main view, which is now displaying my newest information for the updated category.
As a user,
I'd like to be able to update my stats with new entries for hydration, sleep, steps and stairs
As a developer,
I need to make sure that code dependent on fetched-data is not firing until after our fetch promises have resolved
so that the needed variables will be defined.
Update methods in Sleep, Hydration, and Activity so that they are in ES6 "fat arrow" form.
As a dev,
I want to understand Sass and advanced CSS concepts before refactoring those sass and CSS items,
So that I don't refactor what I don't understand
As a dev/user, I want the information users enter for new data to be updated inside of the user's relevant dataRepository - ie, when a user adds new hydration information, I want to see that reflected in the user's information.
As a dev, I want any days where data is not logged for a given activity to have a zero state for that day for that data, so that our methods of retrieving data will still function correctly.
details: the methods to return data (i.e. return an array of sleep data from the last seven days) rely on the data being in order by date, and rely on there being data every day. If a user logs no data, then a new data object should be pushed into the respective data array to maintain functionality of our methods.
As a dev,
I'd like for the styling of user input to fall in line with styling already seen on the page:
It is dependent on #30 being completed first
As a developer,
I'd like to ensure that all Class functions pass their tests (TDD) before working on DOM interactions,
so the app will function correctly.
As a developer, I want to ensure that when the submit button is selected there is a noticeable change for my users.
As a dev,
I want the variable todayDate
to reflect today's date, so my app will work correctly.
As a dev,
I'd like to separate global query selectors into a separate data file
in order to make scripts.js more readable
As a developer, I would like to make the form view on each tile to be more consistent even with the variance in input fields.
As a developer, I would like to ensure that my application's input fields are accessible to all my users.
As a dev/user, I want to be able to navigate the site with only the e-reader, so that those facing accessibility issues will be able to use the site as simply as one without those issues.
As a dev,
I want to ensure that the class tests are set up logically,
So that we do not implement poor code.
details: go test by test and ensure they make sense, are passing correctly
As a dev, I want the app to automatically load with the data for a random user each time it is opened.
As a dev, I want to resolve this bug where the day by day hydration information does not display.
More information:
There is no DOM functionality to update those numbers, despite them existing in the dashboard. You can see in the screenshot the element class as hydration-calendar-ounces-3day
.
There is already a function built into classes to return a seven day array of information - in this case it’d be the function that lives under the parent:
getPastWeekData(date) {
let index = this.dataObjectArray.indexOf(this.findDataObjectByDate(date))
return this.dataObjectArray.slice(index - 6, index + 1)
}
So something like user.ouncesRecord.dataObjectArray.getPastWeekData(date)
- that’d return an array of data objects for the seven days, then it’d be a matter of parsing and interpolating. If you’d like I can build out a function inside of the user to not have to dig deep to access the parent method.
As a developer,
I'd like a separate file from which to import DOM interactive functions into scripts.js,
so that scripts is easier to read and not as bloated.
As a dev,
I want to import fetched sleep data into the user-repository class, replacing the canned data set,
so the app will function correctly.
Thoughts:
*** Alternatively, we remove functions using sleep data and place in DOM ***
As a user/dev, I want to be able to submit flights climbed information.
Currently there is no functionality for submitting flights activity.
As a developer, I need to make sure that data-dependent code is not firing until after our fetch promises have resolved so that the needed variables will be defined.
As a developer, I need to look for similar functionality across classes that can be condensed into one Parent class, so that each of my classes is dryer and less redundant.
Regardless of user, ounces will always display '63'
As a user/dev,
I want this to update to reflect the user data, so that the app works...
As a dev, I want to .post any new user data the moment it is submitted, so that we can save information remotely and meet project spec.
Will not be able to implement fully until #30 has been implemented
As a develper, I'd like to see .catch added to fetch requests, so that we can catch any unexpected errors
As a dev I want to refactor the scss styling into separate files with semantic variables and mixins so that the scss code is readable and dry.
As a developer, I want to ensure that our dashboard is easily read by users with visual challenges.
As a dev, I want to select a different random user if the current random user has badly formatted data that halts page load, so that the user doesn't need to reload the page to get it to work.
More info:
Due to badly formatted POST info, sometimes there is data that halts page load bc it is breaking a function. Best practice would be to employ more sad path testing at the data object (sleep, hydration, activity) level, which can be done, but this could be a temporary patch at a higher level.
As a dev, I'd like to change the title on the window of the open page, so that it is more professional.
As a developer, I want to ensure that my application presents content in the most semantic manner possible. Informational hierarchy is helpful not only on the dev side but for screen readers and users with mobility issues and are tabbing through the app.
As a developer, I want to provide context and a better overall experience for users who may be utilizing a screen reader.
Aria tags will let them know where they are on the page and where that button can take them.
As a user, I want the input form to disappear when I click submit, or at least reset, so that I can see updated information.
As a dev I want the back arrows in each of the four boxes to be positioned down from the top (have a margin) so that it is a cleaner appearance.
As a user, I want to be able to filter my data for any category by a date or a range of dates.
This could involve installing a data picker package dependency off npm.
This should be part of the home page design?
As a dev, I want to guard against erroneous sleep data: max sleep quality = 5, max sleep hours = 24
As a developer, I would like to generate a 100% Lighthouse audit for all views of the application.
As a user, I would like to be able to add new records for each category of hydration, activity, stairs, and sleep.
As a developer, I want to make sure that the assets used in my application are easily used throughout the design. This will make my workflow more streamlined and help with the performance of my application overall.
As a developer, I want to have the most accessible site for my users and get the site as close to 100% in the Lighthouse audit.
As a dev, I want to create new Classes:
so that those classes can have their own methods to work with data pertaining to the objects in their respective arrays.
*note: Those repositories would live as array values in properties of the User class, similar to the user being an element inside the User Repository class.
As a user, I want to see a less dev forward message and more contextual message upon successful submission of an input field.
As a developer, I want to make sure that each of my form inputs is clearly accessible to those using a screen reader or need more context.
As a developer, I want to make it easy for the user to notice if a required field has been left blank or contains the wrong type of data.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.