This post was supposed to be a short foreword to another post about software architecture to briefly chronicle my adventures in the world of frontend web development, from the beginning to the present. But alas, I got a little too excited and ended up writing up something a far too long for a foreword and a little too meandering for a proper post.

I started bumbling my way into the world of frontend development during a nail-biting final year project through React. I consequently had PTSD from trying to learn React (pre-hooks!) with Material UI (now MUI) at the same time. Prior to this I was mostly toying with Python UI toolkits and playing around with window managers on Linux.

As I graduated from uni just as the pandemic kicked-off, I tried to roll-my-own barebones duct-taped client side JavaScript mixed with template-based responses via an Express server. This was used for my first crack at a podcast web app. It performed poorly and I genuinely appear to have lost the code/repository of this attempt. Some aspects of the client side JavaScript work made its way on to my personal website.

I then got sucked into the Vue.js ecosystem and coming surprisingly close to completing a second crack at this podcast web app. I started getting responses to job applications close to the ~1 year anniversary (late 2020 to early 2021) of the first COVID case on Australian shores, so this project was abandoned. I also re-implemented my personal website using Vue.js.

I jumped back into the world of React for my first full-stack client (work) project in early 2021. It was initially built using class-based components, but once I understood how React Hooks worked, I hastily refactored the entire frontend to use functional components. We were supposedly following the Agile methodology, but being fresh out of uni it still didn't click that working on a card/issue absolutely should not involve refactoring half the project all the time. Apologies and thanks to Chris for having the patience to review my absolutely horrifyingly large pull requests!

My mesmerising UI work and my colleagues' brilliant backend + database design ended up being such a hit that this project ended up getting extended and its scope expanded. After I left this team, they rewrote everything in TypeScript (it was originally all in JavaScript; I would only be introduced to TypeScript in my next work project) whilst retaining my CSS styling.

Shifting to more backend-heavy work did not satisfy my frontend itch after the success of my previous work project, so I turned to making my personal website something of a playground. I replaced my Vue.js based personal site with a new React site and imbued it with the many learnings from mistakes made in my last work project. I eventually rolled out a UI library called Brioche, but abandoned it around the time I discovered Svelte and SvelteKit. I then rewrote my site again with SvelteKit.

I started getting interested in server-side rendering (SSR) as I learned more and more about using SvelteKit. However, a series of breaking changes in preparation for SvelteKit's 1.0 release and sheer laziness made me return to re-implementing my site with React. A failed attempt to make my site SSR using a Vite plugin led me to finally give Next.js a shot. The current version of my site (at the time of publishing) was written using Next.js.

What comes next in my frontend adventures is still somewhat in the air. I've been looking into module federation recently (this was going to be a part of the original post I was going to write) for my own rather-large personal project. I've pulled off another Brioche, in that I extracted the components from my personal website and turned them into a new component library. However this time I don't plan on turning this into a Brioche v0.2.

Til next time.

EDIT (06/01/2023): I've since extended my personal site to include a CMS to update and/or publish new posts. This update was written in it!

EDIT (17/03/2023): I decided to start scaling back the CMS features for my site. It won't go to waste as I'm migrating the CMS to another side project. I'll be reverting to statically-generated content for now.