New Website built with Nextjs 14!

Calin Doran / November 26, 2023

Hi!

I've decided to refactor my site using the latest version of Next.js 14 this weekend, and it's pretty cool!

⚠️

Disclaimer: My site is more of a learning tool. I like to change it up tech-wise and try new patterns when something interests me.

So if there are any issues with the site, please let me know as I'm still working on it and will continue to do so over the next few weeks.

Content Management

I've moved my content from HTML to vanilla Markdown, to MDX, to a CMS, like so many other developers and back over the years. But, my content requirements are now pretty simple, so I've decided to go back to Markdown:

  1. Written in Markdown¹
  2. Managed through version control²
  3. Minimal dependencies

My idea was to simplify without giving up too many features.

Retrieving Content

I'm using next-mdx-remote to retrieve my content from the file system and render it as React components. This allows me to use the full power of React and MDX while still keeping my content in Markdown.

Thanks to the new generateStaticParams function in Next.js, I can now retrieve my content at build time and generate static pages for each post. This means that I can use the same content in my development environment and in production.

export async function generateStaticParams() {
  let data = await getPosts().then((res) => res)
  return data.map((post) => ({
    slug: post.slug,
  }))
}

Performance

Earlier this year, I moved this site to the Next.js App Router. That came with a few subtle but important change: React Server Components by default. However, I've decided to move back to the Next.js Static Optimizations for now, as I'm not using any React Server Components at the moment due to my site being hosted on GitHub pages - more on that in another post.

Thoughts

  • Prefer let over const: It's fewer characters to write. Also, this isn't a production codebase here or anything. Nice post here on this topic.
  • Prefer consolodating most things in app/: Because, why not? Now that it's possible with the App Router I'm probably overusing this, but it feels nice.

Conclusion

Putting the work into this site has been a great learning experience and I'm looking forward to sharing more of my work with you all. Adding Google Analytics should hopefully allow me to better understand navigation and user flow on my site, which is pretty cool too! A busy life with work, friends, and family has most certainly dragged out this update, but I hope it will allow me to improve functionality in the future in a more consistant way.

So, if your looking for more information or need to contact me, you can hit me up via email calindoran@gmail.com.

Thanks for checking out this post! And I'll be sure to keep the updates rolling. ✌️

Cheers, Calin