ReactJSDockerPostgreSQLFlask

Capstone

By Blake Marterella
Picture of the author
Published on
Semester
Spring 2025
Course
Software Engineering Capstone
Interactive data visualization for traffic, volume, and crash data
Interactive data visualization for traffic, volume, and crash data
Collections page for viewing all merged datasets
Collections page for viewing all merged datasets
View more details about a specific merged dataset
View more details about a specific merged dataset
+3

Project Overview

Every day, thousands of drivers utilize highways and interstates covering the vast corners of Virginia. At Virginia Tech, many faculty, staff, and students, both undergraduate and graduate, rely on these roads for daily commutes. Due to the length and frequency of use of these road segments, crashes are common and often place individuals in harmful situations.

Crash prediction models can be instrumental in reducing risk, but their effectiveness relies on the availability of clean, well-structured datasets. This project introduces a web-based application that enables users to upload three different traffic-related datasets—Linear Referencing System (LRS), Average Daily Traffic (ADT), and crash reports—and merge them based on the spatial geometry of roads and crash locations. The merged data is then visualized on an interactive map, allowing users to explore crash-prone areas with year-based filtering.

The system is built using PostgreSQL with PostGIS, Flask, and GeoPandas, and it supports spatial joins, geometric filtering, and dataset export. By providing tools for dataset creation and visualization, this application aids both researchers and drivers in making informed, data-driven decisions about road safety and travel planning. With this goal, hopefully driving will become safer for all throughout the entire state of Virginia.

Contributions

I worked alongside a team of 3 other developers to build the full-stack application from the ground up. A main goal during the development process was architecting the foundation for future students to build upon. This included:

  • Designing a directory and component library structure for the React frontend to promote reusability and scalability.
  • Utilizing docker-compose to containerize the entire application, including the PostgreSQL database with PostGIS extension, Flask backend, and React frontend so that developers on any system could get the application up and running quickly.
  • Structuring API endpoints in Flask to be modular and easily extendable for future features.

The official report has been published to Virginia Tech's library and can be found below. It contains a detailed look at the project's requirements, design decisions, architecture, and future work.

Official Report

VT Works Library Publication