When I sat down to rebuild my personal portfolio, I had a few non-negotiables:
- It needed to feel fast and lightweight.
- It needed to actually tell my story as a full-stack engineer, not just list buzzwords.
- It needed to work beautifully on mobile.
- And selfishly, I wanted it to be fun to build.
This post walks through what I built into the new site—from the hero and skills section to mobile navigation—and why I’m excited about the stack I use daily and the Warp environment that helped me move fast.
The Hero: A Clear First Impression
The hero is the first thing people see, so I kept it clean and direct:
- A circular avatar image
- A concise headline: Full Stack Developer — Next.js, Node, PostgreSQL
- A short explanation of what I actually do
- Two obvious CTAs: View Projects and View Resume
This section sets the tone for the entire site: modern, focused, and intentional.
Technical Skills Without the Buzzword Wall
I didn’t want a static wall of logos or a boring bullet list. Instead, I designed the skills section to feel interactive and readable:
- Each skill is presented as a compact card
- Icons and labels are immediately recognizable
- Hover states reveal additional context
The goal was simple: make it obvious what I actually work with, without overwhelming the reader.
Mobile-First by Default
Everything on the site was designed mobile-first:
- Navigation adapts cleanly to small screens
- Typography remains readable without zooming
- Tap targets are comfortable and intentional
Instead of shrinking a desktop layout down, the site grows naturally as the screen gets larger.
Why These Frameworks Are Front and Center
The technologies highlighted on the site aren’t decorative—they reflect how I build real applications.
Next.js and React
Next.js gives me hybrid rendering, routing, and API routes. React provides a mature ecosystem and component model that scales well for real products.
Node.js, Express, and PostgreSQL
On the backend, I lean on Node.js and Express for APIs, with PostgreSQL for reliable, relational data. Prisma adds type safety and a clean developer experience.
TypeScript, REST, and GraphQL
TypeScript reduces surprises, REST keeps integrations simple, and GraphQL shines when frontends need flexibility.
Why Warp Was a Huge Win
This portfolio was built in an environment powered by Warp, and it made a real difference.
- Faster iteration on theme files
- Safer refactors while adjusting layout and styles
- More time spent on polish instead of tooling friction
Warp helped me move quickly without sacrificing attention to detail.
Wrapping Up
This rebuild started as “I need a portfolio refresh” and turned into a focused showcase of how I think about:
- UX and motion
- Responsive design
- Real-world full stack architecture
This is the level of care and execution I aim to bring to client and product work: thoughtful, fast, and built to last.
Blog
-
Building My New Portfolio: Design Decisions, Tech Choices, and Why I’m Excited About My Stack (and Warp)
When I sat down to rebuild my personal portfolio, I had a few non-negotiables: This post walks through what I built into the new site—from the hero and…
Building My New Portfolio: Design Decisions, Tech Choices, and Why I’m Excited About My Stack (and Warp)
When I sat down to rebuild my personal portfolio, I had a few non-negotiables:
- It needed to feel fast and lightweight.
- It needed to actually tell my story as a full-stack engineer, not just list buzzwords.
- It needed to work beautifully on mobile.
- And selfishly, I wanted it to be fun to build.
This post walks through what I built into the new site—from the hero and skills section to mobile navigation—and why I’m excited about the stack I use daily and the Warp environment that helped me move fast.
The Hero: A Clear First Impression
The hero is the first thing people see, so I kept it clean and direct:
- A circular avatar image
- A concise headline: Full Stack Developer — Next.js, Node, PostgreSQL
- A short explanation of what I actually do
- Two obvious CTAs: View Projects and View Resume
This section sets the tone for the entire site: modern, focused, and intentional.
Technical Skills Without the Buzzword Wall
I didn’t want a static wall of logos or a boring bullet list. Instead, I designed the skills section to feel interactive and readable:
- Each skill is presented as a compact card
- Icons and labels are immediately recognizable
- Hover states reveal additional context
The goal was simple: make it obvious what I actually work with, without overwhelming the reader.
Mobile-First by Default
Everything on the site was designed mobile-first:
- Navigation adapts cleanly to small screens
- Typography remains readable without zooming
- Tap targets are comfortable and intentional
Instead of shrinking a desktop layout down, the site grows naturally as the screen gets larger.
Why These Frameworks Are Front and Center
The technologies highlighted on the site aren’t decorative—they reflect how I build real applications.
Next.js and React
Next.js gives me hybrid rendering, routing, and API routes. React provides a mature ecosystem and component model that scales well for real products.
Node.js, Express, and PostgreSQL
On the backend, I lean on Node.js and Express for APIs, with PostgreSQL for reliable, relational data. Prisma adds type safety and a clean developer experience.
TypeScript, REST, and GraphQL
TypeScript reduces surprises, REST keeps integrations simple, and GraphQL shines when frontends need flexibility.
Why Warp Was a Huge Win
This portfolio was built in an environment powered by Warp, and it made a real difference.
- Faster iteration on theme files
- Safer refactors while adjusting layout and styles
- More time spent on polish instead of tooling friction
Warp helped me move quickly without sacrificing attention to detail.
Wrapping Up
This rebuild started as “I need a portfolio refresh” and turned into a focused showcase of how I think about:
- UX and motion
- Responsive design
- Real-world full stack architecture
This is the level of care and execution I aim to bring to client and product work: thoughtful, fast, and built to last.
-
Building My New Portfolio: Design Decisions, Tech Choices, and Why I’m Excited About My Stack (and Warp)
Building My New Portfolio: Design Decisions, Tech Choices, and Why I’m Excited About My Stack (and Warp)
When I sat down to rebuild my personal portfolio, I had a few non-negotiables:
- It needed to feel fast and lightweight.
- It needed to actually tell my story as a full-stack engineer, not just list buzzwords.
- It needed to work beautifully on mobile.
- And selfishly, I wanted it to be fun to build.
This post walks through what I built into the new site—from the hero and skills section to mobile navigation—and why I’m excited about the stack I use daily and the Warp environment that helped me move fast.
The Hero: A Clear First Impression
Clean, centered hero with avatar, headline, and clear calls to action. The hero is the first thing people see, so I kept it clean and direct:
- A circular avatar image
- A concise headline: Full Stack Developer — Next.js, Node, PostgreSQL
- A short explanation of what I actually do
- Two obvious CTAs: View Projects and View Resume
This section sets the tone for the entire site: modern, focused, and intentional.
Technical Skills Without the Buzzword Wall
Interactive technical skills section designed for clarity and scannability. I didn’t want a static wall of logos or a boring bullet list. Instead, I designed the skills section to feel interactive and readable:
- Each skill is presented as a compact card
- Icons and labels are immediately recognizable
- Hover states reveal additional context
The goal was simple: make it obvious what I actually work with, without overwhelming the reader.
Mobile-First by Default
Everything on the site was designed mobile-first:
- Navigation adapts cleanly to small screens
- Typography remains readable without zooming
- Tap targets are comfortable and intentional
Instead of shrinking a desktop layout down, the site grows naturally as the screen gets larger.
Why These Frameworks Are Front and Center
The technologies highlighted on the site aren’t decorative—they reflect how I build real applications.
Next.js and React
Next.js gives me hybrid rendering, routing, and API routes. React provides a mature ecosystem and component model that scales well for real products.
Node.js, Express, and PostgreSQL
On the backend, I lean on Node.js and Express for APIs, with PostgreSQL for reliable, relational data. Prisma adds type safety and a clean developer experience.
TypeScript, REST, and GraphQL
TypeScript reduces surprises, REST keeps integrations simple, and GraphQL shines when frontends need flexibility.
Why Warp Was a Huge Win
This portfolio was built in an environment powered by Warp, and it made a real difference.
- Faster iteration on theme files
- Safer refactors while adjusting layout and styles
- More time spent on polish instead of tooling friction
Warp helped me move quickly without sacrificing attention to detail.
Wrapping Up
This rebuild started as “I need a portfolio refresh” and turned into a focused showcase of how I think about:
- UX and motion
- Responsive design
- Real-world full stack architecture
This is the level of care and execution I aim to bring to client and product work: thoughtful, fast, and built to last.