React-based web application for Full Circle Future

A web application to explore the impact of landfills

Full Cirlce Future Waste Impact Tracker

Sample Video

This is a video that Erin quickly made so we could see what it looks like. The first one (in chrome - the webm file) was 'scaled' to 1080 width with ffmpeg while the second one is a straight conversion with a height/width set in html. We will need to adjust scaling/ratios and html to get better text quality.

The project

We developed a Waste Impact Tracker web application filled with maps and charts that allows users to visualize landfill trends and details nationally and by state. The application shows users how landfill pollution impacts communities across the country and suggests strategies for addressing these impacts.

Our role

We built the tool from start to finish including design, building the data pipeline and building the application. We worked closely with the team at Full Cirlce Future to implement their vision. This included a close partnership with the Full Circle data team to determine the best approach for processing and managing data and deploying the application.

Features of the work

  • We wrote the application using React with Typescript.
  • We used Mapbox with React Map GL to display data and custom raster images.
  • We integrated Sanity CMS to provide full content control with real-time updating by the client.
  • We built a data pipeline in Python that retrieves and processes imagery from an API.
  • We deployed the data pipeline and used GitHub Actions to schedule it to run on a weekly basis.

Tools used

React

React

Typescript

Typescript

Python

Python

Mapbox

Mapbox

Sanity

Sanity

Made for

Full Cirlce Future