About the New Site
- Publish Date
Welcome to my portfolio that also acts as a miniature blog! This post is intended to help you understand the site's philosophy and functionalities. Details are shown below.
Design Philosophy
This site is imbued with utilitarian designs from the ground up. I've removed many old design choices that would create unnecessary clutters and distractions. Now, albeit the site being more bland, it is far easier to focus on the content rather than the sheer design.
Home
This is the index of my site. You can assess my abilities in academy, as well as checking out my projects. I tried to be as neutral as possible during the curation of my portfolio. Note that the timeline may be slightly inaccurate since it was written in retrospect.
Posts
The post page is the heart of the site. In the column view, rows of purple buttons are present. They are called tags and serve as a decoupled way to categorize posts. These buttons can be turned on and off. When on, they appear to be orange and filter out posts without the specified tags. As for individual posts, some of them have a special purple badge that reads "Pinned." They are pinned onto the top of the page for easy navigation.
When you enter a post, you can view its metadata on the top row and its content below. When you click on headings, the url becomes suffixed by the heading's ID. Sharing this suffixed url makes all the visitors who have clicked on this link automatically scroll to the heading.
Technical Details
Two years ago, I had built a small portfolio in my old account Penquuin, which can still be access on penquuin.github.io. This site was pretty primitive since I was still getting the hang of web development, but it was also during that period I got in contact with Next.js and React.
This site is the old site's successor. Built with the latest Next.js feature (v14) and powered by ContentLayer, Rehype and Remark, the site combines their strong suits into different parts of the site. ContentLayer is used as the extended markdown (mdx) parser, whereas Rehype and Remark are part of the Unified pipeline.
It wouldn't be possible to build this site without all the open source contributors around the world.