Coding with ChatGPT 2 : XKCD for government

So, off the back of the success of my trivial but fun one day Android app build, I decided to launch into a more complicated coding project, cherry-picked from my long list of “to do one day” hobby technical projects. This one will take a little longer but still be fairly easy to do, I thought. Oh, you sweet summer child. It turns out so-called simple projects can run into a whole bunch of complexity very quickly. So, I parked project number two — which I will return to — and picked up project number three. That started out with a very high level of frustration, which I’ll fully blog about in time, but then I had a sudden breakthrough and I was convinced I was sprinting to the end when I ran into a third-party issue with on of the cloud services I was using (*cough*Google*cough*), which I’m still trying to solve.

So, project number four is the charm? Turns out, it was.

This one is another old idea based firmly on this XKCD from Feb 17th 2014, which is explained here.

The idea is simple enough. Each entry pulses to indicate how often something happens on average, from people getting married to Old Faithful erupting.

Long ago, I’d thought to myself, What would that look like, showing data for government services? The answer is it looks like this (you can click on any box to see the citation for the data). The code is public on GitHub.

This one at least really was quite easy 😅. Unlike the more complex things I’d been attempting, this is just made up of the three standard web page components (an HTML file to define the basic page context, a CSS file to define how it looks and a JavaScript file to define any changes or interactions), plus a simple python file to read in the config file (see below) and connect the whole thing to the web server.

Unlike the Android app example, this project had a concrete starting point so I started out by pointing ChatGPT directly to the XKCD URL and asking what it thought it was about — which it got right immediately. After that, it was just a case of describing how I wanted to create my own version and going through the copy-from-ChatGPT-to-cloud-hosted-code-editor cycle over and over again, while describing what visual changes I’d like to see for each iteration (I can’t wait for ChatGPT to be allowed to do that part itself directly). I don’t think I encountered a single coding error in that whole period so it really was just me acting as Art Director to ChatGPT’s product.

And it was all that easy. Ha ha, no 🙄.

Firstly, I decided that I wanted to be able to specify what data the site showed from a separate file so that, to update it, I didn’t need to change the code. Getting ChatGPT to update the python script to handle that was trivial. All I needed to do then was decide what data I wanted to show and be able to provide a citation for each one (that was really important to me). I eventually ended up with this spreadsheet (name of data, instances per year, citing organisation, citation link).

Coming up with enough things that government does frequently enough to work visually was hard enough — naturally, I asked ChatGPT for a starter list — but finding authoritative documents from reputable organisations that I could cite for such things took nearly as long as getting all the code to work (and often I’m citing data from three or four years ago)!

So, that’s it? Well… Depends on what you count. As I said at the top of the page, this is the third project I attempted after the Android app. Both of the other two are also web apps. Like all the hassle I had with the infrastructure for the Android app (in that case dependency management), which took longer to fix than creating the app, I had a whole bunch of similar issues when I started developing my first new web app.

I won’t go into the hairy details but, in that instance, it was setting up the reverse-proxy (Nginx), understanding the python supporting framework (Flask), the single-app web server (Gunicorn) and the Linux process control system (Supervisor). Learning all of those, again fundamentally supported by ChatCPT, took more than a day.

However! Once I’d got my head around it all the first time, I could copy 90% of the configuration every time I wanted to create a new web app. This meant that, when I needed to set up the digital infrastructure for the Frequency app, it only took me half an hour.

So, all the infrastructure and code for my version of Frequency took around 4–5 hours, with maybe another 3–4 hours of finding the appropriate data and citations.

I’m really happy with how it turned out. If you have any thoughts on how it could be improved or for any new data examples that could be added, please let me know in a comment on this post.