Patterson logo
Sexy screen shot of code
Sexy screen shot of code

My Portfolio

The Client:Darryl Patterson
The Role:Everything
The When:2021

The Overview

I've always built & hosted my portfolio on 3rd party CMS systems. I figured it was time to build my own from the ground up, so I did. I needed to demonstrate the depth & breadth of my experience by featuring some of my best work and skillset.

The Links

My Portfolio
GitHub
The Code

TL;DR

Design

I whipped up some simple wireframes in Figma to help decide on the pages I needed and what content I should include. I'm using UI ideas from TailwindUI and based the colours on my little logo. Can you guess what animal is in that logo? It's related to the Scottish Patterson family coat of arms.

Tech Stack

The best way for me to learn new things is to pick a project to use as a learning opportunity. I wanted to see what TailwindCSS was like and I was looking at a new front-end framework I could explore. I've built projects in both React and Angular in the past, and I stumbled upon NextJS which extends React and makes it a little quicker to build stuff and it integrates easily with Tailwind. This portfolio site is pretty simple, so I also when with Vercel to host it. I like how Vercel hooks into your GitHub repo and performs a build & publish everytime code is committed to the main branch - that's pretty cool easy CI right there. Although this portfolio is a pretty basic, I'm using JSON files for the data (portfolio, the list, the person) and React components where it makes sense. The code is up on GitHub so feel free to take a peek.