Trackdrills is an application that gives you access to over 500 workouts and exercises to choose from to suit your fitness goals. It is a health-focused app that also gives you the ability to create your own customized workout plans and track your progress.
Ezekiel Ekunola | Amira Adediran | Modurotolu Olokode | Folasade Agbaje | Melquisedeque Pereira |
---|---|---|---|---|
Sandrava Philips | Oluwafemi Anjorin | |||
Trello Board
Product Canvas
UX Design files
Landing Page
API
- User should be able to sign up and login
- User should be pick from a list of exercises and view exercise details
- User should be pick from a list of workouts and view workout details
- User should be able to access workout history page
- User should be able to schedule a workout, as a routine or one-time
- User should be able to access the dashboard
- User should be able to get dashboard notifications or email notifications
- User should be able to update profile details
- User should be able to create custom workouts
- User should be able to share completed workout with friends on social media
npm start
: Runs only the front-end client.
npm test
: Will run the tests for front-end
npm run build
: Will create a build file for front-end
For the app to function correctly, the user must set up their own environment variables. There should be a .env file containing the following:
REACT_APP_GraphQL_API=GRAPHQL_API_URL
REACT_APP_GraphQL_API_SUBSCRIPTIONS=REACT_APP_GraphQL_API_SUBSCRIPTIONS
REACT_APP_GOOGLE_CLIENT_ID=GOOGLE_CLIENT_ID
REACT_APP_GOOGLE_ANALYTICS_KEY=ANALYTICS_KEY
React is the current industry standard that offers a lot of out of the box benefits. It is fast, efficient, and scalable. Due to the large community, finding solutions to potential problems and reference material is much easier, even for a potential dev without a lot of experience who would like to contribute to Main Course. | View Dependency
GraphQL is a query language for APIs and a runtime for fulfilling those queries with your existing data. GraphQL provides a complete and understandable description of the data in your API, gives clients the power to ask for exactly what they need and nothing more, makes it easier to evolve APIs over time, and enables powerful developer tools. | View Dependency
React Apollo allows you to fetch data from your GraphQL server and use it in building complex and reactive UIs using the React framework. React Apollo may be used in any context that React may be used. In the browser, in React Native, or in Node.js when you want to do server-side rendering. | View Dependency
Dotenv is a zero-dependency module that loads environment variables from a .env file into process.env. Storing configuration in the environment separate from code is based on The Twelve-Factor App methodology. | View Dependency
Has a thriving community and offers the ability to directly style multiple components within a file. The syntax used is familiar to JavaScript and improves code cleanliness and makes it easy to get up and going for those without a lot of css experience. Styled components are also very efficient, improving load time for users. | View Dependency
Chakra UI is a simple, modular and accessible component library that gives you all the building blocks you need to build your React applications. | View Dependency
Allows declaration of types for React Props. | View Dependency
Jwt-decode is a small browser library that helps decoding JWTs token which are Base64Url encoded. This library doesn't validate the token, any well formed JWT can be decoded. | View Dependency
Shows which parts of code aren't covered by the test suite | View Dependency
Helps to keep track of values/errors/visited fields, orchestrating validation, and handling submission on a from | View Dependency
Yup is a JavaScript schema builder for value parsing and validation. | View Dependency
A composable charting library built on React components, | View Dependency
Eslint is the dominant linting tool for NodeJS and it makes it possible to establish a clear coding convention for a team or project, as well as aiding in catching various bugs such as variables improperly scoped. | View Dependency
Prettier is an opinionated code formatter that enforces a consistent code style across the entire codebase. | View Dependency
The concept of lint-staged is to run configured linter (or other) tasks on files that are staged in git. lint-staged will always pass a list of all staged files to the task, and ignoring any files should be configured in the task itself. | View Dependency
Husky is a very popular pre-commit git hook that ensures code linting and unit tests are passing before one is able to commit code. | View Dependency