Adding “simple” features

Simple, private, self-hosted, cookie free website day...maybe

Adding “simple” features

I recently added a “simple” toggle so I can show information from different time periods.

Animated GIF of time period toggle

BUT…this is one of this things that seems trivial but really isn’t because of the kinds of engineering decisions you might make.

In this case I’m building and learning test-driven development as I go, and I wanted to use this as an excuse to:

  • try building some Vue.js components
  • practice using the JavaScript fetch API and promises

And to use fetch I had to write an “API” endpoint to grab the relevant data. So the process for building this was:

  • write tests for the API endpoints (which, in my case, involved be building some factory classes too – a job that needed doing anyway)
  • write API endpoint routes
  • write API endpoint controller methods
  • create the Vue components
  • plug it all together with the API calls

(You’ll note that I’m not testing the front end)

Yes, this is modern web development. And yes none of it was particularly difficult.  And yes, it all works fine. And yes, having done this once, subsequent, similar functionality will be quicker to build. But I thought this was one of those insights into how a tiny, trivial looking user interface improvement actually has many moving parts.