Mrugesh Portfolio
This website — a fast, accessible developer portfolio built with Next.js.
Overview
My personal developer portfolio. It presents my skills, experience and projects to hiring teams and prospective freelance clients, and doubles as a reference for how I structure a modern Next.js codebase.
Problem & solution
The problem
Recruiters and clients need to understand quickly what I build and how I work. Generic templates are hard to maintain, often heavy, and tend to hide the actual work.
The solution
A statically rendered Next.js site with all content in typed modules. Pages are server components by default; only the theme toggle, mobile navigation and project filters ship client-side JavaScript.
Key features
- Light and dark themes that respect the system preference and remember a manual choice
- Filterable project gallery with typed, data-driven detail pages
- Original SVG project illustrations — no external image dependencies
- Per-page metadata, Open Graph image, sitemap and robots rules
- Keyboard-accessible navigation with visible focus states and reduced-motion support
Architecture & implementation
- Next.js App Router with Cache Components; every route is prerendered at build time.
- Content (profile, skills, experience, projects) lives in typed modules under src/content and src/lib.
- Server components render the cards and illustrations; the client-side filter only toggles which pre-rendered cards are visible.
- Design tokens are CSS custom properties exposed to Tailwind, so both themes share one set of components.