travis.engineering

Skip to main content
Back to projects

travis.engineering

03/2024
Next.js
React
TypeScript
TailwindCSS
MDX
Vercel
Static Site Generation (SSG)

Introduction

This site (travis.engineering, aka TOP Blog) is developed with Next.js 14 (TypeScript), and styled with Tailwind. It is my personal blog as well as a portfolio to provide links and insights to some of the projects I have personally created.

I have made attempts to create my own portfolio previously such as "About me " and they mostly remain a single-paged static site. Since they are written in older technologies, in JavaScript (instead of TypeScript) and not being aligned with the current approach I use to create web applications, I decided to create yet another one from scratch with a blog included as a platform the express my opinions, demonstrating my thinking process and personal achievements.

Initially there's a custom-made content management system (CMS) built into this site (details are found in this blog post) with plans to add authentication, server-side rendering, fine-grained access control to blog posts, short links and even a Resume generator. However as I began my job search in April 2024 it became clear to me that having this site available online as soon as possible is much more important than developing these extra features, which will most likely be overlooked with minimal benefits, that I eventually decided to write blog posts as Markdown that is stored together with the source code and scrapped the entire CMS system and all non-essential features related to the blog. The resume generator and any CV-related logic are isolated to a project that I named top-cv and it will appear in the list of projects here once it is production-ready.

Techniques

The project makes use of Next.js's ability to detect and render pages during the build time, known as Static Site Generation to allow a better performance and create positive impact of Search Engine Optimization (SEO). I have also put some efforts in tailor-making metadata for each of the blog, so that it has a more comprehensible and appealing appearance when they are being shared on social media.

Unlike previous portfolios I have created, I also put effort in improving the blog' readability under page readers and scores evaluated by Lighthouse.

To ensure the feasibility of adding custom components in the blog posts, I chose to use MDX Remote to render the articles so I can embed React components in them.

This work is prefixed with TOP as it's part of Travis' Over-engineered Projects.