Intro

website
portfolio
typescript
next.js
tailwindcss
contentlayer
  • This website, the latest evolution of my personal website
  • Built from the ground up using Next.js, Tailwind CSS, and Contentlayer
  • Utilizes Shadcn/ui for the UI components and is heavily inspired by various other websites

About the Project

Intro is the final evolution of my personal website. It merges the best parts of my previous website and a personal website I had built using Bento. While still heavily inspired by that design, I've added my own twist to it. It's intended to be the one-stop destination for all important information about me and my projects.

The design language is heavily inspired by Shadcn/ui, which is used throughout the website. It also takes inspiration from Chronark and other sources.

At the beginning of this project, my React/Next.js, TypeScript, and Tailwind CSS skills were pretty rusty and limited. Building this site allowed me to improve my frontend development skills.

Features

The Intro website offers several key features to effectively showcase my projects and skills:

  • Project Showcase: Displays detailed information about my projects with descriptions, images, and links.
  • Responsive Design: Ensures the website looks great on all devices using Tailwind CSS.
  • Easy Content Management: Uses Contentlayer to serve markdown content for projects, legal information, and more.
  • Custom Components: Includes custom UI components based on Shadcn/ui and Radix primitives.

Technology

Next JSTailwind CSSTypeScript

The website is built with Next.js and uses Contentlayer to serve markdown content. It employs standard technologies like ESLint, Prettier, Husky, and Lint-Staged for code quality and consistency.

Shadcn/ui is used for the UI components, providing code for components based on Radix primitives and using Tailwind CSS. I've also added some of my own custom components.

Future Plans

I have several plans to further enhance the Intro website:

  • Improved Content Management: Integrate a headless CMS instead of solely relying on MDX for content management.
  • Updated Visuals: Refresh the visual design to make the website more modern and appealing.
  • Interactivity: Add interactive elements to improve user engagement and experience.