Case Study

This portfolio has undergone numerous transformations and is my battleground for testing out new technologies.

The Starting Line

I began coding the prototype for this site with only HTML, CSS, and plain JS. I quickly realized that the bare-metal approach, for me, was too arduous to continue without tearing the rest of my hair out. I heard many good things about React and started playing around with various React frameworks (NextJS, Gatsby) and got a long way towards development zen without investing too much time. Between the richness of the React community and the sheer amount of plug-able components, I was all in on component-driven architecture. However, I had noticed that a large portion of what I was writing was not rooted in basic web-technologies - it was all very React-heavy. Was this future-proof? Is there even such a thing?

I chose to learn React due to the volume of available jobs in my market but had never seriously considered whether alternatives better fit my workflow. Not until Reddit algorithms decided to blast me with word of a reactive framework that compiled optimized JavaScript to the browser instead of an entire runtime; that baked in transitions, and state management, and cleanly compartmentalized HTML, scoped CSS, and vanilla JS without forcing me to constantly reference the appropriate boilerplate for my use case. Enter Svelte.

After completing the tutorial, I proceeded to burn my portfolio to the ground and port each component over to Svelte. The process took my about a day. Within a week I had my first, polished portfolio.

Double Take

Being new to the web development space, I needed some feedback to see if this iteration was as viable as I thought. So I threw my newly mint folio to wolves of Reddit to be murdered but, instead of carnage, I received compassion and beautifully succinct criticism. My first iteration was fun but a performance and accessibility disaster. Another couple weeks of tweaks and boom.. I pushed a streamlined v2.

Third Time's a Charm?

While I was generally happy with how things looked, hard-coding each new project became tedious as any veteran web developer would know without a second thought. I researched CMS options, decided that headless was the way to go, and landed on Sanity. Building out schemas of structured content, incorporating custom React components and JavaScript, styling CSS custom properties, all intuitive. The documentation was top notch and the Slack community welcoming. They even had templates that made lerna implementations make a little bit more sense - although my understanding is still hovering right around zero. Moreover, they had a blog that was powered by Sapper, Svelte's answer to NextJS. Being able to statically generate pages through file-based routing, coupled with all of the goodies in Svelte, inspired me to mature my personal site into something that was a joy to code and maintain.

The migration wasn't all easy though. The particle system that I designed with p5js, and perhaps was too attached to, would not play nice with Sapper. It turned out that third party libraries had to be installed as a dev-dependency in order to be bundled (by rollup, in my case) and, in order to access the window object, I had to load my component asynchronously, which syntactically was very un-Svelte. While this is more widely documented now, I struggled - and whether that was my own lack of experience with frameworks or not is the type of nightmare juice that fuels my impostor syndrome. This is my perpetual state but I was happy with v3 , until I put it in front of developers.

Don't Four-get The Obvious

The purpose of a portfolio, it turns out, is to highlight the projects in it. My landing was full of social media links, as if to say, please go anywhere but here. My projects were neatly wrapped, and tucked away at the back of the fridge in a nav link. Putting all of my effort into development, I balked at the obvious design decisions that make or break that first impression. Lesson learned.

Anyways, this portfolio was/is truly a labor of love, community is life and open-source software will save the world. Cheers!