Rewriting my website from scratch

by Mathew Dony

91

The previous version of my portfolio website was built in 2022, so it was long overdue for a refresh. I also wanted a proper blog space to share my thoughts and experiences from my engineering career. I recently got a Cursor Pro subscription, so this felt like a great project to try it out on.

The Stack#

  • Next.js: I moved from the old Next.js 12 pages router to Next.js 16 with the app router which has cool new features like Server Components and Turbopack.
  • CSS: I used to love styled-components since it allowed me to write raw CSS. But with the project entering maintenance mode after the React 19 Context API deprecation, I had to switch to tailwindcss. I was skeptical at first because I thought memorizing all the utility classes would be annoying. Turns out I was completely wrong - Tailwind made styling faster, simpler and way more enjoyable. No more coming up with silly tag names like <StyledButtonWithRadius /> and passing props into it.
  • Blog: I went with MDX which lets me mix Markdown and JSX. This way I can embed code snippets or interactive components whenever I need to like this:
// Example: Simple user authentication
public class AuthService {
    public boolean authenticate(String username, String password) {
        User user = userRepository.findByUsername(username);
        if (user == null) {
            throw new UserNotFoundException("User not found");
        }
        return passwordEncoder.matches(password, user.getPasswordHash());
    }
}
  • Tracking post likes: This was the hardest part to implement! If you look at the HTML payload for this blog page, you can see that the like count is part of the HTML because it's pre-rendered on the server during build time. I used Redis to store the like counts along with optimistic updates with batching - when you click the like button multiple times quickly, it waits 1s before sending all those likes to the server in a single request. The pages use Incremental Static Regeneration with revalidation intervals, so the like counts stay relatively fresh while still being statically generated at build time.

Stay tuned for more posts soon!


Thanks for making it to the end!