Dn_Jsh
Back to blog

Hello World: Building My New Portfolio

Welcome to my digital garden.

I built this portfolio to load quickly, feel lively, and stay easy to update. Here is the stack behind it:

Tech stack

  • Next.js 16 with the App Router for routing and page rendering

  • React 19 and TypeScript for reusable, typed UI

  • Tailwind CSS v4 for responsive styling

  • Supabase with PostgreSQL for published content, drafts, editor accounts, and image storage

  • Framer Motion for page transitions and interface animations

  • Three.js for the interactive rotating gear models

  • MDX with next-mdx-remote for file-based posts, plus TipTap for rich-text editing in the portfolio CMS

  • Lucide React for interface icons

Why this stack?

The Next.js App Router gives the site a clear structure for its pages and layouts, while React and TypeScript make the interactive parts easier to build and maintain. Tailwind keeps the styling close to the components, and Supabase lets me edit published content without hardcoding every change. Three.js adds a hands-on 3D view for my gear.

MDX keeps this post versioned alongside the code, while the portfolio editor uses TipTap so I can update content in the browser. Thanks for stopping by!