GymTrack – A new way to check your gym progress
Static Site built with React + Typescript
Site link: https://gym-track-sports.netlify.app/
Author: Rafael Abusleme
Monitoring your trainings sessions has always been a headache for everyone, directly affecting your progress and you don’t really know if you are progressing.
However, using GymTrack you can easily record your training sessions (exercises, reps, weights, time, etc) and see your real progress in a very friendly and effective way.
Join to GymTrack, a new way to check your progress!
Backlog – GymTrack Board
Disclaimer: The project is in MVP phase, so many features haven’t been developed.
To see the project progress and visualize the past/current/future features click the following link GymTrack – Board.
- Node v16.X https://nodejs.org/
In the project directory, you can run:
Install project dependencies. This step is required for running the following scripts.
Runs the app. Open http://localhost:3000 to view it in your browser.
Launches the test runner in the interactive watch mode.
npm run build
Builds the app for production to the
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes. Your app is ready to be deployed!
npm run lint
Run linters on project code and throw warnings/errors based on defined rules.
npm run format
Format code based on defined prettier rules.
envs/contains env variables for each environment
App.tsxmain component of the project
index.tsxrenders the app
assets/contains icons, images, fonts, etc
pages/contains React Components used as a view
shared/contains reusable logic
components/contains reusable React Components
constants/contains constants values
context/contains components for share global states using Context API
hooks/contains reusable component state logic
interfaces/contains interfaces for typescript
services/contains logic to interact with external services
utils/contains generic logic to use across de app
All changes must to be included in the
CHANGELOG.md file, using Semantic Versioning (https://semver.org/spec/v2.0.0.html)
- Use PascalCase for React Components
- Use camelCase for variables, methods, filenames, etc
- Commits standard based on this document
- Use BEM for css class naming BEM.