williamarice.com

next.js

react

tailwind

a screenshot of the website

Description

This website is a project! I started the journey of building this website when I wanted to learn Next.js and further enhance my React skills. I've rebuilt the site twice, always striving to follow best practices and chase the latest and greatest releases. I started on Vercel to learn the platform, but now I proudly self-host with Coolify on my own VPS.

Problem

I needed a website to host my project portfolio, have a way for people to contact me, and just have a space where I can quickly throw up a web app that I may need. I also wanted a virtual resume host. I even had a CRUD fuel manager on here at some point to track my fuel usage when I was a police officer.

Solution

I started this project like I do many nowadays. I dove into the Next.js docs and read most of it. I have found that reading the docs just hits differently. I then watched a YouTube video or two to make sure I understood it. Then I just put some time in the saddle and started creating. I made some mistakes along the way, but I have became a better developer because of this website. I wired up a S3 bucket on AWS to hold my project photos.

Story

The website that you see today is version 2.0. I originally built the website with shadcn UI components. Which was cool, but it looked like all other shadcn websites. I needed to rebuild the site with some of my own personal touch. I added more features including some CMS features where I can update my resume on the backend admin dashboard that I built. I can also add, edit, delete, and feature projects from the admin dashboard. I'm pretty proud of that. Who needs WordPress when you can roll your own CMS :). I plan to add more features in the future such as a blog, etc.

Gallery

Gallery image 1
Gallery image 2