alexawesomecode / awesome-body-tracker

Track your body parts measures. React, Bootstrap and Rails API (Backend).

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Contributors

Forks Stargazers

Issues MIT License


Logo

Awesome Body Tracker

Live Version link - http://www.alejandro.work:3001

Project

This an app where you can log different body part measures, how much your body is growing or shrinking, in centimeters.

This is useful if you are working out and need to keep track of your chest muscle measure, or if you want to lose weight and want to track your weight.

With this app you can keep a log and track every item and see the progress towards your target.

You can see charts of your overall progress (by default it shows you biceps and triceps on the Progress tab) and also a detailed view of every record when you go to the Bodypart section.

This app is built with React for the frontend and It hits an API endpoint built with Rails that you can find here

Design

Login

This the first screen you see when browsing.

login

Progress

Next you are moved to the 'Progress' page where you can see some stats about your progress.

progress

Track it

Here you are faced with all the items you are tracking. If you click on them you are redirected to the items details.

trackit

Track Card Detail

This is a list of items with time details.

trackcard

Add measure

Here you can add measure. You choose the item and value.

measure

Test

After you run npm install, you can run 'npm run test'. This will run Jest on test files located at 'test' folder.

Future Roadmap

  • Create custom bodyparts and measures to keep track
  • Chart your progress
  • Export you data as JSON

Validations

  • ESLINT
  • Stylelint

Get Started

Download or clone this repo here, enter the main folder and do npm install followed by npm start.

The you go to http://localhost:3000

You need to setup also the backend. Go here for instructions.

Built With

This project was built with these techologies:

  • React + Redux
  • Javascript
  • ES6
  • Lodash
  • Webpack & Babel
  • HTML
  • CSS3

Authors

Alejandro Andres

License

This project is licensed under the MIT License - see the LICENSE.md file for details

Acknowledgements

About

Track your body parts measures. React, Bootstrap and Rails API (Backend).


Languages

Language:JavaScript 85.5%Language:CSS 7.8%Language:HTML 6.6%Language:Shell 0.1%