https://github.com/sammyleths/xcisetrackr

XciseTrackr is a simple web application that allows users track their physical exercise. Built with HTML5, SCSS / CSS, JavaScript, Leaflet
https://github.com/sammyleths/xcisetrackr

css3 exercise-tracker html5 javascript javascript-library leafletjs npm sass scss vanilla-javascript

Last synced: 9 months ago
JSON representation

XciseTrackr is a simple web application that allows users track their physical exercise. Built with HTML5, SCSS / CSS, JavaScript, Leaflet

• Host: GitHub
• URL: https://github.com/sammyleths/xcisetrackr
• Owner: SammyLeths
• License: mit
• Created: 2022-12-06T16:14:17.000Z (over 3 years ago)
• Default Branch: master
• Last Pushed: 2025-02-15T21:18:46.000Z (over 1 year ago)
• Last Synced: 2025-09-16T19:35:20.961Z (9 months ago)
• Topics: css3, exercise-tracker, html5, javascript, javascript-library, leafletjs, npm, sass, scss, vanilla-javascript
• Language: JavaScript
• Homepage: https://xcisetrackr.netlify.app/
• Size: 37.1 KB
• Stars: 6
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
XciseTrackr


XciseTrackr is a simple web application that allows users track their physical exercise such as cycling and running based on the location where these workouts were performed. The application also enables the user save specific details about each workout activity such as the distance covered, duration of the exercise, and cadence or stride rate which are store in the browser local storage.

This web application features an interactive map from the Leaflet library which allows users to place pin on the specific location where their exercise took place. The entire app was bult with the following:



  
HTML5

  
SCSS / CSS

  
JavaScript

  
Leaflet

  
Dev dependencies such as: Autoprefixer and PostCSS



Screenshot


![Artboard 1v1-min](https://user-images.githubusercontent.com/64320618/209964006-3dbe7f32-7e9b-4fad-908d-5719145305a9.png)

Links




  
Demo: https://xcisetrackr.netlify.app/





Tech Stack




  

  

  

  



Helpful Resources




  


HTML5: 

    


      


MDN: Mozilla Developer Network - HTML (HyperText Markup Language)

      


W3SCHOOL: HTML Introduction

    

  

  


CSS3: 

    


      


MDN: Mozilla Developer Network - CSS (Cascading Style Sheets)

      


W3SCHOOL: CSS Introduction

    

  

  


JAVASCRIPT: 

    


      


MDN: Mozilla Developer Network - JavaScript (JS) is a lightweight, interpreted, or just-in-time compiled programming language with first-class functions

      


W3SCHOOL: JavaScript Introduction

    

  

  


    LEAFLET: JavaScript library for mobile-friendly interactive maps

  

  


DEV DEPENDENCIES: 

    


      


Autoprefixer: Parse CSS and add vendor prefixes to CSS rules

      


PostCSS: Tool for transforming styles with JS plugins

    

  

  


    MUGSHOTBOT: Automatic beautiful link previews

  



Author's Links




  
Portfolio - @SammyLeths



  
Linkedin - @SammyLeths



  
Twitter - @SammyLeths



  
Buy me a Coffee - @SammyLeths