Frontend of GPS-Tools based on React and Leaflet

This is the frontend of GPS-Tools Backend. It provides some useful features for dealing with GPS files:

• Merging GPS-files
• Converting between formats (FIT, GPX, TCX, GeoJSON)
• Visualizing GPS-files on a map
• Adding, changing and removing waypoints
• Optimization of waypoints to improve performance on GPS-devices

Production

The prod website is hosted by Cloudflare at: https://gps-tools.pages.dev/

How-to run

… with mocks for development and tests

While running in develoment mode, all APIs (GPS-Tools-backend, tile-server, photon) are mocked with Mock Service Worker.

npm run dev

Open http://localhost:5173/

… locally with all external APIs

Start the GPS-Tool-backend

docker run -p 7001:7001 devshred/gps-tools-backend

Create the file .env.local and add the URL of the backend-API:

VITE_BACKEND_BASE_URL=http://localhost:7001/api/v1

Build and start the application

npm run build
npm run preview

Open http://localhost:4173/

Release process

This project is using semantic versioning and conventional commits. It's recommended to use Commitizen to commit changes.

Codequality will be checked by ESLint and Prettier. To use these tools, automatically fix problems and execute the tests, run

npm run check:fix

See package.json for more options on using these tools.

As soon as code has been pushed to the main branch, a GitHub Actions workflow checks for fixes or new features and, if necessary, creates a new tag and a new release. Every new release triggers the deployment to Cloudflare.

End-to-end tests

The e2e tests are based on Playwright and Axe to check for accessibility of content and functionality. You can run these tests by

npm run test:e2e