Ignitus

next.js
tailwindcss
mdx
portfolio
  • Project for the previous version of this website
  • Built on top of tailwind-nextjs-starter-blog, with some customization
  • Archived in favor of this website (see intro)

About the Project

As some of my projects were well represented only on GitHub (i.e., Quaestio, Twinkles, or my ML projects), I needed a portfolio website. After lots of trying, building, and searching, I came up with Ignitus.

It's a relatively straightforward build as it’s based on the Tailwind Next.js Starter Blog. I added some custom components, changed the color scheme, and added some content. When I did this, my React and Next.js skills were basic, and the new website is more of a testimony to my progress.

Previously, I had a basic HTML and CSS website using Bootstrap and tried something with Nuxt.js, which is nice but not nearly as performant and easy to use as Next.js.

Features

Ignitus provided several key features to showcase my projects and skills effectively:

  • Project Showcase: Displayed my projects with descriptions, images, and links.
  • Responsive Design: Ensured the website looked good on all devices using Tailwind CSS.
  • Customization: Added custom components and personalized the color scheme.
  • Easy Content Management: Used MDX for writing and managing content effortlessly.

Technology

Next JSTailwind CSSJavascript

Next.js offers a superior developer experience and performance, while Tailwind CSS provides amazing utility-first styling. I drew a ton of inspiration from other users of the Tailwind Next.js Starter Blog and research I conducted over time.

Additionally, writing content in MDX is far easier than hardcoding it every time. That’s why I ultimately chose the Tailwind Next.js Starter Blog.

Architecture

The application was designed with simplicity and ease of use in mind:

  • Framework: Built with Next.js for server-side rendering and static site generation.
  • Styling: Used Tailwind CSS for responsive and customizable styling.
  • Scripting: JavaScript powered the dynamic functionalities.
  • Content Management: Employed MDX for managing content efficiently.

Why Ignitr?

My last name is Zündorf, which is a city/village near Cologne. "Zünd" or "zünden" can be translated to "ignite." Combine this with "I like to ignite ideas," and you get Ignitr. Additionally, blue or yellow flames, represented in the gradient accents of this website, symbolize ignition and creativity.