No one has really been following this series, and that’s…fine. Hopefully with such a small audience, no one will notice that I am including screenshots of code to mask the fact that I never figured out how to use something like Gist on WordPress. I am not sure if it would be very useful to include usable code, anyway – it only makes sense in the context of the whole project, and I am not sure if Smack ever wants to open source this (though I have permission to include screenshots). The frontend is viewable (looks minified), but the backend is not.
Here, free sample
Now that that’s out of the way
Setting Up An Environment
I kind of enjoyed this, actually. The setup was on Hostinger, about $60 for a one-year plan (they didn’t sponsor this project, unfortunately; if they had – though I cannot imagine why they would – then that would have cut down the costs) and Smack left me instructions. He setup a mirror site, so that when I ran his backend via a virtual environment/”python3 app.py” and his frontend via “npm run dev,” it automatically deployed the results to a different URL. This was fantastic – in theory. In practice, the virtual machine kept crashing and had to be restarted; using Visual Studio Code’s SSH feature was similarly laggy. I don’t know if a 1-core VPU just wasn’t enough to do hosting and test development, but Smack’s setup was useful whenever I was actually ready to deploy via Docker.
It was easier to do things locally, once I learned to set up a virtual environment and used an scp command to bring relevant files from the virtual machine (we called it “prod”) to my local desktop, which happened to be an iMac running Sonoma.
The Linux setup could be its own blog post, albeit not a very interesting one. Hostinger lets you choose what kind of environment you want, and we decided to go with Ubuntu (I initially chose CentOS, but it wasn’t hard to change it). You can use the Hostinger site to SSH directly as root with a click, but you can also set up an SSH key and use an SSH client.
The key(s), at least in Ubuntu, is to add the relevant public keys to authorized_keys. Smack asked that I immediately disable password authentication; SSH access was therefore necessary, or Smack never would have been able to migrate and would have been forced to carry out this project without a million blog posts.
Is Hostinger the best? I really don’t know, and am having similar questions about my choice to use WordPress with Hostinger instead of just using WordPress. But here we are.
Setup could still be its own blog post.
Relative Coloring
This, and doing the entire country were the most requested features (okay, the latter was more commonly requested…I’m just trying to blow up this feature’s importance). The user could configure yellow/red cutoff values, but one user received 351 likes for his/her request that the site automatically recolor based on current distribution.
Check “relative coloring,” and the website will do just that. It only works with boxes – that’s a bug – but it can be useful to see how radically different “green” is in, say, the Bay Area as opposed to somewhere like Texas.
Also, the values on the left will automatically recalculate alongside “relative coloring,” and freeze if relative coloring is selected. The good thing about this is that it is more transparent. The bad thing about this is that if you try to load a lot of values very quickly, the numbers will flash a bunch of times.
County Coloring
Someone on Reddit provided Smack with a shapefile; I’m not sure if that’s what he ended up using. He asked that I, in turn, switch to coloring by county instead of with the boxes.
It took longer than expected. He amended his request – draw the lines, and he would fill in the median values himself.
It’s still in progress, but I stand by the belief (hope?) that the basic functionality is there.
The Dangers Of Pairing Artificial Intelligence With Human Stupidity
In version 1, Smack coded everything without AI.
In version 2, I used ChatGPT a lot and with mixed success. On initial setup I think it was great – it would provide tips and commands that were generally quite helpful, sometimes more than I had initially thought.
Where things really came apart, I think, is drawing the line between “AI-coding” and “vibe coding,” the latter of which is a euphemism for an age-old coding style called not-knowing-wtf-you-are-doing. I don’t know if this experience has made me more pro-AI, or more anti-AI (snarky critics might call this “user error”). At first, ChatGPT made me question if using AI was worth it – it gave me code that did not seem to do anything, nor did it seem to even have the correct idea what to do. Eventually ChatGPT, with lots of back and forth, gave me React TypeScript code that miraculously achieved what I had asked. I verified percentiles, printed out values to test – what Smack initially had in version 1 was closer than I had realized to already having this feature, since it was already doing the work of only calculating values based on zoom. But the multiple useEffect’s it gave me were not efficient, which Smack had to investigate. Fine. I didn’t see any obvious ways to avoid this, but I am not very experienced in React.
As for the backend…
We were getting this geojson data that didn’t make any sense. For my part, I used an open source command line utility to convert a shapefile into a geojson, then tried to sanity check Smack’s file by comparing it to really simple geojsons via CodePen. After some back and forth, I vibe coded (yeah, I know…) my own version of Smack’s Python geopandas script that spat out a usable counties geojson file with medians.
It’s the “vibe-coding” that gave Smack pause, I imagine…especially given past experience. I ran a diff and verified that the vibe-coded script was producing values that were mostly consistent with Smack’s maybe 99% of the time, and Smack validated that the script’s data looked okay – but why 99%? And was Smack’s original Python script, which also involved AI, accurate? It certainly looked correct when superimposed on the existing box data.
In short, the more AI played a part in the project the more unstable it became. But it seems the same accusations could be lodged against myself (is it AI=chaos, Evan=chaos, or Evan + AI = chaos?). Version 1 worked. Version 2, with its 42 additional states, was slow. Version 2, with 42 additional states AND Smack’s golang updates AND my relative coloring updates, was also slow. But the county coloring? I don’t know, and we would need another viral Reddit post or a chaos monkey to figure out how the website would handle another heavy load with one core and all of the new features.
Upcoming Blog Posts, Maybe One Day
Because no one is following the blog series, and because Smack may still be working on the last features, I plan to push pause on this. Here were the planned continuation blog posts:
*The Significance Of The Data
*Initial Setup
*The Art Of Programming On A Potato
*Relative Coloring
*County Coloring
*The Dangers Of Pairing Artificial Intelligence With Human Stupidity
Closing Thoughts
It could be more exciting, all things considered, if I next tried working on my own project.
At this rate, though, it could be quite a while before I was ready to post about THAT PROJECT, considering how long it took to update an existing one here.
Oh well. Maybe the “tech fluff” and “movies/book reviews” sections will just get lots of padding in the meantime so I can justify the money I spent paying for a Hostinger WordPress setup.
Stay tuned for my in-depth review of the book Disrupted, I guess.