Case study for progressive web application

Overview

The Social Eyes Application is a serverless Progressive Web Application which accesses the Google Calendar API to show upcoming events for Web Developers. The user can filter events by city as well as choose the number of events to be shown.

Purpose

Social Eyes was a part of the Career Foundry Web Development Course. Building on the knowledge of APIs and servers, this app added web authentication as an additional programming feature.

Objective

My objective with this project was to develop a consistent and usable interface for both mobile and desktop platforms. I didn't want this app to be limited to the office as its aim is to help connect web development professionals and aspiring developers. I find myself sharing equal time between the two platforms and I hoped to make the transition between as seamless as possible.

Approach

To build this application I started with writing automated tests, then implemented code to make each test pass (The Test Driven Development Approach). I found this process to be fascinating and very focusing. I often find myself trying to take on too big of chunks at a time. This approach helped with that tendency quite a lot. This approach also encouraged me in that the code I had written had already passed its test so I could rest assured when an error arose it was probably related to newly implemented code.

Challenges

Though it was a boon, and a tool I will use time an again, TDD was hard to wrap my head around at first. I kept trying to take on too much at a time and write a test for a larger piece than I needed to. I had to really take a step back and implement one tiny step at a time.
My inclination was to write a test for a button which, when clicked, navigated to the next screen. What I had to discipline myself to do was write a test for whether or not there was a button. Then code for that button. Then write a test for whether the button was pressed. Then code for that. When playing chess, which I love, the need is to look 4 or more steps ahead. While that is valuable in web development, taking each move One. At. A. Time. is very important.
Another challenge came as I attempted to verify the app for release. Through the process I moved or deleted a crucial file. I did not notice until after I had pushed the update to GitHub. I was working through various blocks of code to find out why my login screen was not functioning as intended. Once I disabled the login screen I found I had no data. I had a moment of panic when I thought I would have to start over. But knowing how the development process had gone, and after taking time away from the project, I knew that everything had been functioning correctly. It didn’t take a terribly long time to weed through the project and find a missing authorization key in a handler file. The takeaway is to take time away. Refresh the mind then get back at it.

Credits

Role: Lead Developer

Tutor: Ebere Iweala

Mentor: John Behan