Portfolio Website

Live2024

A minimal, fast personal website built with Next.js and Tailwind CSS. Features dark mode, responsive design, and markdown-based blog posts.

Next.jsTypeScriptTailwind CSSMarkdown

Overview

This portfolio website serves as my personal corner of the internet - a place to share thoughts, showcase projects, and connect with others in the tech community.

Technical Architecture

Built with modern web technologies focusing on performance, accessibility, and developer experience:

  • Next.js 15 with App Router for server-side rendering and static generation
  • TypeScript for type safety and better development experience
  • Tailwind CSS for utility-first styling and consistent design
  • Next Themes for seamless dark/light mode switching
  • Gray Matter and Remark for markdown processing

Design Philosophy

The design embraces minimalism - clean typography, generous whitespace, and subtle interactions. The focus is on content readability and fast loading times.

Key Features

  • Responsive Design: Works beautifully on all device sizes
  • Dark Mode: Automatic theme switching with user preference persistence
  • Markdown Blog: Write posts in markdown with frontmatter metadata
  • SEO Optimized: Proper meta tags, semantic HTML, and static generation
  • Performance First: Optimized images, minimal JavaScript, fast loading

Development Experience

The site is designed for easy content management:

# Add a new blog post
npm run new-post "My New Post Title"

# Development server
npm run dev

# Production build
npm run build

Blog posts are written in markdown with frontmatter for metadata, making it easy to add new content without touching code.

Deployment

Deployed on Vercel with automatic deployments from the main branch. The combination of Next.js static generation and Vercel's edge network ensures fast loading times globally.