Commute MBTA

On my morning commutes, I like to know when the next street car is coming before leaving my apartment. Otherwise, I would walk over to the nearest T station just to catch it leaving, and then be forced to wait for the next arrival. Transit apps like Google Maps solve this issue, but they all tend to have an excessive interface and require too much user input for something that should be as easy as glancing at a watch.

I wanted a simple, informative app that tells me everything I need to know for my mornings, and that’s how I came up with the idea for CommuteMBTA.

Before I did anything, I sketched the best UI I could think of, which I stayed pretty faithful to in the end. My motivation for the project is speed — I don’t want to have to linger on the site.

Then I decided on a framework. For this simple web app, I wanted to use the most popular option among web developers, ReactJS. Of course, anything that helps to speed up development time would work - I just wanted to gain as much experience with the most relevant tools as possible.

Web development was not something I was familiar with. Since this was my first Javascript project, I had a lot of Youtube guides to watch and docs to read. Thankfully, my good friend Nico was always there to help me with debugging when I hit a wall.

The design process involved a surprisingly wide array of topics: API calls, state management, async operations, caching, event handling, continuous deployment, and so many more. The most important thing I’ve learned from this project is that building solutions to everyday problems is way more achievable than I had initially thought.