When thinking about what to use in developing my personal website, my initial thought was Kirby CMS, since it has been my go-to for developing websites up until now. I had built Tim Evans Photography and Memorializing Violence with it and am intimately familiar with its ins and outs. Also, I love the flexibility that Kirby offers for customization. It’s a dream to build with.
However, I’ve recently found myself building more with the React framework NextJS and have fallen in love with the component-structured approach that it offers, as well as the ability to use JavaScript for both frontend and backend needs. Since NextJS has been such a pleasure to build with, I chose it for my personal website.
Unlike Kirby, however, NextJS doesn’t offer a batteries included, CMS-out-of-the-box experience, and I therefore landed on the following tech stack to piece together the different elements of my site.
Tech Stack
- Nextjs - Framework
- Sanity - Content Management (CMS)
- Framer Motion- Animations
- Tailwind CSS - Styling
- Vercel - Hosting
- Fathom Analytics - Privacy focused analytics
Choosing the combination of the above tools and libraries has enabled me to build this site in short order and to add new features quickly, as needed. It has also become my go-to stack for new projects.
Current Features
I have thus far added the following sections to the website:
- Projects - Freelance and personal projects I have worked on
- Blog- Space to share ideas, learnings and experiments
- Uses - A list of software and products I use on a daily basis
- Inspiration - A curated collection of websites that inspire me
- Light & Dark mode
- Fully responsive layout that looks great on all screen sizes
- Accessible components thanks to HeadlessUI
Future Features
Moving forward, I aim to add the following sections and features:
- Snippets - A list of code snippets that I tend to reuse across projects
- Command Palette - Ability to navigate my site and its stored information via an accessible central search
- Live Code Examples - Leverage Sandpack to include interactive live code examples for blog posts or snippets
This tech stack has been a dream to work with and I look forward to using it to expand and improve my site!