Data

Tools

Indexes

Applications

Experiments

Open Sustainable Technology

Mangrove Atlas

An online platform that provides the remote sensing data and tools for monitoring mangroves.
https://github.com/Vizzuality/mangrove-atlas

Category: Biosphere
Sub Category: Forest Observation and Management

Keywords from Contributors

climate-change redux forest-monitoring deforestation wri-api half-earth biodiversity arcgisjs conservation climate

Last synced: about 21 hours ago
JSON representation

Repository metadata

Global Mangrove Watch

README.md

Mangrove Atlas

Screenshot 2023-07-14 at 08 48 02

Overview

Global Mangrove Watch (GMW) is an online platform that provides remote sensing data and tools for monitoring mangroves. It gives universal access to near real-time information on where and what changes there are to mangroves across the world, and highlights why they are valuable.

Tech Stack

Getting Started

Requirements

  • Node.js 22 (see .nvmrc)
  • pnpm 10.x

Setup

  1. Clone the repository
  2. Use the correct Node.js version: 
    nvm use
  3. Install dependencies: 
    pnpm install
  4. Copy the environment file and fill in the required values: 
    cp .env.default .env
  5. Start the development server: 
    pnpm dev

The app will be available at http://localhost:3000.

Commands

pnpm dev              # Start dev server (port 3000)
pnpm build            # Production build
pnpm lint             # Run ESLint
pnpm check-types      # TypeScript type checking
pnpm test             # Run Playwright end-to-end tests
pnpm test-ui          # Run Playwright tests with interactive UI

Run a single Playwright test:

npx playwright test tests/navigation.spec.ts

Project Structure

src/
├── pages/              # Next.js pages (catch-all route at [[...params]].tsx)
├── containers/
│   ├── datasets/       # Widget-specific code (data hooks, charts, map layers)
│   └── widgets/        # Widget system configuration & constants
├── components/         # Shared UI components
├── store/              # Recoil atoms organized by domain
├── services/           # API clients (Axios instances)
├── hooks/              # Shared React hooks
├── utils/              # Utility functions
├── types/              # TypeScript type definitions
└── styles/             # Global styles

cloud-functions/        # Google Cloud Functions (Node.js 22)
├── analysis/           # Geospatial analysis (habitat extent, net change, biomass)
├── alerts-tiler/       # Tile server for alert visualization
├── fetch-alerts/       # Deforestation alert data from Google Earth Engine
├── fetch-alerts-heatmap/
└── upload-alerts/

URL Patterns

The app uses a catch-all route (src/pages/[[...params]].tsx) with these patterns:

  • / — worldwide view
  • /country/:id — country view
  • /wdpa/:id — protected area view
  • /custom-area/:id — user-drawn area

Environment Variables

Copy .env.default to .env for local development. Key variables:

Variable Description
NEXT_PUBLIC_MAPBOX_ACCESS_TOKEN Mapbox token (required for map rendering)
NEXT_PUBLIC_VERCEL_ENV Controls API URL selection (development / staging / production)
NEXT_PUBLIC_API_URL Backend API URL (staging)
NEXT_PUBLIC_API_URL Backend API URL (production)
NEXT_PUBLIC_ANALYSIS_API_URL Analysis cloud function base URL (bare cloud-functions domain)
NEXT_PUBLIC_ANALYSIS_API_PATH Analysis function name per env (analysis / analysis-staging / analysis-production)
NEXT_PUBLIC_BLOG_API_URL WordPress blog API URL
NEXT_PUBLIC_PLANET_API_KEY Planet satellite imagery API key
NEXT_PUBLIC_TRANSIFEX_API_KEY Transifex API key for i18n
NEXT_PUBLIC_GA_ID Google Analytics 4 tracking ID
NEXTAUTH_SECRET Secret for NextAuth session encryption
NEXTAUTH_URL NextAuth base URL

See .env.default for the full list.

Analytics

This project uses Google Analytics 4 (GA4) via react-ga4. Analytics is initialized only when NEXT_PUBLIC_GA_ID is set. Custom events follow the trackEvent wrapper pattern with GA4-recommended structure.

Deployment

The app is deployed on Vercel. Cloud functions are deployed independently via GitHub Actions on push to develop/master when their files change.

Playwright tests run automatically on PRs to develop (after the Vercel preview deploy completes).

Contributing

Create a PR for any improvement or feature. Avoid committing directly to develop or master.

Code Style

  • ESLint flat config with Prettier integration
  • Prettier: single quotes, trailing commas (es5), 100 char line width, Tailwind CSS plugin
  • Pre-commit hook runs lint on staged files via lint-staged

Vulnerability Mitigation

Dependabot alerts are configured for this repository.

To check for production vulnerabilities:

pnpm audit --prod

When a vulnerability is detected:

  1. Check if it affects production dependencies
  2. Try creating a Dependabot security update PR
  3. If automatic fixes fail, manually update the affected dependencies

Owner metadata

GitHub Events

Total
Last Year

Committers metadata

Last synced: 9 months ago

Total Commits: 2,130
Total Committers: 20
Avg Commits per committer: 106.5
Development Distribution Score (DDS): 0.577

Commits in past year: 143
Committers in past year: 3
Avg Commits per committer in past year: 47.667
Development Distribution Score (DDS) in past year: 0.105

Name Email Commits
mluena m****d@g****m 900
anamontiaga a****a@g****m 460
mluena m****a@v****m 202
David Inga d****a@v****m 131
Alicia a****a@g****m 118
Migsar m****o@v****m 92
Andrés González Muñoz a****z@v****m 68
dependabot[bot] 4****] 58
AngelArcones a****s@g****m 36
moose t****e@g****m 16
Melissa Nunes m****s@s****m 10
barbara-chaves b****0@g****m 8
tamaramegan t****e@g****m 8
Maria Sola m****a@v****m 7
“mluena” “****d@g****” 7
Lammert Hilarides l****s@g****m 4
Edward P. Morris 8****s 2
AbdoKousara 5****a 1
Clément Prod'homme c****t@c****r 1
Miguel Barrenechea Sánchez m****a@v****m 1

Committer domains:

Issue and Pull Request metadata

Last synced: 9 months ago

Total issues: 124
Total pull requests: 514
Average time to close issues: about 1 year
Average time to close pull requests: 24 days
Total issue authors: 9
Total pull request authors: 8
Average comments per issue: 3.43
Average comments per pull request: 1.0
Merged pull request: 389
Bot issues: 1
Bot pull requests: 103

Past year issues: 15
Past year pull requests: 146
Past year average time to close issues: about 2 months
Past year average time to close pull requests: 15 days
Past year issue authors: 5
Past year pull request authors: 3
Past year average comments per issue: 2.13
Past year average comments per pull request: 0.92
Past year merged pull request: 101
Past year bot issues: 0
Past year bot pull requests: 33

More stats: https://issues.ecosyste.ms/repositories/lookup?url=https://github.com/Vizzuality/mangrove-atlas

Top Issue Authors

  • lhilarides (72)
  • klongleywood (23)
  • dhakelila (11)
  • larranz-vizz (9)
  • mluena (4)
  • aagm (2)
  • agnlez (1)
  • AngelArcones (1)
  • dependabot[bot] (1)

Top Pull Request Authors

  • mluena (325)
  • dependabot[bot] (103)
  • anamontiaga (72)
  • barbara-chaves (4)
  • lhilarides (4)
  • aagm (3)
  • mariasola (2)
  • davidsingal (1)

Top Issue Labels

  • QC (84)
  • bug (25)
  • data (7)
  • GMW8 JULY 2025 (4)
  • WIP (3)
  • enhancement (3)
  • OLD (2)
  • N/A (1)
  • dependencies (1)

Top Pull Request Labels

  • dependencies (103)
  • javascript (46)
  • ready to review (27)
  • WIP (2)
  • don't merge (2)
  • python (2)
  • priority (1)

Package metadata

proxy.golang.org: github.com/Vizzuality/mangrove-atlas

proxy.golang.org: github.com/vizzuality/mangrove-atlas

Dependencies

cloud-functions/analysis/package-lock.json npm
  • @google-cloud/functions-framework 1.6.0 development
  • accepts 1.3.7 development
  • array-flatten 1.1.1 development
  • body-parser 1.19.0 development
  • bytes 3.1.0 development
  • content-disposition 0.5.3 development
  • content-type 1.0.4 development
  • cookie 0.4.0 development
  • cookie-signature 1.0.6 development
  • debug 2.6.9 development
  • depd 1.1.2 development
  • destroy 1.0.4 development
  • ee-first 1.1.1 development
  • encodeurl 1.0.2 development
  • escape-html 1.0.3 development
  • etag 1.8.1 development
  • express 4.17.1 development
  • finalhandler 1.1.2 development
  • forwarded 0.1.2 development
  • fresh 0.5.2 development
  • http-errors 1.7.2 development
  • iconv-lite 0.4.24 development
  • inherits 2.0.3 development
  • ipaddr.js 1.9.1 development
  • media-typer 0.3.0 development
  • merge-descriptors 1.0.1 development
  • methods 1.1.2 development
  • mime 1.6.0 development
  • mime-db 1.44.0 development
  • mime-types 2.1.27 development
  • minimist 1.2.5 development
  • ms 2.0.0 development
  • ms 2.1.1 development
  • negotiator 0.6.2 development
  • on-finished 2.3.0 development
  • parseurl 1.3.3 development
  • path-to-regexp 0.1.7 development
  • proxy-addr 2.0.6 development
  • range-parser 1.2.1 development
  • raw-body 2.4.0 development
  • safer-buffer 2.1.2 development
  • send 0.17.1 development
  • serve-static 1.14.1 development
  • setprototypeof 1.1.1 development
  • statuses 1.5.0 development
  • toidentifier 1.0.0 development
  • type-is 1.6.18 development
  • unpipe 1.0.0 development
  • utils-merge 1.0.1 development
  • vary 1.1.2 development
  • @google/earthengine 0.1.227
  • abort-controller 3.0.0
  • agent-base 6.0.1
  • arrify 2.0.1
  • base64-js 1.3.1
  • bignumber.js 9.0.0
  • buffer-equal-constant-time 1.0.1
  • debug 4.1.1
  • ecdsa-sig-formatter 1.0.11
  • event-target-shim 5.0.1
  • extend 3.0.2
  • fast-text-encoding 1.0.3
  • gaxios 2.3.4
  • gcp-metadata 3.5.0
  • google-auth-library 5.10.1
  • google-p12-pem 2.0.4
  • googleapis 42.0.0
  • googleapis-common 3.2.2
  • gtoken 4.1.4
  • https-proxy-agent 5.0.0
  • is-stream 2.0.0
  • json-bigint 0.3.1
  • jwa 2.0.0
  • jws 4.0.0
  • lru-cache 5.1.1
  • mime 2.4.6
  • ms 2.1.2
  • node-fetch 2.6.1
  • node-forge 0.9.1
  • qs 6.7.0
  • safe-buffer 5.1.2
  • url-template 2.0.8
  • uuid 7.0.3
  • xmlhttprequest 1.8.0
  • yallist 3.1.1
cloud-functions/analysis/package.json npm
  • @google-cloud/functions-framework ^1.6.0 development
  • @google/earthengine ^0.1.227
cloud-functions/fetch-alerts/package-lock.json npm
  • 111 dependencies
cloud-functions/fetch-alerts/package.json npm
  • @google-cloud/functions-framework ^1.6.0 development
  • @google-cloud/bigquery ^5.0.0
  • axios ^0.21.1
  • turf-reverse ^1.0.0
cloud-functions/fetch-alerts-heatmap/package-lock.json npm
  • 111 dependencies
cloud-functions/fetch-alerts-heatmap/package.json npm
  • @google-cloud/functions-framework ^1.6.0 development
  • @google-cloud/bigquery ^5.0.0
  • axios ^0.21.1
  • turf-reverse ^1.0.0
cloud-functions/upload-alerts/package-lock.json npm
  • 102 dependencies
cloud-functions/upload-alerts/package.json npm
  • @google-cloud/bigquery ^5.0.0
  • @google-cloud/storage ^5.1.1
  • date-fns ^2.14.0
  • stream-chain ^2.2.2
  • stream-json ^1.6.0
package.json npm
  • @babel/core ^7.5.5 development
  • @babel/eslint-parser ^7.12.13 development
  • @babel/eslint-plugin ^7.12.13 development
  • @storybook/addon-actions ^5.0.11 development
  • @storybook/addon-centered ^5.1.9 development
  • @storybook/addon-cssresources ^5.1.9 development
  • @storybook/addon-knobs ^5.1.9 development
  • @storybook/addon-notes ^5.0.11 development
  • @storybook/addons ^5.0.11 development
  • @storybook/react ^5.1.9 development
  • eslint-config-airbnb 17.1.0 development
  • eslint-config-vizzuality ^1.3.0 development
  • eslint-plugin-import ^2.17.2 development
  • eslint-plugin-jsx-a11y 6.1.1 development
  • eslint-plugin-react ^7.21.1 development
  • eslint-plugin-react-hooks 3.0.0 development
  • sass ^1.50.1 development
  • typescript ^3.5.3 development
  • @fortawesome/fontawesome-svg-core ^1.2.19
  • @fortawesome/free-solid-svg-icons ^5.9.0
  • @fortawesome/react-fontawesome ^0.1.4
  • @turf/bbox ^6.0.1
  • axios ^0.21.2
  • babel-loader 8.0.5
  • bowser ^2.6.1
  • chroma-js ^2.4.2
  • classnames ^2.2.6
  • d3-ease ^1.0.5
  • d3-format ^1.3.2
  • deck.gl ^7.1.4
  • eslint-utils ^1.4.2
  • express ^4.17.1
  • express-favicon ^2.0.1
  • framer-motion ^1.11.1
  • lodash ^4.17.21
  • moment ^2.29.2
  • node-sass 4.14.1
  • prop-types ^15.7.2
  • query-string ^6.5.0
  • react ^16.8.6
  • react-bootstrap ^1.0.0-beta.9
  • react-csv ^1.1.1
  • react-dangerous-html ^1.0.0
  • react-datepicker ^2.8.0
  • react-dom ^16.8.6
  • react-intersection-observer ^8.33.1
  • react-map-gl ^5.0.3
  • react-modal ^3.9.1
  • react-on-scroll ^0.2.2
  • react-redux ^8.0.1
  • react-responsive ^7.0.0
  • react-scripts 3.0.1
  • react-select ^3.0.4
  • recharts ^1.6.2
  • redux ^4.0.1
  • redux-devtools-extension ^2.13.8
  • redux-first-router ^2.1.1
  • redux-first-router-link ^2.1.1
  • redux-saga ^1.0.2
  • reselect ^4.0.0
  • viewport-mercator-project ^6.1.1
  • vizzuality-redux-tools ^4.0.2
yarn.lock npm
  • 2016 dependencies
data/notebooks/requirements.txt pypi
  • earthengine-api *
  • gcsfs *
  • geemap *
  • geopandas ==0.10.2
  • google-api-python-client *
  • google-cloud-storage *
  • iso8601 *
  • matplotlib ==3.3.4
  • pandas ==1.2.2
  • pandera *
  • pandera ==0.8.1
  • pystac *
  • python-dotenv >=0.5.1
  • python_jsonschema_objects *
  • rio-cogeo *
  • s3fs *
  • shapely *
  • simpledbf *
  • tqdm ==4.62.3
  • uuid *
  • zenodo_get *
.github/workflows/deploy-analysis.yml actions
  • actions/checkout v3 composite
  • finnp/create-file-action master composite
  • google-github-actions/auth v0.8.0 composite
  • google-github-actions/deploy-cloud-functions v0.10.1 composite
.github/workflows/deploy-fetch-alerts-heatmap.yml actions
  • actions/checkout v3 composite
  • google-github-actions/auth v0.8.0 composite
  • google-github-actions/deploy-cloud-functions v0.10.1 composite
.github/workflows/deploy-fetch-alerts.yml actions
  • actions/checkout v3 composite
  • google-github-actions/auth v0.8.0 composite
  • google-github-actions/deploy-cloud-functions v0.10.1 composite
cloud-functions/upload-alerts/Dockerfile docker
  • osgeo/gdal alpine-normal-latest build
data/docker-compose.yml docker
  • postgis/postgis 14-3.2
data/notebooks/Dockerfile docker
  • base latest build
  • jupyter/datascience-notebook python-3.8.6 build
  • stage_1 latest build
  • stage_2 latest build
.github/workflows/deploy-alerts-tiler.yml actions
  • actions/checkout v3 composite
  • google-github-actions/auth v0.8.0 composite
  • google-github-actions/deploy-cloud-functions v0.10.1 composite
.github/workflows/playwright.yml actions
  • actions/checkout v3 composite
  • actions/setup-node v3 composite
  • actions/upload-artifact v3 composite
  • patrickedqvist/wait-for-vercel-preview v1.3.1 composite
Dockerfile docker
  • node 18.12.1-bullseye build
cloud-functions/upload-alerts/docker-compose.yml docker
docker-compose.yml docker
cloud-functions/alerts-tiler/package-lock.json npm
  • 338 dependencies
cloud-functions/alerts-tiler/package.json npm
  • @google-cloud/functions-framework ^3.3.0 development
  • @mapbox/vector-tile ^1.3.0 development
  • c8 ^8.0.0 development
  • mocha ^10.0.0 development
  • sinon ^15.0.0 development
  • @google-cloud/bigquery ^5.0.0
  • axios ^0.21.4
  • concurrently ^7.2.2
  • nodemon ^2.0.20
  • vt-pbf 3.1.3
  • zlib ^1.0.5

Score: -Infinity