A geospatial distance measurement app.
It is live at https://trinkle.vercel.app/
We can click at a position on map to mark points and measure the total distance between them. Clicking twice on a point removes it from the map.
- Fork and clone the repository in your system and navigate to the project directory.
- Setup an
.env.local
file in root of the project withNEXT_PUBLIC_MAPBOX_TOKEN
and provide your mapbox token. - Install all the project dependencies using
npm install
command. - Run
npm start
to start the local server. Openhttp://localhost:3000
to view the project in the browser.
- React JS - A JavaScript library for building user interfaces
- Mapbox GL JS - A JavaScript library that uses WebGL to render interactive maps
- Next.js - The React Framework for Production
- Vercel Platform - App for deploying NextJS app
- Setting up Redux with NextJS
- Developed using NextJS. Followed component architecture, DRY, separation of concerns and other best practices.
- Project is mobile responsive.
A very decent lighthouse score