Back to Projects
FinishedNext.jsReactTypeScriptTailwind CSSGSAP2026

Fravelz Portfolio (Next.js)

Public portfolio built with Next.js 16 and React 19 to showcase projects, technologies, timeline and certifications. Locale-prefixed routes (es/en/ru/zh), server components by default, certificate PDFs in a modal viewer, light/dark/auto theme via cookie plus localStorage, and a global search modal for projects and static pages.

View DemoView Code

Project Screenshots

Fravelz Portfolio (Next.js) — vista previa

1 / 7

What I learned

  • App Router with `[lang]` and per-page metadata
  • Splitting project data into modules and helpers (`getProjectBySlug`)
  • Theme before first paint: inline script plus cookies synced with `ToggleTheme`
  • Accessible PDF modal and search (roles, Escape, focus basics)

Extra information

  • This portfolio is where I try UX, i18n, and performance tweaks before writing them up.
  • Screenshots are refreshed when the layout or core flows change.

Technical Details

  • •Next.js 16 (App Router), React 19, TypeScript
  • •Tailwind CSS 4 — `rgb(var(--color-*))` tokens in `globals.css`
  • •GSAP for targeted animations (e.g. 404)
  • •i18n: JSON under `public/locals/` plus client hydration (`public/i18n.js`)