24 March 2024

My take on web development in 2024: free, online, and "simple"

After having experimented for almost three decades with web development, I had a few requirements when it came to creating my personal website – or pretty much any website that I launch these days. Worth noting that I'm not an advanced software developer, even if I have some background in computer science.

At first, it wasn't a simple shift: I had taught myself the PHP/MySQL combination and thought I would always stick to it. But of course HTML5 came around the year 2008, with more and more JavaScript frameworks to follow. So I adapted, initially reluctantly because change is always hard. On one hand, all programming languages are very similar; on the other hand, it felt like having to start from scratch to recreate an output I was already capable of building. I therefore looked to frameworks that had proven themselves and were simple enough that, if discontinued, I would be able to easily switch to another.

Likewise, I had been sorely disappointed when Google+ shut down. I had created a lot of original content pieces on the platform and they would eventually all disappear (I had enough time to backup everything but it was painful to lose the 1 million followers that I had garnered). That day of 2019, I promised myself to always be in "control" of my content so that porting it over to any platform would be straightforward.

One more requirement I had for my ultimate web development solution was that it had to be free – or as cheap as possible. I like tech that just works – even better when it's free, especially for hobby projects; I don't mind paying if and when what I build is getting so much traffic that hosting costs become an afterthought.

So here's my latest setup, that costs nothing apart from the inevitable domain name (about $12 per year) – it may sound complicated because of the number of pieces involved but it can be simplified if necessary and, more importantly, it's replicable by anyone with some basic level of programming knowledge:

– For hosting the site itself, I use the no-cost Firebase Spark plan, plenty enough for my needs.

– For hosting the code when I'm working on it, GitHub is the obvious solution. Free as well, including for private repositories.

– For coding, Google IDX is ideal: from it, I pull my code from GitHub  (and push any updated code) and deploy the latest version to Firebase so all changes are live on my website. All in the browser, all online, all free. I no longer have to worry about where my files are (although I could have done this before with GitHub and Visual Studio Code) and no longer have to worry about having an IDE to install (since IDX is all online).

– For the domain registration, Google Domains was a breeze... but they sold themselves to Squarespace which has bells and whistles I don't need, so I'll likely shift to Dynadot.

– In terms of JavaScript frameworks, I rely on Bootstrap and a little bit on Vue.js (for "live" pages which are reading off the JSON feed of a Google spreadsheet, itself fed via a Google form for me to easily submit content).

– For content creation (everything that's not one-off website pages like the home page, the contact page, etc.), I write all my articles in Google Docs and index all of them into a spreadsheet, from which an Apps Script program I developed generates HTML files (saved in Google Drive) with the proper structure (and the Bootstrap framework). I just need to upload those new HTML files into GitHub (and pull and deploy from IDX)) when I want to update my website.

– For media content, I use Google Photos and YouTube. I'm a little bit worried that the links to photos on Google Photos might break one day, but that's why I regularly run a script with the wget function to scrape my own website and backup all the photos in case I need to use them directly one day (by replacing all the links to Google Photos with links to those photos saved within the website structure).