Runner Tracker Front-end

Runner Tracker Front-end

📗 Table of Contents

• Runner Tracker Front-end
• 📗 Table of Contents
• Runner Tracker Front-end
  • 🛠 Built With
    • Tech Stack
    • Key Feature
  • 🚀 Live Demo
  • 💻 Getting Started
    • Prerequisites
    • Setup
    • Install
    • Usage
    • Run tests
    • Deployment
  • 👥 Author
  • 🔭 Future Features
  • 🤝 Contributing
  • ⭐️ Show your support
  • 🙏 Acknowledgments
  • ❓ FAQ
  • 📝 License

Runner Tracker Front-end

This full-stack application, developed using PostgreSQL, Node.js, React.js, Heroku, Tachyons, and JWT, enables users to log and monitor their running activities. Specifically, it allows for the tracking and storage of both the duration and distance covered during each run. Designed for runners seeking a comprehensive view of their training progress, the app provides an intuitive and user-friendly interface to input and review their activity metrics effectively.

Runner Tracker Back-end -- Source code

🛠 Built With

HTML, CSS, JavaScript, React.js

Tech Stack

Client

• HTML
• CSS
• JavaScript
• React.js

Back-end

• Node.js
• Express.js

Package Manager

• npm

Linters

• ESLint
• Stylelint

Key Feature

• It tracks training progress.
• It shows progress with a graph to let the user visually see improvements.

(back to top)

🚀 Live Demo

Live Demo Link

(back to top)

💻 Getting Started

To get a local copy up and running, follow these steps.

Prerequisites

In order to run this project you need:

• A web browser to view output e.g Google Chrome.
• An IDE e.g Visual studio code.
• node should be installed in your local machine, node website.
• Install the npm package manager use this to install both node and npm.
• A terminal.

Setup

Clone this repository to your desired folder or download the Zip folder:

Use the following command to clone this project:

git clone https://github.com/Alejandroq12/runner-tracker.git

• Navigate to the location of the folder in your machine:

you@your-Pc-name:~$ cd runner-tracker

Install

To install all dependencies, run:

npm install

Usage

To run the project, follow these instructions:

• After Cloning this repo to your local machine.

• You must use npm run start:dev command in terminal to run this at the localhost.

• Make sure that you are also running the back-end Runner Tracker Back-end -- Source code

Run tests

Tests are noy ready but you may run linters to check certain errors:

• Track CSS linter errors run:

npx stylelint "**/*.{css,scss}"

• Track JavaScript linter errors run:

npx eslint "**/*.{js,jsx}"

Deployment

You can deploy this project using: Netlify, Render, Heroku or GitHub Pages,

• I am using Heroku to deploy it.
• For more information about deployment on Heroku see "Heroku".

(back to top)

👥 Author

👤 Julio Quezada

• GitHub: Alejandroq12
• Twitter: @JulioAle54
• LinkedIn: Julio Quezada

(back to top)

🔭 Future Features

• I will improve security.
• I will improve performance.
• I will reuse some React.js components to avoid repetition.

(back to top)

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

(back to top)

⭐️ Show your support

If you like this project give me a star ⭐️.

(back to top)

🙏 Acknowledgments

I want to thank all my colleagues that share knowledge with and inspired to to improve each day.

(back to top)

❓ FAQ

• What did you learned?

  • Through developing this full-stack application, I gained hands-on experience in integrating PostgreSQL, Node.js, React.js, and JWT for secure and effective data handling and user authentication. I learned to deploy applications seamlessly using Heroku and employed Tachyons for rapid, responsive design. This project improved my skills in creating a tracking system, specifically created for runners, to monitor the duration and distance of their activities, enhancing their training progress with an intuitive and user-friendly interface.

(back to top)

📝 License

This project is LICENSE licensed.

(back to top)