Building a Portfolio with Next.js 16, Drizzle ORM, and TanStack

When I decided to rebuild my portfolio, I wanted to use the latest and most relevant stack — not just for the end result, but as a learning experience.

The stack I chose: Next.js 16 with App Router, TypeScript, Tailwind CSS v4, Drizzle ORM connected to Neon Postgres, TanStack Query for server state, TanStack Form for forms, and NextAuth v5 for the admin panel.

Why Next.js 16?

Next.js 16 brings significant changes. The most notable is the replacement of middleware.ts with proxy.ts, which now runs on Node.js runtime instead of Edge. This makes it far more capable — you can call databases, use full Node.js APIs, and handle authentication properly.

Turbopack is now the default bundler, and the difference in dev server speed is immediately noticeable. Cold starts that used to take seconds now feel almost instant.

Why Drizzle ORM?

I had used Prisma extensively before, but Drizzle offers something different: it feels closer to SQL. You write queries that actually look like SQL, which means fewer surprises and better mental clarity about what's happening at the database level.

Combined with Neon's serverless Postgres, the setup is remarkably lean. No connection pooling to manage, no persistent connections to worry about — just fetch-based queries that work perfectly in serverless environments.

Why TanStack?

TanStack Query handles all server state in the admin panel. Every mutation — create, update, delete — automatically invalidates the relevant cache and refetches fresh data. No manual state management required.

TanStack Table powers all the admin data tables with built-in sorting and filtering. TanStack Form handles form state with proper validation via Zod.

The result is a codebase where each library has a clear, focused responsibility.

Multilingual Support

Supporting both English and Indonesian from day one required careful planning. I chose next-intl for routing and UI strings, while database content uses a simple JSON field pattern: { en: "...", id: "..." } . One schema, two languages, no duplication.

What I Learned

Building this portfolio taught me that the best stack is one where every piece earns its place. Not every project needs TanStack Virtual or a full i18n setup — but for a portfolio that I intend to maintain and grow over time, these tools pay dividends.