Welcome to my humble abode

Yes, I know. You probably had to travel far and wide and stalk me on a variety of platforms but you ended up here!

If you don't know already, I'm John, a current third-year recent CompSci grad (yay!) from UNSW and a hopeful (but exhausted) software developer. This website serves to be my own little place on the internet to talk about things I find interesting (or to rant about stuff I find less so) so I hope you come along for the ride :).

I've been meaning to create something like this for a very long time now, probably ever since I started studying computer science almost 3 years ago. I've always had been curious about how people and companies can get their own blogs and content up and running and let them be updated live. And so, after a long time of acquiring skills and waiting for enough free time I decided to create it.

This site also serves to be an ongoing project that I randomly will update and build to try out new technologies and hone my skills. Similarly, this post will be updated as more developments occur (maybe even independent posts will be created about the process).

Starting back in the February of 2021 and taking until April to fully complete, the first iteration of my website is a ways away from what it looks like now. Having been the first time touching react, it was really a struggle to get small stuff like this running.

Having not heard of things like Vercel, Gatsby and the like, the scope of the website was quite limited, to say the least. Using Github pages to deploy, written crudely on and off for months, as well encompassing 2 simple pages. It was as far as my newborn skill could take me.

Looking back on this part of the process brings back many memories of struggle and fun. It started the train that will most likely run for the rest of my software career.

A couple of months after the completion, I began to work on the next step. After opening my eyes to the variety of technologies that could be used, I landed on an extraordinary technology called sanity.io. This tech allowed me to take my work to the next level, integrate blogs, generate and scale pages and work much easier with plug and play functionality.

The site was initially made with Gatsby using the provided gatsby starter and was styled with styled-components alongside the provided enormous amount of PostCSS (though very messily).

This stage was also the first time I began using my favourite deployment method Vercel. You can actually visit the very last deployment of this website here, though alot of the functionality won't be working and the content/code won't be up to date. A majority of the infrastructure was built in this stage and inspired a great deal of the structure you see today on the website!

Now after quite a while of developing, I noticed something quite distressing. In the early stages of the website, it was quite easy to push code, build and deploy. But now build times were bloating and the codebase was chugging to rebuild every time I added more content. I was already feeling the limits of gatsby when it came to scaling and handling multiple functions/pages.

This was when I made the switch to Nextjs.

After 3 days of pain and struggle and I coded using this template as the scaffolding (to reduce the development time), the exact (practically) page was reproduced in the new framework. This involved rebuilding from scratch, many of the components that were existing and implementing many improvements to the existing structure of the code.

You can see the very first conversion here! No, this is not the same deployment as the previous gatsby one. Look very closely and you'll see that it's in fact very different.

After experiencing the limitations of Gatsby I breathed a fresh breath of air when I felt the development in Nextjs. These two main feelings were;

• Increased Versatility. I wanted to expand my website's scope into some things that couldn't be achieved by SSG alone
• Fast Build times. It took 5 minutes (what!) to build the Gatsby website whenever I wanted to change little things when deploying with Vercel or Netlify. Now when built with Nextjs, builds are around 450% faster when building without build-cache/incremental builds!)

The site is now styled with styled-components alone with the content being managed via Sanity and their GraphQL based system. I finally settled on my stack, at least for now.

This was also when I integrated comments, with them being handled separately via Utterances and all comments converging on this public.

Alongside these developments, some features were enabled for the blog that wasn't available from the get-go (from the gatsby template) such as strikethrough, underlining, inline code, code blocks and embedded media (last two below).

const hello = () => {
  console.log("Hello World!");
}

hello();

For quite a while, this was where I was at. I was comfortable and built small features into the page like new blog cards and the like. However, after a while, an itch was starting to buildup.

And now we're here today, trying to build my own unique angle to my brand.

After a deep and discomforting exploration on awwwards, I felt an overwhelming urge to begin challenging my skillset. No longer was I comfortable with how everything just looked. After a while, things started to annoy me, and knowing that I wanted to push my skills to new heights, I began the renewal.

Scooping up the expired domain johndao.com (It was auctioned with a buy now price of 275AUD 😕) and migrating public-facing assets from johndao.dev, I felt that it was no better time than ever to start.

I've begun my journey to realizing a new online identity and to challenge my web dev skills in hopes of elevating them to new heights. Slowly, aspects of the site, big and small, will change, and hopefully, one day, I can turn this website into a portfolio that I'm not just okay with, but one I can be proud of.

And so, this is where we're at now, and most likely where we're going to be for the foreseeable future. I hope you the reader enjoy the ride along and are excited for what's to come (even if it's a little).