OZ
Back to Portfolio
01 / Personal

oz-dev.tech

A hand-crafted portfolio and CV site built with Next.js 16, React 19, and Tailwind CSS v4. Features dark-mode-first design, animated orbital graphics, server-rendered contact form, and Lighthouse scores above 95.

Next.js 16React 19Tailwind CSS v4shadcn/uiVercelCloudflare
Visit Website
Hero section with animated orbital graphic
Technical stack section with categorized skills
Engineering history timeline
Contact form section

Overview

A portfolio and CV website designed and built entirely from scratch to showcase frontend engineering skills in a real production context. Every detail — from the animated orbital hero graphic to the dark-mode-first theming — was crafted to demonstrate mastery of modern web technologies without relying on templates or page builders.

Goals

  • 01Build a distinctive, non-template portfolio that doubles as a live code sample
  • 02Ship with Next.js 16 App Router and React 19 Server Components from day one
  • 03Achieve Lighthouse scores above 95 across all categories on mobile
  • 04Provide a seamless experience with dark/light theming, responsive layout, and accessible navigation

Tech Stack

  • //Next.js 16 with App Router and Turbopack, Server Components by default and client components only where interactivity is required
  • //Tailwind CSS v4 with CSS-first configuration and CSS variables for instant dark/light theme switching
  • //shadcn/ui for accessible primitives; react-hook-form with Zod v4 for contact form validation
  • //TypeScript strict mode across the codebase; Vercel for edge delivery, serverless API routes, and preview deployments

Results & Outcome

  • //Fully responsive dark-mode-first design with smooth theme transitions
  • //Custom animated orbital graphic, spinning border effects, and section reveal animations
  • //Contact form with server-side validation and email delivery via Resend
  • //Lighthouse performance, accessibility, best practices, and SEO scores consistently above 95