This site has gone through quite the transformation over the years. It started with flash and actionscript, moved on to vanilla HTML, CSS, and JavaScript, then React, Typescript, and now Next.js. Each iteration was about practicing and demonstrating my skills to future employers. However, as I venture into self-employment, my focus has shifted away from proving myself and more towards practical benefits.

Why I Chose Next.js

You can check out all the advantages of Next.js directly on their website. Here, I'll share the top reasons I've found for using it on this site.

Static-Site Generation

To be honest, this was the main reason I started exploring Next.js. The other benefits I found while going through their fantastic Next.js Blog Tutorial.

Static websites tend to perform better in terms of SEO since search crawlers can easily navigate them. Given the shift from my portfolio site just being an extension of my resume to a potential gateway to my new business, improving SEO is crucial.

Page loading, caching, and usability without relying on client-side JavaScript are all enhanced with static pages. Next.js makes it simple to specify which pages should be generated on the server during build-time, which means less JavaScript running on your user's browser and faster, globally cached sites.

File-System Routing

Next.js comes with file-system routing right out of the box. No need to define routes – just add JavaScript files under the top-level /pages/ directory. It's like a return to the simplicity of the past, and I'm loving it. No more wrestling with react-router for every route.

Built-In Image Optimization

With Next.js's Image component, image optimization is a breeze. You don't have to worry about generating different sizes for various screen resolutions – it does it automatically. That's a game-changer.

How I Got Started

I already had a good amount of experience with JavaScript and React, so I jumped right into their tutorial, Create a Next.js App. Since I have a basic portfolio site, my goal was to revamp it with Next.js, introduce a blog section, and set the stage for my new business site.

After the first five lessons, I feel like I have a solid understanding of the structure, and I'm ready to start customizing.