Evan Jones

Trip Dashboard

Background

I spend a lot of time in Southern Utah. I went to college in Orem, Utah, just a 3 hour drive from each of Utah's five national parks. Though I'm out of state now, I still go back regularly for road trips to hike and camp.

When I'm planning a trip to see the outdoors in Utah, there's always a potential logistical challenges due to bad weather. In fact, being blindsided by bad weather got me stranded on a cliff a few years ago on a climbing trip:

Animated GIF showing a snowy canyon in Utah. The camera zooms in to a man sitting on a ledge of rock waiting for rescue.

As I've sinced learned, snow can create dangerous conditions for hiking, clouds can obscure the nightly show of stars and galaxies, and rain can make dirt roads impassable for more obscure locations. I usually find myself checking weather forecasts and traffic cameras several times a day in the week leading up to my travel — often for multiple locations that may be chained together for a single trip. This app consolidates all the information that I would regularly be checking — cloud coverage, precipitation predictions, park entrance traffic, and road cameras — helping me to either anticipate poor conditions and make changes or gain a peace of mind about my plans.

Traffic camera API

Prone to bad driving weather, the State of Utah runs hundreds of road condition cameras, streaming them live 24/7 on the DOT website. What I wanted to do with this app was give the user the ability to populate a dashboard with locations, each one with an associated card comprising a live view of the closest roads. Unfortunately, there's no Utah Department of Transportation API that'll let a user get the URL of the camera closest to a given location, so I made one myself.

First, I needed to manually add cameras — with their coordinates, live stream URL, and a description — to my database. This was pretty tedious, and I needed to add enough to have decent coverage across the southern parts of the state. (This was my database model:)

Then, with my database full of the information I needed, I was able to write a script that matches an input location with the camera closest to it.

After setting the routes up in Django, I was able to send back a JSON object whenever my front-end asked what the closest camera was to a location that the user inputted.

The result of adding a trip to the dashboard is a nice little card with a live view of the road conditions around where I'll (hopefully) soon be going!

You can see the app deployed using AWS here and take a look at the source code for the project here.

Deployment and CI/CD

Write-up coming soon!