Portfolio Vinícius Gabriel

This is my main portfolio, the code is meant to be shared and public.

Deployed with Vercel!

https://viniciuspx.com/

Features

• Single-page layout: Hero, About, Experience (timeline), Selected Projects, Expertise, Contact
• Experience — real work history (role, dates, achievements, tech stack per job)
• Expertise — technologies grouped by area (Backend, Cloud, Data, Frontend, AI Tooling)
• Projects — curated personal projects with live links, plus a compact list of the rest
• Resume — in-site PDF viewer, switchable between PT and EN
• Scrollspy — active section highlighted in the header nav while scrolling
• PT/EN routes (/pt, /en), persisted via localStorage, with hreflang alternates for SEO
• Light/dark theme — follows system preference by default, with a manual toggle that persists via localStorage
• Responsive layout, down to mobile; keyboard-accessible mobile menu (Esc to close, focus management)
• Client-side routing (React Router); legacy routes redirect into the language-prefixed structure
• Vercel Web Analytics

Stack

• React 18 + React Router
• Create React App (react-scripts)
• Plain CSS, no framework — custom design system in src/assets/css (IBM Plex Sans/Mono)
• PT/EN i18n via React Context, derived from the URL and persisted in localStorage

Running locally

npm install
npm start

Runs on http://localhost:3000 by default. To use a different port, add a .env.local (gitignored):

PORT=3001

Structure

• src/components — pages and UI components
• src/assets/css — per-component stylesheets
• src/assets/img — images
• public — static assets, resume PDFs, icons

Version

0.7

Full visual and structural redesign: light, editorial single-page layout (replacing the previous dark/terminal theme), PT/EN URL routing (/pt, /en) with hreflang alternates, manual dark/light theme toggle, scrollspy navigation, keyboard-accessible mobile menu, Vercel Analytics, and a smoke test suite. Content refreshed against the current LinkedIn history (current role, updated stacks per job, AI tooling).

0.6

Content and layout refresh: real experience timeline and impact metrics sourced from the current resume, favicon/SEO metadata, asset cleanup and compression, and a handful of bug fixes.

Basic 0.5

0.5 First version: Basic navigation, some animation, it does the job. 👍