Trip Tracker

Nicer web interface for Garmin InReach devices. Uses Garmin-supplied KML feeds and Waypoint API to import data into defined trips.

Components

The entire stack is built/deployed using NX, sequencing builds as necessary. Intermediate build artifacts are stored in NX Cloud.

tracker-app

Frontend for tracker UI, built with React/react-router/MUI. Available at {BASE_URL}/.

tracker-server

Backend for tracker UI, built with Hono/Kysely. Available at {BASE_URL}/api/.

tracker-server-spec

OpenAPI YAML file for the backend, providing specifications for the API functionality. Available at {BASE_URL}/api/openapi/openapi.swagger

tracker-server-client

Axios-based Typescript client autogenerated from tracker-server-spec and used in the Frontend to provide API communication.

Setting up

You will need a FontAwesome Pro NPM key, with instructions to set up available here. You will not be able to install packages until an API key is set up.

Building

You can build all components using npm run build in the main directory. This is equivalent to nx run-many -t build which runs the build job in all projects:

• tracker-server-client
• tracker-server
• tracker-app

Testing

You can run all tests with npm run test in the main directory. This is equivalent to nx run-many -t test which runs the test job in all available projects:

• tracker-server
• tracker-app

Linting / Formatting

You can run npm run lint to run ESLint, npm run format to run Prettier, or npm run fix to run both. This is equivalent to nx run-many -t lint/format/fix which runs the job in all available projects:

• tracker-server
• tracker-app

Local Development

You can run local development servers using npm run serve. This will run multiple servers simultaneously:

• Frontend at http://localhost:4200
• Backend at http://localhost:8787/api
  • Note: A copy of the frontend will be available at http://localhost:8787 but will not auto-update on changes.
  • Note: On codespaces, only the endpoint at https://{codespaces-id}-8787.app.github.dev will work.

dev Deployment

Configure your Cloudflare settings in tracker-server/wrangler.toml and run npm run deploy to deploy the instance to the dev environment defined in the file.

This runs:

• build and prepare-deploy in tracker-server-spec, and tracker-app to build and copy dist files to the server directory
• tracker-server:deploy:dev to deploy frontend, backend, and OpenAPI files to the dev environment

Environments

local

Local-based development, using npm run serve / wrangler dev.

Name	URL
Frontend	http://localhost:4200/
API	http://localhost:8787/api/
OpenAPI Schema	http://localhost:8787/api/openapi/openapi.swagger

dev

Deployments initiated using local npm run deploy command.

Name	URL
Frontend	https://dev.track.vlad.gg/
API	https://dev.track.vlad.gg/api/
OpenAPI Schema	https://dev.track.vlad.gg/api/openapi/openapi.swagger

staging

Deployments initiated by Github Actions when a PR is created against the main branch.

Name	URL
Frontend	https://staging.track.vlad.gg/
API	https://staging.track.vlad.gg/api/
OpenAPI Schema	https://staging.track.vlad.gg/api/openapi/openapi.swagger

live

Deployments initiated by Github Actions on pushes to main branch.

Name	URL
Frontend	https://track.vlad.gg/
API	https://track.vlad.gg/api/
OpenAPI Schema	https://track.vlad.gg/api/openapi/openapi.swagger