nextjssupabaseportfolioreacttypescript
Building a Modern Portfolio with Next.js 15 and Supabase
A deep dive into creating a developer portfolio that stands out, featuring dynamic content management, real-time updates, and a sleek terminal-inspired UI.
December 24, 20252 min read

Building a Modern Portfolio with Next.js 15 and Supabase
After years of using template portfolios, I decided to build something that actually represents how I think about software—systems that are both functional and delightful to use.
Why Another Portfolio?
Most developer portfolios fall into two categories:
- Over-engineered - 3D animations, WebGL backgrounds, and 15-second load times
- Under-designed - Plain HTML that looks like it's from 2010
I wanted something in between: fast, functional, and memorable.
The Tech Stack
typescript
const stack = {
framework: "Next.js 15",
database: "Supabase (PostgreSQL)",
styling: "Tailwind CSS",
deployment: "Vercel",
features: [
"App Router",
"Server Components",
"Edge Functions",
"Real-time subscriptions"
]
};Why Next.js 15?
The App Router is finally stable and the DX is incredible:
- Server Components reduce client-side JavaScript
- Streaming makes pages feel instant
- Built-in caching handles most performance concerns
Why Supabase?
I needed a CMS but didn't want to pay for one. Supabase gives me:
- PostgreSQL with Row Level Security
- Real-time subscriptions for live updates
- Storage for images and assets
- Auth that just works
Key Features
1. Terminal-Inspired UI
The command palette (Cmd+K) and terminal (~) aren't just gimmicks—they're faster ways to navigate for developers who live in the terminal.
2. Dynamic Everything
Every piece of content comes from the database:
- Hero text and CTAs
- Navigation items
- Projects and blog posts
- Even the "Now" panel
3. GitHub Integration
The activity log pulls from GitHub's API, showing recent commits alongside blog posts and projects. It's a living portfolio that updates itself.
Performance
| Metric | Score |
|---|---|
| Lighthouse Performance | 98 |
| First Contentful Paint | 0.8s |
| Time to Interactive | 1.2s |
| CLS | 0 |
What I Learned
- Ship early, iterate often - The first version was embarrassingly simple
- Premature optimization is real - I spent 2 days on animations nobody noticed
- Good defaults matter - Most visitors won't customize anything
What's Next?
- Blog search and filtering
- RSS feed
- Dark/light theme toggle
- More interactive demos
The entire source code is available on GitHub. Feel free to fork it and make it your own.