This is the frontend to Amazon Mining Watch built on Next.js and react-map-gl. It uses Next's native i18n support and App Router. As Next's language handling is still in flux at time of writing, it uses some custom middlewear and a cookie to persist the user's locale.
Content is pulled from markdown files in ./markdown.
Interface translations are stored in ./dictionaries.
To create a production build:
- Ensure you have created an
.env.localfile and populated it with the required env vars. - Run
yarn buildto create a production build.
Rename env-example.txt to .env and add your env values.
Make sure you're using node version 22. If you use nvm, run:
nvm useFirst, install dependences:
yarn installand then start the dev server:
yarn devAfter uploading the mining data to S3 from the mining-detector repo, you will need to change the DATA_UPDATED_AT variable in src/constants/map.ts to the same one you're setting as the data updated date in the mining-detector scripts.
Then, add a new layer to MINING_LAYERS, in src/constants/map.ts. Remember to set the values:
yearQuarter: in YYYYQQ format, e.g. 202504 is 2025-Q4, 202200 means the entire year of 2022, no quartersatelliteEndpoint: the endpoint for the satellite imagerysatelliteDates: the dates part of the satellite imagery url, in the format:YYYY-MM-DD/YYYY-MM-DD(start date/end date)
The MINING_VECTOR_TILES_LAYER and MINING_VECTOR_TILES_URL variables should stay the same, and they should point to the same .pmtiles file on S3, now updated.