www.cibulka.codes

The "app router" opens Next.js to React server components. It packs very powerful features focused on performance and security, but had some learning curve and also was relatively unstable for some time.

The update allows me to handle a lot of things server-side (image generation, fetching and prefetching data, localization), making things faster and more secure. Like in good old PHP days. 🐘

Certain aspects of the sollution still leaves me somewhat frustrated (the lack of in-built internalization sollution, for instance), but ultimately I'm happy for the switch.

A point of frustration with Next.js app router. The pages router had an in-built solution for providing multiple language versions of your site - it worked out of the box and very well.

Next.js 13, however, listed i18n as a "not planned feature". This prompted the community to find its own sollutions, leading to further instability and breaking updates.

After some months the team finally shared a guide on how you can implement i18n on your own, also community created a useful router plugin next-i18n-router.

I love Markdown and I am obssesed with MDX! Here's my reasoning:

1. Even the raw format of your content is easily readable for both humans and machines.
2. Each piece of the content can be literally a file in a folder. You can query them through filesystem, which is usually quite simple and always very fast.
3. MDX combines interactive JSX components with standard Markdown. This allows you to create a sort of an API for a content manager - giving them enough flexibility to use the tools you've prepared for them while limiting the complexity.
4. Due to the simplicity of the format, it is incredibly easy to convert it to anything else you need.
5. Let's cut out the middleman! There is no need for CMS with this sollution.

A brilliant library Contentlayer turns the MDX files to JSON files during the build step (and creates their TypeScript definitions right away). This works especially well with Next.js 13 and server components, which allows you to leave most of the bulk on the server (and send to the client only the actual content).

Creating and maintaining one's CV can be a bit of pain. Duplication is one of the issues: Is your PDF portfolio in sync with your web CV? In all the language versions?

For this reason I've created an automated page generating my CV in print-friendly format. The content comes from MDX files, that are shared between the website, public API and the CV.

The PDF version of the CV is automated by a Puppetteer-powered script. For now I run it manually through NPM script - and whenever I finally learn the GIT actions, this will probably be automated as well. 💪

Nothing special here, just wanted to have a bit more control on how the video is handled (and frankly it was just fun). There are however still some things to polish (allowing the user to change the time, for instance).

My portfolio also contains my shot at Tetris game. Give it a try, even if it's a bit addictive! 🍭 Or check the repo of the project.