For many years I've always kept my personal branding to just an avatar to myself, however it never stood out as being professional, and made harder to incorporate online. It meant that:
- I couldn't scale it up or down (pixelation)
- It didn't look professional
- It looked off when placed on my projects
Branding
When it comes to my online presence, I am extremely fussy with designs, logos etc, and so I knew from the start it needed to be done by someone with previous experience in professional-grade branding. I didn't want random shapes beside my name, or anything that would have no association at a glance.
I had used IndieBrands countless times previously, I knew what to expect having used them for my business (Octanna). After reaching out to one of the Co-founders (David), I shared my vision of what I wanted, how I wanted it and within days he came back with a mockup. It was spot on to what I was looking for, and I knew I wanted to go ahead with the final version.
Come to just under a week later, and I was honestly blown away by the result, it's clean, easy to understand and I can utilise it everywhere without any issues. I'd highly recommend them if you ever need any form of branding, I'm very pleased with the end result.
Website
My previous redesign only happened in November 2020, yet looking back, it was clunky, hard to use and too overwhelming at a glance, often meant people wouldn't stay long.
The aim with my new website was to make it easy to know:
- What I do
- My projects
- My portfolio
- My skillset
- How to contact me
Moving to Next.js
After being a long-time vue.js fan, having built dashboards and landing pages prior using it, I always loved the appeal of React.js especially paired with Vercel. After diving into it for my project Analyse, I realised how fast and snappy it paired up, yet it wasn't too hard for a beginner to get started with. Having had plenty of experience with site optimisation and SEO, I knew having a fast site was needed, and I needed this out the box with little to no configuration.
Since deploying Analyse with Next.js, I knew that moving forward my vision was to move my other landing pages to it too. My next being my personal site (what you're on now!). I also struggled with the lack of syntax highlighting that my current blog CMS at the time (Ghost) had, and knew for dev-focused blogs this wouldn't be a great experience.
Tech stack
As a developer who happens to read this, often the question we ask is, So, what stack are you using?!, and so here it is:
- Next.js
- React.js
- Tailwind CSS
- Headless UI
- MDX (For markdown)
- Prism (Syntax highlighting)
New blog system
After having used the Ghost CMS for a long time, I started to get frustrated with the lack of syntax highlighting, which made it frustrating and difficult to share code snippets to help others. I had heard about MDX, and how it could be paired with Prism for a complete syntax highlight solution.
The end result is fantastic, much easier to read and understand, and all managed by me rather than separate solutions, I'm now able to remove another droplet as Vercel manages this together.
Thats all!
Thanks for spending the time reading, feel free to reach out @heychazza on Twitter.